ckeditor5-elements-clipboard 0.0.0-stage → 49.0.0-alpha.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Ivan Kildyushov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,28 @@
-# Temporary Holding Version
+# ckeditor5-elements-clipboard
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Clipboard commands for CKEditor 5 Elements: `ElementClipboard` registers `copyElement`, `cutElement`, `pasteElement`,
+`pasteElementBefore` and `pasteElementAfter`, which act on a whole element, through the CKEditor clipboard pipeline.
+
+## Installation
+
+This package is part of `ckeditor5-elements`. Install the whole package to use it:
+
+```sh
+npm install ckeditor5 ckeditor5-elements
+```
+
+## Usage
+
+```ts
+import { ElementClipboard } from 'ckeditor5-elements';
+
+// plugins: [..., ElementClipboard]
+await editor.execute('copyElement', element);
+await editor.execute('pasteElementAfter'); // The element at the selection.
+```
+
+See the [Clipboard guide](https://ivankild.github.io/ckeditor5-elements/guide/clipboard) of the documentation.
+
+## License
+
+MIT

package/dist/augmentation.d.ts

@@ -0,0 +1,14 @@
+import type { ElementClipboard, ElementCopyCommand, ElementPasteCommand } from './index.js';
+declare module 'ckeditor5' {
+    interface PluginsMap {
+        [ElementClipboard.pluginName]: ElementClipboard;
+    }
+    interface CommandsMap {
+        copyElement: ElementCopyCommand;
+        cutElement: ElementCopyCommand;
+        pasteElement: ElementPasteCommand;
+        pasteElementBefore: ElementPasteCommand;
+        pasteElementAfter: ElementPasteCommand;
+    }
+}
+//# sourceMappingURL=augmentation.d.ts.map

package/dist/augmentation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"augmentation.d.ts","sourceRoot":"","sources":["../src/augmentation.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,YAAY,CAAC;AAE5F,OAAO,QAAQ,WAAW,CAAC;IAC1B,UAAU,UAAU;QACnB,CAAC,gBAAgB,CAAC,UAAU,CAAC,EAAE,gBAAgB,CAAC;KAChD;IAED,UAAU,WAAW;QACpB,WAAW,EAAE,kBAAkB,CAAC;QAChC,UAAU,EAAE,kBAAkB,CAAC;QAC/B,YAAY,EAAE,mBAAmB,CAAC;QAClC,kBAAkB,EAAE,mBAAmB,CAAC;QACxC,iBAAiB,EAAE,mBAAmB,CAAC;KACvC;CACD"}

package/dist/augmentation.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=augmentation.js.map

package/dist/augmentation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"augmentation.js","sourceRoot":"","sources":["../src/augmentation.ts"],"names":[],"mappings":""}

package/dist/elementClipboard.d.ts

@@ -0,0 +1,18 @@
+import { ClipboardPipeline, Notification, Plugin } from 'ckeditor5';
+/**
+ * Registers clipboard commands that act on an element:
+ * `copyElement`, `cutElement`, `pasteElement`, `pasteElementBefore` and `pasteElementAfter`.
+ *
+ * ```ts
+ * await editor.execute('copyElement', element);
+ * ```
+ *
+ * The commands have titles and icons, so they can be menu items (e.g. in the `elementContextMenu` config of
+ * `ElementContextMenu`) and buttons. Copying and pasting go through the clipboard pipeline, as Ctrl+C and Ctrl+V do.
+ */
+export default class ElementClipboard extends Plugin {
+    static get requires(): readonly [typeof ClipboardPipeline, typeof Notification];
+    static get pluginName(): 'ElementClipboard';
+    init(): void;
+}
+//# sourceMappingURL=elementClipboard.d.ts.map

package/dist/elementClipboard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementClipboard.d.ts","sourceRoot":"","sources":["../src/elementClipboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAIpE;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,OAAO,gBAAiB,SAAQ,MAAM;IACnD,WAAkB,QAAQ,IAAI,SAAS,CAAC,OAAO,iBAAiB,EAAE,OAAO,YAAY,CAAC,CAGrF;IAED,WAAkB,UAAU,IAAI,kBAAkB,CAEjD;IAEM,IAAI,IAAI,IAAI;CASnB"}

package/dist/elementClipboard.js

@@ -0,0 +1,32 @@
+import { ClipboardPipeline, Notification, Plugin } from 'ckeditor5';
+import ElementCopyCommand from './elementCopyCommand.js';
+import ElementPasteCommand from './elementPasteCommand.js';
+/**
+ * Registers clipboard commands that act on an element:
+ * `copyElement`, `cutElement`, `pasteElement`, `pasteElementBefore` and `pasteElementAfter`.
+ *
+ * ```ts
+ * await editor.execute('copyElement', element);
+ * ```
+ *
+ * The commands have titles and icons, so they can be menu items (e.g. in the `elementContextMenu` config of
+ * `ElementContextMenu`) and buttons. Copying and pasting go through the clipboard pipeline, as Ctrl+C and Ctrl+V do.
+ */
+export default class ElementClipboard extends Plugin {
+    static get requires() {
+        // The buttons of the commands report failures (e.g. no clipboard permission) with notifications.
+        return [ClipboardPipeline, Notification];
+    }
+    static get pluginName() {
+        return 'ElementClipboard';
+    }
+    init() {
+        const editor = this.editor;
+        editor.commands.add('copyElement', new ElementCopyCommand(editor));
+        editor.commands.add('cutElement', new ElementCopyCommand(editor, { cut: true }));
+        editor.commands.add('pasteElement', new ElementPasteCommand(editor, 'replace'));
+        editor.commands.add('pasteElementBefore', new ElementPasteCommand(editor, 'before'));
+        editor.commands.add('pasteElementAfter', new ElementPasteCommand(editor, 'after'));
+    }
+}
+//# sourceMappingURL=elementClipboard.js.map

