From 3af8549379703467de08e036c72225cd8fc8a3ea Mon Sep 17 00:00:00 2001
From: Ruben Fiszel <ruben@rubenfiszel.com>
Date: Thu, 9 Mar 2023 19:56:47 +0100
Subject: [PATCH] app nits

---
 .../apps/components/layout/AppContainer.svelte       |  2 +-
 .../components/apps/components/layout/AppTabs.svelte |  2 +-
 .../apps/editor/settingsPanel/ComponentPanel.svelte  | 12 ++++++++++++
 3 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/components/apps/components/layout/AppContainer.svelte b/frontend/src/lib/components/apps/components/layout/AppContainer.svelte
index 0f2072f25a..53f2aa6473 100644
--- a/frontend/src/lib/components/apps/components/layout/AppContainer.svelte
+++ b/frontend/src/lib/components/apps/components/layout/AppContainer.svelte
@@ -31,7 +31,7 @@
 
 <InputValue {id} input={configuration.noPadding} bind:value={noPadding} />
 
-<div class="border">
+<div>
 	{#if $app.subgrids?.[`${id}-0`]}
 		<SubGridEditor
 			visible={render}
diff --git a/frontend/src/lib/components/apps/components/layout/AppTabs.svelte b/frontend/src/lib/components/apps/components/layout/AppTabs.svelte
index 05b72acb67..aac1c06e1c 100644
--- a/frontend/src/lib/components/apps/components/layout/AppTabs.svelte
+++ b/frontend/src/lib/components/apps/components/layout/AppTabs.svelte
@@ -75,7 +75,7 @@
 	$: selected && handleTabSelection()
 
 	$: outputs = $worldStore?.outputsById[id] as {
-		selectedTabIndex: Output<number | null>
+		selectedTabIndex: Output<number>
 	}
 
 	$: selectedIndex = tabs?.indexOf(selected) ?? -1
diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
index c50e306fa0..e3fee02803 100644
--- a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
+++ b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte
@@ -80,8 +80,20 @@
 		component?.componentInput?.type === 'template' && $worldStore
 			? buildExtraLib($worldStore?.outputsById ?? {}, component?.id, false)
 			: undefined
+
+	function keydown(event: KeyboardEvent) {
+		switch (event.key) {
+			case 'Delete': {
+				removeGridElement()
+				event.stopPropagation()
+				break
+			}
+		}
+	}
 </script>
 
+<svelte:window on:keydown={keydown} />
+
 {#if component}
 	<div class="flex flex-col min-w-[150px] w-full divide-y">
 		{#if component.componentInput}