fix(useKeyboardShortcuts): allow for shift key plus special characters

Support characters like '?' and uppercase letters for keyboard shortcuts.

src/composables/actions.ts

@@ -33,7 +33,7 @@ const setTool = (tool: Tools) => () => {
 
 const showKeyboardShortcuts = () => {
   const keyboardStore = useKeyboardShortcutsStore();
-  keyboardStore.settingsOpen = true;
+  keyboardStore.settingsOpen = !keyboardStore.settingsOpen;
 };
 
 export const ACTION_TO_FUNC = {

src/composables/useKeyboardShortcuts.ts

@@ -17,9 +17,25 @@ export function useKeyboardShortcuts() {
       unwatchFuncs.forEach((unwatch) => unwatch());
 
       unwatchFuncs = getEntries(actionMap).map(([action, key]) => {
+        const individualKeys = key.split('+');
+        const lastKey = individualKeys[individualKeys.length - 1];
+
         return whenever(keys[key], () => {
-          // basic detection for exact modifier match
-          if (keys.current.size === key.split('+').length) {
+          const shiftPressed = keys.current.has('shift');
+          const lastPressedKey = Array.from(keys.current).pop();
+          const currentKeyWithCase = shiftPressed
+            ? lastPressedKey?.toUpperCase() ?? lastPressedKey
+            : lastPressedKey;
+
+          // keyCountMatches checks for exact modifier match
+          const keyCountMatches = keys.current.size === individualKeys.length;
+          const lastKeyMatches = lastKey === currentKeyWithCase;
+          const shiftCaseMatches =
+            shiftPressed &&
+            keys.current.size - 1 === individualKeys.length &&
+            lastKeyMatches;
+
+          if ((keyCountMatches && lastKeyMatches) || shiftCaseMatches) {
             ACTION_TO_FUNC[action]();
           }
         });

src/config.ts

@@ -285,7 +285,7 @@ export const LAYER_PRESET_BY_MODALITY: Record<string, string> = {
 };
 export const LAYER_PRESET_DEFAULT = 'Blue to Red Rainbow';
 
-// Keyboard shortcuts/hotkeys. Can add modifiers: 'Shift+Ctrl+A'
+// Keyboard shortcuts/hotkeys. Can add modifiers: 'Shift+Ctrl+a'
 export const ACTION_TO_KEY = {
   windowLevel: 'l',
   pan: 'n',