package/dist/elementClipboard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementClipboard.js","sourceRoot":"","sources":["../src/elementClipboard.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACpE,OAAO,kBAAkB,MAAM,yBAAyB,CAAC;AACzD,OAAO,mBAAmB,MAAM,0BAA0B,CAAC;AAE3D;;;;;;;;;;GAUG;AACH,MAAM,CAAC,OAAO,OAAO,gBAAiB,SAAQ,MAAM;IAC5C,MAAM,KAAK,QAAQ;QACzB,iGAAiG;QACjG,OAAO,CAAC,iBAAiB,EAAE,YAAY,CAAU,CAAC;IACnD,CAAC;IAEM,MAAM,KAAK,UAAU;QAC3B,OAAO,kBAA2B,CAAC;IACpC,CAAC;IAEM,IAAI;QACV,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;QAE3B,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,aAAa,EAAE,IAAI,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAC;QACnE,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,YAAY,EAAE,IAAI,kBAAkB,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QACjF,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,cAAc,EAAE,IAAI,mBAAmB,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC;QAChF,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,oBAAoB,EAAE,IAAI,mBAAmB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAC;QACrF,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,mBAAmB,EAAE,IAAI,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IACpF,CAAC;CACD"}

package/dist/elementCopyCommand.d.ts

@@ -0,0 +1,30 @@
+import { type Editor } from 'ckeditor5';
+import { ElementOrPositionCommand, type ElementOrPosition } from 'ckeditor5-elements-core';
+/**
+ * Copies an element to the system clipboard, as HTML and plain text. With `cut: true`, it also removes the element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be copied on their own, so the command is disabled for them.
+ *
+ * The content goes through the clipboard pipeline, as with Ctrl+C: other plugins can change it (they listen to the
+ * `outputTransformation` event of `ClipboardPipeline`, and to `clipboardOutput` of the editing view document).
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ */
+export default class ElementCopyCommand extends ElementOrPositionCommand {
+    /**
+     * Whether the element is removed after copying.
+     */
+    readonly cut: boolean;
+    constructor(editor: Editor, { cut }?: {
+        cut?: boolean;
+    });
+    protected _isEnabledFor(elementOrPosition?: ElementOrPosition): boolean;
+    /**
+     * Copies the element (and removes it, with `cut: true`). Resolves when the clipboard has been written; rejects when
+     * the browser does not allow it.
+     */
+    execute(elementOrPosition?: ElementOrPosition): Promise<void>;
+}
+//# sourceMappingURL=elementCopyCommand.d.ts.map

package/dist/elementCopyCommand.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementCopyCommand.d.ts","sourceRoot":"","sources":["../src/elementCopyCommand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgF,KAAK,MAAM,EAAE,MAAM,WAAW,CAAC;AACtH,OAAO,EAAE,wBAAwB,EAA8B,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAGvH;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,wBAAwB;IACvE;;OAEG;IACH,SAAgB,GAAG,EAAE,OAAO,CAAC;gBAEjB,MAAM,EAAE,MAAM,EAAE,EAAE,GAAW,EAAE,GAAE;QAAE,GAAG,CAAC,EAAE,OAAO,CAAA;KAAO;cAWhD,aAAa,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,OAAO;IAMhF;;;OAGG;IACmB,OAAO,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,OAAO,CAAC,IAAI,CAAC;CA+BnF"}

package/dist/elementCopyCommand.js

@@ -0,0 +1,64 @@
+import { ClipboardPipeline, ViewDataTransfer } from 'ckeditor5';
+import { ElementOrPositionCommand, isInDocument, isStandalone } from 'ckeditor5-elements-core';
+import { copyIcon, cutIcon } from './icons.js';
+/**
+ * Copies an element to the system clipboard, as HTML and plain text. With `cut: true`, it also removes the element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be copied on their own, so the command is disabled for them.
+ *
+ * The content goes through the clipboard pipeline, as with Ctrl+C: other plugins can change it (they listen to the
+ * `outputTransformation` event of `ClipboardPipeline`, and to `clipboardOutput` of the editing view document).
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ */
+export default class ElementCopyCommand extends ElementOrPositionCommand {
+    /**
+     * Whether the element is removed after copying.
+     */
+    cut;
+    constructor(editor, { cut = false } = {}) {
+        super(editor);
+        this.cut = cut;
+        this.title = cut ? editor.t('Cut') : editor.t('Copy');
+        this.icon = cut ? cutIcon : copyIcon;
+        // Copying does not change the data, so it stays enabled in read-only mode.
+        this.affectsData = cut;
+    }
+    _isEnabledFor(elementOrPosition) {
+        const element = this._getElement(elementOrPosition);
+        return window.isSecureContext && !!element && isStandalone(this.editor.model.schema, element);
+    }
+    /**
+     * Copies the element (and removes it, with `cut: true`). Resolves when the clipboard has been written; rejects when
+     * the browser does not allow it.
+     */
+    async execute(elementOrPosition) {
+        const editor = this.editor;
+        const model = editor.model;
+        const element = this._getElement(elementOrPosition);
+        if (!element || !isStandalone(model.schema, element)) {
+            return;
+        }
+        const dataTransfer = new ViewDataTransfer(new DataTransfer());
+        // Always "copy": the pipeline would remove the content of the document selection when cutting.
+        editor.plugins.get(ClipboardPipeline).fire('outputTransformation', {
+            dataTransfer,
+            content: model.getSelectedContent(model.createSelection(element, 'on')),
+            method: 'copy'
+        });
+        await navigator.clipboard.write([
+            new ClipboardItem({
+                'text/html': new Blob([dataTransfer.getData('text/html')], { type: 'text/html' }),
+                'text/plain': new Blob([dataTransfer.getData('text/plain')], { type: 'text/plain' })
+            })
+        ]);
+        if (this.cut && isInDocument(element) && model.canEditAt(element)) {
+            model.change(writer => {
+                writer.remove(element);
+            });
+        }
+    }
+}
+//# sourceMappingURL=elementCopyCommand.js.map

