From 9dd6f8e92f505a381510a9d5042e2fb61224fdec Mon Sep 17 00:00:00 2001 From: Ilya Maroz <37909603+ilyamore88@users.noreply.github.com> Date: Fri, 17 Apr 2026 20:55:33 +0100 Subject: [PATCH 1/4] feat(eventbus): create CopyUIEvent entity --- .../EventBus/events/ui/CopyUIEvent.ts | 28 +++++++++++++++++++ .../src/entities/EventBus/events/ui/index.ts | 1 + 2 files changed, 29 insertions(+) create mode 100644 packages/sdk/src/entities/EventBus/events/ui/CopyUIEvent.ts diff --git a/packages/sdk/src/entities/EventBus/events/ui/CopyUIEvent.ts b/packages/sdk/src/entities/EventBus/events/ui/CopyUIEvent.ts new file mode 100644 index 00000000..2472dcfe --- /dev/null +++ b/packages/sdk/src/entities/EventBus/events/ui/CopyUIEvent.ts @@ -0,0 +1,28 @@ +import { UIEventBase } from './UIEventBase.js'; + +/** + * Name of the copy UI event (dispatched as `ui:copy`) + */ +export const CopyUIEventName = 'copy'; + +/** + * Payload @todo update doc + */ +export interface CopyUIEventPayload { + /** + * @todo update doc + */ + nativeEvent: ClipboardEvent; +} + +/** + * Delegated copy event from the editor @todo update doc + */ +export class CopyUIEvent extends UIEventBase { + /** + * @param payload - carries the original DOM `ClipboardEvent` as `nativeEvent` for providing rich clipboard data + */ + constructor(payload: CopyUIEventPayload) { + super(CopyUIEventName, payload); + } +} diff --git a/packages/sdk/src/entities/EventBus/events/ui/index.ts b/packages/sdk/src/entities/EventBus/events/ui/index.ts index 69856918..c4770540 100644 --- a/packages/sdk/src/entities/EventBus/events/ui/index.ts +++ b/packages/sdk/src/entities/EventBus/events/ui/index.ts @@ -1,3 +1,4 @@ export * from './UIEventBase.js'; export * from './BeforeInputUIEvent.js'; export * from './KeydownUIEvent.js'; +export * from './CopyUIEvent.js'; From b53c482f26f21768c06b98f8e948579507fddb03 Mon Sep 17 00:00:00 2001 From: Ilya Maroz <37909603+ilyamore88@users.noreply.github.com> Date: Fri, 17 Apr 2026 21:19:53 +0100 Subject: [PATCH 2/4] feat(ui-blocks): subscribe for copy event and pass native event object to eventbus --- packages/ui/src/Blocks/Blocks.ts | 21 ++++++++++++++++----- 1 file changed, 16 insertions(+), 5 deletions(-) diff --git a/packages/ui/src/Blocks/Blocks.ts b/packages/ui/src/Blocks/Blocks.ts index 30df927a..e2c367fb 100644 --- a/packages/ui/src/Blocks/Blocks.ts +++ b/packages/ui/src/Blocks/Blocks.ts @@ -1,13 +1,14 @@ -import type { BlockAddedCoreEvent, - BlockRemovedCoreEvent, - EditorjsPlugin, - EditorjsPluginParams } from '@editorjs/sdk'; +import { CopyUIEvent } from '@editorjs/sdk'; import { CoreEventType, UiComponentType, BeforeInputUIEvent } from '@editorjs/sdk'; -import type { EventBus } from '@editorjs/sdk'; +import type { EventBus, + BlockAddedCoreEvent, + BlockRemovedCoreEvent, CopyUIEventPayload, + EditorjsPlugin, + EditorjsPluginParams } from '@editorjs/sdk'; import Style from './Blocks.module.pcss'; import { isNativeInput, make } from '@editorjs/dom'; import { BlocksHolderRenderedUIEvent, BlockSelectedUIEvent } from './events/index.js'; @@ -130,6 +131,16 @@ export class BlocksUI implements EditorjsPlugin { e.preventDefault(); }); + blocksHolder.addEventListener('copy', (e) => { + const payload: CopyUIEventPayload = { + nativeEvent: e, + }; + + this.#eventBus.dispatchEvent(new CopyUIEvent(payload)); + + e.preventDefault(); + }); + return blocksHolder; } From 0be2ca499b3ec69198381072431cd934d10db3a2 Mon Sep 17 00:00:00 2001 From: Ilya Maroz <37909603+ilyamore88@users.noreply.github.com> Date: Fri, 17 Apr 2026 21:22:22 +0100 Subject: [PATCH 3/4] feat(core): init clipboard plugin --- packages/core/src/plugins/ClipboardPlugin.ts | 32 ++++++++++++++++++++ 1 file changed, 32 insertions(+) create mode 100644 packages/core/src/plugins/ClipboardPlugin.ts diff --git a/packages/core/src/plugins/ClipboardPlugin.ts b/packages/core/src/plugins/ClipboardPlugin.ts new file mode 100644 index 00000000..fca4af3e --- /dev/null +++ b/packages/core/src/plugins/ClipboardPlugin.ts @@ -0,0 +1,32 @@ +import type { CopyUIEvent, EditorAPI, EditorjsPlugin, EditorjsPluginParams } from '@editorjs/sdk'; +import { CopyUIEventName } from '@editorjs/sdk'; +import { PluginType } from '@editorjs/sdk'; + +/** + * @todo update doc + */ +export class ClipboardPlugin implements EditorjsPlugin { + public static readonly type = PluginType.Plugin; + + readonly #api: EditorAPI; + + /** + * @param params @todo update doc + */ + constructor(params: EditorjsPluginParams) { + const { api, eventBus } = params; + + this.#api = api; + + eventBus.addEventListener(`ui:${CopyUIEventName}`, (e: CopyUIEvent) => { + console.log('Copied to clipboard plugin', e.detail); + }); + } + + /** + * @todo update doc + */ + public destroy(): void { + // do nothing + } +} From 10c1c22e669f0612168268da557951dfd8d8946e Mon Sep 17 00:00:00 2001 From: Ilya Maroz <37909603+ilyamore88@users.noreply.github.com> Date: Fri, 17 Apr 2026 21:23:12 +0100 Subject: [PATCH 4/4] feat(core): use ClipboardPlugin --- packages/core/src/index.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index c5f7aa6f..69deda5e 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -21,6 +21,7 @@ import { EditorAPI } from './api/index.js'; import { generateId } from './utils/uid.js'; import { Paragraph, BoldInlineTool, LinkInlineTool, ItalicInlineTool } from './tools/internal'; import { ShortcutsPlugin } from './plugins/ShortcutsPlugin.js'; +import { ClipboardPlugin } from './plugins/ClipboardPlugin.js'; /** * If no holder is provided via config, the editor will be appended to the element with this id @@ -135,6 +136,7 @@ export default class Core { this.use(ItalicInlineTool); this.use(LinkInlineTool); this.use(ShortcutsPlugin); + this.use(ClipboardPlugin); } /**