feat(svelte): make nodes deletable

2023-02-23 13:44:57 +01:00
parent 658366e67f
commit bb528e6798
12 changed files with 167 additions and 39 deletions
@@ -0,0 +1,43 @@
+<script lang="ts">
+  import { shortcut } from '@svelte-put/shortcut';
+
+  import { useStore } from '$lib/store';
+  import type { KeyHandlerProps } from './KeyHandler'
+	import type { KeyDefinition, KeyDefinitionObject } from '$lib/types';
+
+  const { selectionKeyPressedStore, deleteKeyPressedStore } = useStore();
+
+  type $$Props = KeyHandlerProps;
+
+  export let selectionKey: $$Props['selectionKey'] = 'Shift'; 
+  export let deleteKey: $$Props['deleteKey'] = 'Backspace'; 
+
+  function isKeyObject(key?: KeyDefinition): key is KeyDefinitionObject {
+    return typeof key === 'object';
+  } 
+
+  $: selectionKeyString = typeof selectionKey === 'string' ? selectionKey : selectionKey!.key;
+  $: selectionKeyModifier = isKeyObject(selectionKey) ? selectionKey?.modifier : [];
+
+  $: deleteKeyString = typeof deleteKey === 'string' ? deleteKey : deleteKey!.key;
+  $: deleteKeyModifier = isKeyObject(deleteKey) ? deleteKey?.modifier : [];
+</script>
+
+<svelte:window
+  use:shortcut={{ 
+    trigger: [{ key: selectionKeyString, modifier: selectionKeyModifier, callback: () => selectionKeyPressedStore.set(true) }],
+    type: 'keydown'
+  }}
+  use:shortcut={{ 
+    trigger: [{ key: selectionKeyString, modifier: selectionKeyModifier, callback: () => selectionKeyPressedStore.set(false) }],
+    type: 'keyup'
+  }}
+  use:shortcut={{ 
+    trigger: [{ key: deleteKeyString, modifier: deleteKeyModifier, callback: () => deleteKeyPressedStore.set(true) }],
+    type: 'keydown'
+  }}
+  use:shortcut={{ 
+    trigger: [{ key: deleteKeyString, modifier: deleteKeyModifier, callback: () => deleteKeyPressedStore.set(false) }],
+    type: 'keyup'
+  }}
+/>