package/dist/elementCopyCommand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementCopyCommand.js","sourceRoot":"","sources":["../src/elementCopyCommand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAwD,MAAM,WAAW,CAAC;AACtH,OAAO,EAAE,wBAAwB,EAAE,YAAY,EAAE,YAAY,EAA0B,MAAM,yBAAyB,CAAC;AACvH,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAE/C;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,OAAO,OAAO,kBAAmB,SAAQ,wBAAwB;IACvE;;OAEG;IACa,GAAG,CAAU;IAE7B,YAAY,MAAc,EAAE,EAAE,GAAG,GAAG,KAAK,KAAwB,EAAE;QAClE,KAAK,CAAC,MAAM,CAAC,CAAC;QAEd,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC;QACf,IAAI,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC;QACtD,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC;QAErC,2EAA2E;QAC3E,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC;IACxB,CAAC;IAEkB,aAAa,CAAC,iBAAqC;QACrE,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAEpD,OAAO,MAAM,CAAC,eAAe,IAAI,CAAC,CAAC,OAAO,IAAI,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/F,CAAC;IAED;;;OAGG;IACa,KAAK,CAAC,OAAO,CAAC,iBAAqC;QAClE,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC;QAC3B,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;QAC3B,MAAM,OAAO,GAAG,IAAI,CAAC,WAAW,CAAC,iBAAiB,CAAC,CAAC;QAEpD,IAAI,CAAC,OAAO,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,EAAE,CAAC;YACtD,OAAO;QACR,CAAC;QAED,MAAM,YAAY,GAAG,IAAI,gBAAgB,CAAC,IAAI,YAAY,EAAE,CAAC,CAAC;QAE9D,+FAA+F;QAC/F,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC,IAAI,CAAqC,sBAAsB,EAAE;YACtG,YAAY;YACZ,OAAO,EAAE,KAAK,CAAC,kBAAkB,CAAC,KAAK,CAAC,eAAe,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;YACvE,MAAM,EAAE,MAAM;SACd,CAAC,CAAC;QAEH,MAAM,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC;YAC/B,IAAI,aAAa,CAAC;gBACjB,WAAW,EAAE,IAAI,IAAI,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,CAAC;gBACjF,YAAY,EAAE,IAAI,IAAI,CAAC,CAAC,YAAY,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC;aACpF,CAAC;SACF,CAAC,CAAC;QAEH,IAAI,IAAI,CAAC,GAAG,IAAI,YAAY,CAAC,OAAO,CAAC,IAAI,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC;YACnE,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE;gBACrB,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YACxB,CAAC,CAAC,CAAC;QACJ,CAAC;IACF,CAAC;CACD"}

package/dist/elementPasteCommand.d.ts

@@ -0,0 +1,38 @@
+import { type Editor } from 'ckeditor5';
+import { ElementOrPositionCommand, type ElementOrPosition } from 'ckeditor5-elements-core';
+/**
+ * Where the pasted content goes, relative to the element:
+ *
+ * * `'replace'` – replaces the element,
+ * * `'before'` – before the element,
+ * * `'after'` – after the element.
+ */
+export type ElementPastePlacement = 'replace' | 'before' | 'after';
+/**
+ * Pastes the system clipboard content relative to an element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be replaced, nor have content pasted next to them, so the command is disabled for them.
+ *
+ * The content is pasted as with Ctrl+V: it goes through the clipboard pipeline (the `clipboardInput` event of the
+ * editing view document), so other plugins process it, e.g. paste from Office cleans up content from Word, and image
+ * upload uploads the images on the clipboard. The selection is moved to the pasted content.
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ * The browser may ask the user for permission.
+ */
+export default class ElementPasteCommand extends ElementOrPositionCommand {
+    /**
+     * Where the pasted content goes, relative to the element.
+     */
+    readonly placement: ElementPastePlacement;
+    constructor(editor: Editor, placement: ElementPastePlacement);
+    protected _isEnabledFor(elementOrPosition?: ElementOrPosition): boolean;
+    /**
+     * Pastes the clipboard content relative to the element. Resolves when the content has been pasted; rejects when the
+     * browser does not allow reading the clipboard.
+     */
+    execute(elementOrPosition?: ElementOrPosition): Promise<void>;
+}
+//# sourceMappingURL=elementPasteCommand.d.ts.map

package/dist/elementPasteCommand.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementPasteCommand.d.ts","sourceRoot":"","sources":["../src/elementPasteCommand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmE,KAAK,MAAM,EAAE,MAAM,WAAW,CAAC;AACzG,OAAO,EAAE,wBAAwB,EAA8B,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAGvH;;;;;;GAMG;AACH,MAAM,MAAM,qBAAqB,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEnE;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,wBAAwB;IACxE;;OAEG;IACH,SAAgB,SAAS,EAAE,qBAAqB,CAAC;gBAErC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,qBAAqB;cAYzC,aAAa,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,OAAO;IAMhF;;;OAGG;IACmB,OAAO,CAAC,iBAAiB,CAAC,EAAE,iBAAiB,GAAG,OAAO,CAAC,IAAI,CAAC;CAgDnF"}

