diff --git a/frontend/src/utils/useBuilderEvents.ts b/frontend/src/utils/useBuilderEvents.ts index 1bc06a9f..c16a6fa2 100644 --- a/frontend/src/utils/useBuilderEvents.ts +++ b/frontend/src/utils/useBuilderEvents.ts @@ -51,32 +51,16 @@ export function useBuilderEvents( ); useEventListener(document, "copy", (e) => { - if (isTargetEditable(e)) return; + copySelectedBlocksToClipboard(e); + }); + + useEventListener(document, "cut", (e) => { + copySelectedBlocksToClipboard(e); if (store.activeCanvas?.selectedBlocks.length) { - e.preventDefault(); - const componentDocuments: BuilderComponent[] = []; for (const block of store.activeCanvas?.selectedBlocks) { - const components = block.getUsedComponentNames(); - for (const componentName of components) { - const component = componentStore.getComponent(componentName); - if (component) { - componentDocuments.push(component); - } - } + store.activeCanvas?.removeBlock(block, true); } - - const blocksToCopy = store.activeCanvas?.selectedBlocks.map((block) => { - if (!Boolean(block.extendedFromComponent) && block.isChildOfComponent) { - return detachBlockFromComponent(block); - } - return getCopyWithoutParent(block); - }); - // just copy non components - const dataToCopy = { - blocks: blocksToCopy, - components: componentDocuments, - }; - copyToClipboard(dataToCopy, e, "builder-copied-blocks"); + clearSelection(); } }); @@ -463,3 +447,34 @@ const clearSelection = () => { document.activeElement.blur(); } }; + +const copySelectedBlocksToClipboard = (e: ClipboardEvent) => { + if (isTargetEditable(e)) return; + if (store.activeCanvas?.selectedBlocks.length) { + e.preventDefault(); + const componentDocuments: BuilderComponent[] = []; + for (const block of store.activeCanvas?.selectedBlocks) { + const components = block.getUsedComponentNames(); + for (const componentName of components) { + const component = componentStore.getComponent(componentName); + if (component) { + componentDocuments.push(component); + } + } + } + + const blocksToCopy = store.activeCanvas?.selectedBlocks.map((block) => { + if (!Boolean(block.extendedFromComponent) && block.isChildOfComponent) { + return detachBlockFromComponent(block, null); + } + return getCopyWithoutParent(block); + }); + + // just copy non components + const dataToCopy = { + blocks: blocksToCopy, + components: componentDocuments, + }; + copyToClipboard(dataToCopy, e, "builder-copied-blocks"); + } +};