fix(ui): correct keyboard shortcuts guard logic

Author: danielroe

app/components/Button/Base.vue

@@ -26,7 +26,8 @@ const props = withDefaults(
 
 const el = useTemplateRef('el')
 
-const keyboardShortcutsEnabled = computed(() => import.meta.client && useKeyboardShortcuts().value)
+const keyboardShortcuts = useKeyboardShortcuts()
+const keyboardShortcutsEnabled = computed(() => import.meta.client && keyboardShortcuts.value)
 
 defineExpose({
   focus: () => el.value?.focus(),

app/components/Compare/PackageSelector.vue

@@ -97,11 +97,7 @@ function removePackage(name: string) {
   packages.value = packages.value.filter(p => p !== name)
 }
 
-const keyboardShortcutsEnabled = useKeyboardShortcuts()
-
 function handleKeydown(e: KeyboardEvent) {
-  if (!keyboardShortcutsEnabled) return
-
   const items = navigableItems.value
   const count = items.length
 

app/pages/settings.vue

@@ -5,10 +5,12 @@ const { settings } = useSettings()
 const { locale, locales, setLocale: setNuxti18nLocale } = useI18n()
 const colorMode = useColorMode()
 const { currentLocaleStatus, isSourceLocale } = useI18nStatus()
+const keyboardShortcutsEnabled = useKeyboardShortcuts()
 
 // Escape to go back (but not when focused on form elements or modal is open)
 onKeyStroke(
   e =>
+    keyboardShortcutsEnabled.value &&
     isKeyWithoutModifiers(e, 'Escape') &&
     !isEditableElement(e.target) &&
     !document.documentElement.matches('html:has(:modal)'),