package/dist/elementPasteCommand.js

@@ -0,0 +1,100 @@
+import { ViewDataTransfer, plainTextToHtml } from 'ckeditor5';
+import { ElementOrPositionCommand, isInDocument, isStandalone } from 'ckeditor5-elements-core';
+import { pasteAfterIcon, pasteBeforeIcon, pasteIcon } from './icons.js';
+/**
+ * Pastes the system clipboard content relative to an element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be replaced, nor have content pasted next to them, so the command is disabled for them.
+ *
+ * The content is pasted as with Ctrl+V: it goes through the clipboard pipeline (the `clipboardInput` event of the
+ * editing view document), so other plugins process it, e.g. paste from Office cleans up content from Word, and image
+ * upload uploads the images on the clipboard. The selection is moved to the pasted content.
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ * The browser may ask the user for permission.
+ */
+export default class ElementPasteCommand extends ElementOrPositionCommand {
+    /**
+     * Where the pasted content goes, relative to the element.
+     */
+    placement;
+    constructor(editor, placement) {
+        super(editor);
+        this.placement = placement;
+        this.title = {
+            replace: editor.t('Paste'),
+            before: editor.t('Paste before'),
+            after: editor.t('Paste after')
+        }[placement];
+        this.icon = { replace: pasteIcon, before: pasteBeforeIcon, after: pasteAfterIcon }[placement];
+    }
+    _isEnabledFor(elementOrPosition) {
+        const element = this._getElement(elementOrPosition);
+        return window.isSecureContext && !!element && isStandalone(this.editor.model.schema, element);
+    }
+    /**
+     * Pastes the clipboard content relative to the element. Resolves when the content has been pasted; rejects when the
+     * browser does not allow reading the clipboard.
+     */
+    async execute(elementOrPosition) {
+        // Resolve the element before reading the clipboard, as the selection may change in the meantime.
+        const element = this._getElement(elementOrPosition);
+        if (!element || !isStandalone(this.editor.model.schema, element)) {
+            return;
+        }
+        const dataTransfer = await readClipboard();
+        if (!dataTransfer || !isInDocument(element)) {
+            return;
+        }
+        const editing = this.editor.editing;
+        const model = this.editor.model;
+        const viewElement = editing.mapper.toViewElement(element);
+        if (!viewElement) {
+            return;
+        }
+        model.change(writer => {
+            const target = this.placement === 'before'
+                ? writer.createRange(writer.createPositionBefore(element))
+                : this.placement === 'after'
+                    ? writer.createRange(writer.createPositionAfter(element))
+                    : writer.createRangeOn(element);
+            if (!model.canEditAt(target)) {
+                return;
+            }
+            // The same data as `ClipboardObserver` fires for Ctrl+V. The pipeline pastes at the selection.
+            const data = {
+                dataTransfer,
+                content: dataTransfer.getData('text/html') || plainTextToHtmlOrEmpty(dataTransfer.getData('text/plain')),
+                method: 'paste',
+                target: viewElement,
+                targetRanges: [editing.mapper.toViewRange(target)]
+            };
+            writer.setSelection(target);
+            editing.view.document.fire('clipboardInput', data);
+        });
+    }
+}
+/**
+ * Reads the system clipboard into a data transfer: HTML, plain text and images (as files).
+ */
+async function readClipboard() {
+    const nativeDataTransfer = new DataTransfer();
+    for (const item of await navigator.clipboard.read()) {
+        for (const type of item.types) {
+            const blob = await item.getType(type);
+            if (type === 'text/html' || type === 'text/plain') {
+                nativeDataTransfer.setData(type, await blob.text());
+            }
+            else if (type.startsWith('image/')) {
+                nativeDataTransfer.items.add(new File([blob], `image.${type.slice('image/'.length)}`, { type }));
+            }
+        }
+    }
+    return nativeDataTransfer.types.length ? new ViewDataTransfer(nativeDataTransfer, { cacheFiles: true }) : null;
+}
+function plainTextToHtmlOrEmpty(text) {
+    return text ? plainTextToHtml(text) : '';
+}
+//# sourceMappingURL=elementPasteCommand.js.map

package/dist/elementPasteCommand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elementPasteCommand.js","sourceRoot":"","sources":["../src/elementPasteCommand.ts"],"names":[],"mappings":"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"}

package/dist/icons.d.ts

@@ -0,0 +1,24 @@
+/**
+ * The icons of the clipboard commands, in the style of the CKEditor 5 icons (20×20).
+ */
+/**
+ * Copy: CKEditor's own copy icon.
+ */
+export declare const copyIcon: string;
+/**
+ * Cut: scissors.
+ */
+export declare const cutIcon: string;
+/**
+ * Paste: a clipboard.
+ */
+export declare const pasteIcon: string;
+/**
+ * Paste before: a small clipboard above a block.
+ */
+export declare const pasteBeforeIcon: string;
+/**
+ * Paste after: a block above a small clipboard.
+ */
+export declare const pasteAfterIcon: string;
+//# sourceMappingURL=icons.d.ts.map

