From 4444942b46092d5f2acdbe6bb994a798bc37bcba Mon Sep 17 00:00:00 2001
From: Abdo <abdo@abdnh.net>
Date: Thu, 14 Aug 2025 08:57:03 +0300
Subject: [PATCH] Add selector shortcuts

---
 ts/lib/components/DeckChooser.svelte     | 1 +
 ts/lib/components/ItemChooser.svelte     | 5 ++++-
 ts/lib/components/Modal.svelte           | 4 ++++
 ts/lib/components/NotetypeChooser.svelte | 1 +
 4 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/ts/lib/components/DeckChooser.svelte b/ts/lib/components/DeckChooser.svelte
index 030318b60..543dcfd8e 100644
--- a/ts/lib/components/DeckChooser.svelte
+++ b/ts/lib/components/DeckChooser.svelte
@@ -31,4 +31,5 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     {onChange}
     items={decks}
     icon={mdiBookOutline}
+    keyCombination="Control+D"
 />
diff --git a/ts/lib/components/ItemChooser.svelte b/ts/lib/components/ItemChooser.svelte
index 30de6b05a..f0493b4dd 100644
--- a/ts/lib/components/ItemChooser.svelte
+++ b/ts/lib/components/ItemChooser.svelte
@@ -10,16 +10,18 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     import Modal from "./Modal.svelte";
     import type { IconData } from "./types";
     import * as tr from "@generated/ftl";
+    import Shortcut from "./Shortcut.svelte";
 
     interface Props {
         title: string;
         selectedItem?: Item | null;
         items: Item[];
         icon: IconData;
+        keyCombination: string;
         onChange?: (item: Item) => void;
     }
 
-    let { title, onChange, icon, items, selectedItem = $bindable(null) }: Props = $props();
+    let { title, onChange, icon, items, selectedItem = $bindable(null), keyCombination }: Props = $props();
     let modal: Modal | null = $state(null);
     let searchQuery = $state("");
 
@@ -54,6 +56,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     {selectedItem?.name ?? "…"}
 </LabelButton>
 
+<Shortcut keyCombination={keyCombination} on:action={() => modal?.toggle()} />
 <Modal bind:this={modal} dialogClass="modal-lg">
     <div slot="header" class="modal-header">
         <IconConstrain iconSize={90}>
diff --git a/ts/lib/components/Modal.svelte b/ts/lib/components/Modal.svelte
index 42ff38a93..435dc3ad3 100644
--- a/ts/lib/components/Modal.svelte
+++ b/ts/lib/components/Modal.svelte
@@ -40,6 +40,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
         modal.hide();
     }
 
+    export function toggle(): void {
+        modal.toggle();
+    }
+
     export { onOkClicked_ as acceptHandler, onCancelClicked_ as cancelHandler };
 
     const { set: setModalOpen, remove: removeModalClosingHandler } =
diff --git a/ts/lib/components/NotetypeChooser.svelte b/ts/lib/components/NotetypeChooser.svelte
index d35a184cb..65e1b2fb3 100644
--- a/ts/lib/components/NotetypeChooser.svelte
+++ b/ts/lib/components/NotetypeChooser.svelte
@@ -30,4 +30,5 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
     {onChange}
     items={notetypes}
     icon={mdiNewspaper}
+    keyCombination="Control+N"
 />