From 1497f3f680fc9419a654208a776d4039c026959e Mon Sep 17 00:00:00 2001 From: Maurits Lourens Date: Mon, 26 Jul 2021 23:48:59 +0200 Subject: [PATCH] delete component using the keyboard --- .../design/AppPreview/CurrentItemPreview.svelte | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte index 607061013d..a6d186817c 100644 --- a/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte +++ b/packages/builder/src/components/design/AppPreview/CurrentItemPreview.svelte @@ -103,8 +103,7 @@ } else if (type === "update-prop") { store.actions.components.updateProp(data.prop, data.value) } else if (type === "delete-component" && data.id) { - idToDelete = data.id - confirmDeleteDialog.show() + confirmDeleteComponent(data.id) } else if (type === "preview-loaded") { // Wait for this event to show the client library if intelligent // loading is supported @@ -113,8 +112,19 @@ console.warning(`Client sent unknown event type: ${type}`) } }) + + iframe.contentWindow.addEventListener("keydown", event => { + if ((event.key === "Delete" || event.key === "Backspace") && selectedComponentId) { + confirmDeleteComponent(selectedComponentId); + } + }) }) + const confirmDeleteComponent = (componentId) => { + idToDelete = componentId + confirmDeleteDialog.show() + } + const deleteComponent = () => { store.actions.components.delete({ _id: idToDelete }) idToDelete = null