package/dist/icons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.d.ts","sourceRoot":"","sources":["../src/icons.ts"],"names":[],"mappings":"AAEA;;GAEG;AAEH;;GAEG;AACH,eAAO,MAAM,QAAQ,QAAW,CAAC;AAEjC;;GAEG;AACH,eAAO,MAAM,OAAO,QAGiG,CAAC;AAEtH;;GAEG;AACH,eAAO,MAAM,SAAS,QAIa,CAAC;AAEpC;;GAEG;AACH,eAAO,MAAM,eAAe,QAGuE,CAAC;AAEpG;;GAEG;AACH,eAAO,MAAM,cAAc,QAG0E,CAAC"}

package/dist/icons.js

@@ -0,0 +1,34 @@
+import { IconCopy } from 'ckeditor5';
+/**
+ * The icons of the clipboard commands, in the style of the CKEditor 5 icons (20×20).
+ */
+/**
+ * Copy: CKEditor's own copy icon.
+ */
+export const copyIcon = IconCopy;
+/**
+ * Cut: scissors.
+ */
+export const cutIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+    'M5.3 2.9 6.6 2.1l6.2 10.3a3 3 0 1 1-1.3.8L10 10.7 8.5 13.2a3 3 0 1 1-1.3-.8l2-3.3zm7.4 11.1a1.5 1.5 0 1 0 2.1 2.1 ' +
+    '1.5 1.5 0 0 0-2.1-2.1zm-7.4 0a1.5 1.5 0 1 0 2.1 2.1 1.5 1.5 0 0 0-2.1-2.1zm5.4-5.3 3.9-6.6 1.3.8-4.4 7.3z"/></svg>';
+/**
+ * Paste: a clipboard.
+ */
+export const pasteIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+    'M7.5 2h5a1 1 0 0 1 1 1v.5h1.7a1.3 1.3 0 0 1 1.3 1.3v11.9a1.3 1.3 0 0 1-1.3 1.3H4.8a1.3 1.3 0 0 1-1.3-1.3V4.8a1.3 ' +
+    '1.3 0 0 1 1.3-1.3h1.7V3a1 1 0 0 1 1-1zM8 3.5V5h4V3.5zM5 5v11.5h10V5h-1.5v.5a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1V5zm2 ' +
+    '4h6v1.5H7zm0 3h4v1.5H7z"/></svg>';
+/**
+ * Paste before: a small clipboard above a block.
+ */
+export const pasteBeforeIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+    'M8.5 1.5h3v1h1.4a.6.6 0 0 1 .6.6v5.3a.6.6 0 0 1-.6.6H7.1a.6.6 0 0 1-.6-.6V3.1a.6.6 0 0 1 .6-.6h1.4zM8 4v3.5h4V4zM3.5 ' +
+    '11h13a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1h-13a1 1 0 0 1-1-1v-5a1 1 0 0 1 1-1zm.5 1.5v4h12v-4z"/></svg>';
+/**
+ * Paste after: a block above a small clipboard.
+ */
+export const pasteAfterIcon = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+    'M3.5 2h13a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1h-13a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zm.5 1.5v4h12v-4zM8.5 10.5h3v1h1.4a.6.6 0 0 ' +
+    '1 .6.6v5.3a.6.6 0 0 1-.6.6H7.1a.6.6 0 0 1-.6-.6v-5.3a.6.6 0 0 1 .6-.6h1.4zM8 13v3.5h4V13z"/></svg>';
+//# sourceMappingURL=icons.js.map

package/dist/icons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icons.js","sourceRoot":"","sources":["../src/icons.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,WAAW,CAAC;AAErC;;GAEG;AAEH;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC;AAEjC;;GAEG;AACH,MAAM,CAAC,MAAM,OAAO,GACnB,2FAA2F;IAC3F,oHAAoH;IACpH,oHAAoH,CAAC;AAEtH;;GAEG;AACH,MAAM,CAAC,MAAM,SAAS,GACrB,2FAA2F;IAC3F,mHAAmH;IACnH,kHAAkH;IAClH,kCAAkC,CAAC;AAEpC;;GAEG;AACH,MAAM,CAAC,MAAM,eAAe,GAC3B,2FAA2F;IAC3F,uHAAuH;IACvH,kGAAkG,CAAC;AAEpG;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAC1B,2FAA2F;IAC3F,uHAAuH;IACvH,oGAAoG,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Clipboard commands that act on an element: copy, cut, paste, paste before and paste after.
+ *
+ * @module ckeditor5-elements-clipboard
+ */
+export { default as ElementClipboard } from './elementClipboard.js';
+export { default as ElementCopyCommand } from './elementCopyCommand.js';
+export { default as ElementPasteCommand, type ElementPastePlacement } from './elementPasteCommand.js';
+export { copyIcon, cutIcon, pasteAfterIcon, pasteBeforeIcon, pasteIcon } from './icons.js';
+import './augmentation.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAGpE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,KAAK,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAGtG,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE3F,OAAO,mBAAmB,CAAC"}

package/dist/index.js

@@ -0,0 +1,14 @@
+/**
+ * Clipboard commands that act on an element: copy, cut, paste, paste before and paste after.
+ *
+ * @module ckeditor5-elements-clipboard
+ */
+// Plugins.
+export { default as ElementClipboard } from './elementClipboard.js';
+// Commands.
+export { default as ElementCopyCommand } from './elementCopyCommand.js';
+export { default as ElementPasteCommand } from './elementPasteCommand.js';
+// Icons.
+export { copyIcon, cutIcon, pasteAfterIcon, pasteBeforeIcon, pasteIcon } from './icons.js';
+import './augmentation.js';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,WAAW;AACX,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEpE,YAAY;AACZ,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAA8B,MAAM,0BAA0B,CAAC;AAEtG,SAAS;AACT,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE3F,OAAO,mBAAmB,CAAC"}

package/dist/utils.d.ts

@@ -0,0 +1,7 @@
+import type { ModelElement, ModelSchema } from 'ckeditor5';
+/**
+ * Whether the element can be copied, cut or pasted over as a whole. Parts of a structure that cannot stand alone, such
+ * as a table cell, a table row or a caption, cannot: in the schema, they are limit elements that are not objects.
+ */
+export declare function isStandalone(schema: ModelSchema, element: ModelElement): boolean;
+//# sourceMappingURL=utils.d.ts.map

package/dist/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAE3D;;;GAGG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,WAAW,EAAE,OAAO,EAAE,YAAY,GAAG,OAAO,CAEhF"}

package/dist/utils.js

@@ -0,0 +1,8 @@
+/**
+ * Whether the element can be copied, cut or pasted over as a whole. Parts of a structure that cannot stand alone, such
+ * as a table cell, a table row or a caption, cannot: in the schema, they are limit elements that are not objects.
+ */
+export function isStandalone(schema, element) {
+    return !schema.isLimit(element) || schema.isObject(element);
+}
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,UAAU,YAAY,CAAC,MAAmB,EAAE,OAAqB;IACtE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;AAC7D,CAAC"}

package/package.json

@@ -1,6 +1,48 @@
 {
   "name": "ckeditor5-elements-clipboard",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "49.0.0-alpha.2",
+  "description": "Clipboard commands for CKEditor 5 elements: copy, cut, paste, paste before and paste after an element.",
+  "keywords": [
+    "ckeditor",
+    "ckeditor5",
+    "ckeditor 5",
+    "ckeditor5-feature",
+    "ckeditor5-plugin"
+  ],
+  "license": "MIT",
+  "author": "Ivan Kildyushov",
+  "homepage": "https://ivankild.github.io/ckeditor5-elements/guide/clipboard",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ivankild/ckeditor5-elements.git",
+    "directory": "packages/ckeditor5-elements-clipboard"
+  },
+  "bugs": {
+    "url": "https://github.com/ivankild/ckeditor5-elements/issues"
+  },
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist",
+    "src",
+    "README.md"
+  ],
+  "sideEffects": false,
+  "dependencies": {
+    "ckeditor5-elements-core": "49.0.0-alpha.2"
+  },
+  "peerDependencies": {
+    "ckeditor5": "^49.0.0"
+  },
+  "scripts": {
+    "build": "tsc --build"
+  }
 }

package/src/augmentation.ts

@@ -0,0 +1,15 @@
+import type { ElementClipboard, ElementCopyCommand, ElementPasteCommand } from './index.js';
+
+declare module 'ckeditor5' {
+	interface PluginsMap {
+		[ElementClipboard.pluginName]: ElementClipboard;
+	}
+
+	interface CommandsMap {
+		copyElement: ElementCopyCommand;
+		cutElement: ElementCopyCommand;
+		pasteElement: ElementPasteCommand;
+		pasteElementBefore: ElementPasteCommand;
+		pasteElementAfter: ElementPasteCommand;
+	}
+}

package/src/elementClipboard.ts

@@ -0,0 +1,35 @@
+import { ClipboardPipeline, Notification, Plugin } from 'ckeditor5';
+import ElementCopyCommand from './elementCopyCommand.js';
+import ElementPasteCommand from './elementPasteCommand.js';
+
+/**
+ * Registers clipboard commands that act on an element:
+ * `copyElement`, `cutElement`, `pasteElement`, `pasteElementBefore` and `pasteElementAfter`.
+ *
+ * ```ts
+ * await editor.execute('copyElement', element);
+ * ```
+ *
+ * The commands have titles and icons, so they can be menu items (e.g. in the `elementContextMenu` config of
+ * `ElementContextMenu`) and buttons. Copying and pasting go through the clipboard pipeline, as Ctrl+C and Ctrl+V do.
+ */
+export default class ElementClipboard extends Plugin {
+	public static get requires(): readonly [typeof ClipboardPipeline, typeof Notification] {
+		// The buttons of the commands report failures (e.g. no clipboard permission) with notifications.
+		return [ClipboardPipeline, Notification] as const;
+	}
+
+	public static get pluginName(): 'ElementClipboard' {
+		return 'ElementClipboard' as const;
+	}
+
+	public init(): void {
+		const editor = this.editor;
+
+		editor.commands.add('copyElement', new ElementCopyCommand(editor));
+		editor.commands.add('cutElement', new ElementCopyCommand(editor, { cut: true }));
+		editor.commands.add('pasteElement', new ElementPasteCommand(editor, 'replace'));
+		editor.commands.add('pasteElementBefore', new ElementPasteCommand(editor, 'before'));
+		editor.commands.add('pasteElementAfter', new ElementPasteCommand(editor, 'after'));
+	}
+}

package/src/elementCopyCommand.ts

@@ -0,0 +1,75 @@
+import { ClipboardPipeline, ViewDataTransfer, type ClipboardOutputTransformationEvent, type Editor } from 'ckeditor5';
+import { ElementOrPositionCommand, isInDocument, isStandalone, type ElementOrPosition } from 'ckeditor5-elements-core';
+import { copyIcon, cutIcon } from './icons.js';
+
+/**
+ * Copies an element to the system clipboard, as HTML and plain text. With `cut: true`, it also removes the element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be copied on their own, so the command is disabled for them.
+ *
+ * The content goes through the clipboard pipeline, as with Ctrl+C: other plugins can change it (they listen to the
+ * `outputTransformation` event of `ClipboardPipeline`, and to `clipboardOutput` of the editing view document).
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ */
+export default class ElementCopyCommand extends ElementOrPositionCommand {
+	/**
+	 * Whether the element is removed after copying.
+	 */
+	public readonly cut: boolean;
+
+	constructor(editor: Editor, { cut = false }: { cut?: boolean } = {}) {
+		super(editor);
+
+		this.cut = cut;
+		this.title = cut ? editor.t('Cut') : editor.t('Copy');
+		this.icon = cut ? cutIcon : copyIcon;
+
+		// Copying does not change the data, so it stays enabled in read-only mode.
+		this.affectsData = cut;
+	}
+
+	protected override _isEnabledFor(elementOrPosition?: ElementOrPosition): boolean {
+		const element = this._getElement(elementOrPosition);
+
+		return window.isSecureContext && !!element && isStandalone(this.editor.model.schema, element);
+	}
+
+	/**
+	 * Copies the element (and removes it, with `cut: true`). Resolves when the clipboard has been written; rejects when
+	 * the browser does not allow it.
+	 */
+	public override async execute(elementOrPosition?: ElementOrPosition): Promise<void> {
+		const editor = this.editor;
+		const model = editor.model;
+		const element = this._getElement(elementOrPosition);
+
+		if (!element || !isStandalone(model.schema, element)) {
+			return;
+		}
+
+		const dataTransfer = new ViewDataTransfer(new DataTransfer());
+
+		// Always "copy": the pipeline would remove the content of the document selection when cutting.
+		editor.plugins.get(ClipboardPipeline).fire<ClipboardOutputTransformationEvent>('outputTransformation', {
+			dataTransfer,
+			content: model.getSelectedContent(model.createSelection(element, 'on')),
+			method: 'copy'
+		});
+
+		await navigator.clipboard.write([
+			new ClipboardItem({
+				'text/html': new Blob([dataTransfer.getData('text/html')], { type: 'text/html' }),
+				'text/plain': new Blob([dataTransfer.getData('text/plain')], { type: 'text/plain' })
+			})
+		]);
+
+		if (this.cut && isInDocument(element) && model.canEditAt(element)) {
+			model.change(writer => {
+				writer.remove(element);
+			});
+		}
+	}
+}

package/src/elementPasteCommand.ts

@@ -0,0 +1,129 @@
+import { ViewDataTransfer, plainTextToHtml, type ClipboardInputEventData, type Editor } from 'ckeditor5';
+import { ElementOrPositionCommand, isInDocument, isStandalone, type ElementOrPosition } from 'ckeditor5-elements-core';
+import { pasteAfterIcon, pasteBeforeIcon, pasteIcon } from './icons.js';
+
+/**
+ * Where the pasted content goes, relative to the element:
+ *
+ * * `'replace'` – replaces the element,
+ * * `'before'` – before the element,
+ * * `'after'` – after the element.
+ */
+export type ElementPastePlacement = 'replace' | 'before' | 'after';
+
+/**
+ * Pastes the system clipboard content relative to an element.
+ *
+ * The element is the given one, the parent of the given position, or the selected element or the parent of the
+ * selection (see {@link ElementOrPositionCommand}). Parts of a structure, such as table cells, rows and captions, cannot
+ * be replaced, nor have content pasted next to them, so the command is disabled for them.
+ *
+ * The content is pasted as with Ctrl+V: it goes through the clipboard pipeline (the `clipboardInput` event of the
+ * editing view document), so other plugins process it, e.g. paste from Office cleans up content from Word, and image
+ * upload uploads the images on the clipboard. The selection is moved to the pasted content.
+ *
+ * Requires a secure context (HTTPS or `localhost`), as it uses the asynchronous Clipboard API.
+ * The browser may ask the user for permission.
+ */
+export default class ElementPasteCommand extends ElementOrPositionCommand {
+	/**
+	 * Where the pasted content goes, relative to the element.
+	 */
+	public readonly placement: ElementPastePlacement;
+
+	constructor(editor: Editor, placement: ElementPastePlacement) {
+		super(editor);
+
+		this.placement = placement;
+		this.title = {
+			replace: editor.t('Paste'),
+			before: editor.t('Paste before'),
+			after: editor.t('Paste after')
+		}[placement];
+		this.icon = { replace: pasteIcon, before: pasteBeforeIcon, after: pasteAfterIcon }[placement];
+	}
+
+	protected override _isEnabledFor(elementOrPosition?: ElementOrPosition): boolean {
+		const element = this._getElement(elementOrPosition);
+
+		return window.isSecureContext && !!element && isStandalone(this.editor.model.schema, element);
+	}
+
+	/**
+	 * Pastes the clipboard content relative to the element. Resolves when the content has been pasted; rejects when the
+	 * browser does not allow reading the clipboard.
+	 */
+	public override async execute(elementOrPosition?: ElementOrPosition): Promise<void> {
+		// Resolve the element before reading the clipboard, as the selection may change in the meantime.
+		const element = this._getElement(elementOrPosition);
+
+		if (!element || !isStandalone(this.editor.model.schema, element)) {
+			return;
+		}
+
+		const dataTransfer = await readClipboard();
+
+		if (!dataTransfer || !isInDocument(element)) {
+			return;
+		}
+
+		const editing = this.editor.editing;
+		const model = this.editor.model;
+		const viewElement = editing.mapper.toViewElement(element);
+
+		if (!viewElement) {
+			return;
+		}
+
+		model.change(writer => {
+			const target =
+				this.placement === 'before'
+					? writer.createRange(writer.createPositionBefore(element))
+					: this.placement === 'after'
+						? writer.createRange(writer.createPositionAfter(element))
+						: writer.createRangeOn(element);
+
+			if (!model.canEditAt(target)) {
+				return;
+			}
+
+			// The same data as `ClipboardObserver` fires for Ctrl+V. The pipeline pastes at the selection.
+			const data: ClipboardInputEventData = {
+				dataTransfer,
+				content:
+					dataTransfer.getData('text/html') || plainTextToHtmlOrEmpty(dataTransfer.getData('text/plain')),
+				method: 'paste',
+				target: viewElement,
+				targetRanges: [editing.mapper.toViewRange(target)]
+			};
+
+			writer.setSelection(target);
+			editing.view.document.fire('clipboardInput', data);
+		});
+	}
+}
+
+/**
+ * Reads the system clipboard into a data transfer: HTML, plain text and images (as files).
+ */
+async function readClipboard(): Promise<ViewDataTransfer | null> {
+	const nativeDataTransfer = new DataTransfer();
+
+	for (const item of await navigator.clipboard.read()) {
+		for (const type of item.types) {
+			const blob = await item.getType(type);
+
+			if (type === 'text/html' || type === 'text/plain') {
+				nativeDataTransfer.setData(type, await blob.text());
+			} else if (type.startsWith('image/')) {
+				nativeDataTransfer.items.add(new File([blob], `image.${type.slice('image/'.length)}`, { type }));
+			}
+		}
+	}
+
+	return nativeDataTransfer.types.length ? new ViewDataTransfer(nativeDataTransfer, { cacheFiles: true }) : null;
+}
+
+function plainTextToHtmlOrEmpty(text: string): string {
+	return text ? plainTextToHtml(text) : '';
+}

package/src/icons.ts

@@ -0,0 +1,43 @@
+import { IconCopy } from 'ckeditor5';
+
+/**
+ * The icons of the clipboard commands, in the style of the CKEditor 5 icons (20×20).
+ */
+
+/**
+ * Copy: CKEditor's own copy icon.
+ */
+export const copyIcon = IconCopy;
+
+/**
+ * Cut: scissors.
+ */
+export const cutIcon =
+	'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+	'M5.3 2.9 6.6 2.1l6.2 10.3a3 3 0 1 1-1.3.8L10 10.7 8.5 13.2a3 3 0 1 1-1.3-.8l2-3.3zm7.4 11.1a1.5 1.5 0 1 0 2.1 2.1 ' +
+	'1.5 1.5 0 0 0-2.1-2.1zm-7.4 0a1.5 1.5 0 1 0 2.1 2.1 1.5 1.5 0 0 0-2.1-2.1zm5.4-5.3 3.9-6.6 1.3.8-4.4 7.3z"/></svg>';
+
+/**
+ * Paste: a clipboard.
+ */
+export const pasteIcon =
+	'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+	'M7.5 2h5a1 1 0 0 1 1 1v.5h1.7a1.3 1.3 0 0 1 1.3 1.3v11.9a1.3 1.3 0 0 1-1.3 1.3H4.8a1.3 1.3 0 0 1-1.3-1.3V4.8a1.3 ' +
+	'1.3 0 0 1 1.3-1.3h1.7V3a1 1 0 0 1 1-1zM8 3.5V5h4V3.5zM5 5v11.5h10V5h-1.5v.5a1 1 0 0 1-1 1h-5a1 1 0 0 1-1-1V5zm2 ' +
+	'4h6v1.5H7zm0 3h4v1.5H7z"/></svg>';
+
+/**
+ * Paste before: a small clipboard above a block.
+ */
+export const pasteBeforeIcon =
+	'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+	'M8.5 1.5h3v1h1.4a.6.6 0 0 1 .6.6v5.3a.6.6 0 0 1-.6.6H7.1a.6.6 0 0 1-.6-.6V3.1a.6.6 0 0 1 .6-.6h1.4zM8 4v3.5h4V4zM3.5 ' +
+	'11h13a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1h-13a1 1 0 0 1-1-1v-5a1 1 0 0 1 1-1zm.5 1.5v4h12v-4z"/></svg>';
+
+/**
+ * Paste after: a block above a small clipboard.
+ */
+export const pasteAfterIcon =
+	'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path fill-rule="evenodd" d="' +
+	'M3.5 2h13a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1h-13a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1zm.5 1.5v4h12v-4zM8.5 10.5h3v1h1.4a.6.6 0 0 ' +
+	'1 .6.6v5.3a.6.6 0 0 1-.6.6H7.1a.6.6 0 0 1-.6-.6v-5.3a.6.6 0 0 1 .6-.6h1.4zM8 13v3.5h4V13z"/></svg>';

package/src/index.ts

@@ -0,0 +1,17 @@
+/**
+ * Clipboard commands that act on an element: copy, cut, paste, paste before and paste after.
+ *
+ * @module ckeditor5-elements-clipboard
+ */
+
+// Plugins.
+export { default as ElementClipboard } from './elementClipboard.js';
+
+// Commands.
+export { default as ElementCopyCommand } from './elementCopyCommand.js';
+export { default as ElementPasteCommand, type ElementPastePlacement } from './elementPasteCommand.js';
+
+// Icons.
+export { copyIcon, cutIcon, pasteAfterIcon, pasteBeforeIcon, pasteIcon } from './icons.js';
+
+import './augmentation.js';