From 9ab5ec860293a7e2a679cf51c4e41b84063861a2 Mon Sep 17 00:00:00 2001
From: Leo Vasanko <leo@git>
Date: Fri, 22 Aug 2025 11:05:14 -0600
Subject: [PATCH] Fix tab traversal

---
 src/components/Numeric.vue | 41 +++++++++++++++++++++++++++++++-------
 1 file changed, 34 insertions(+), 7 deletions(-)

diff --git a/src/components/Numeric.vue b/src/components/Numeric.vue
index 43dea88..3f8dc35 100644
--- a/src/components/Numeric.vue
+++ b/src/components/Numeric.vue
@@ -11,7 +11,7 @@
     :aria-valuetext="display"
     tabindex="0"
     @pointerdown="onPointerDown"
-    @keydown.prevent.stop="onKey"
+    @keydown="onKey"
   >
     <span class="value" :title="String(current)">{{ display }}</span>
   </div>
@@ -103,14 +103,41 @@ function onPointerCancel() {
 
 function onKey(e) {
   const key = e.key
+  let handled = false
   let delta = 0
-  if (key === 'ArrowRight' || key === 'ArrowUp') delta = props.step
-  else if (key === 'ArrowLeft' || key === 'ArrowDown') delta = -props.step
-  else if (key === 'PageUp') delta = props.step * 10
-  else if (key === 'PageDown') delta = -props.step * 10
-  else if (key === 'Home') current.value = props.min
-  else if (key === 'End') current.value = props.max
+  switch (key) {
+    case 'ArrowRight':
+    case 'ArrowUp':
+      delta = props.step
+      handled = true
+      break
+    case 'ArrowLeft':
+    case 'ArrowDown':
+      delta = -props.step
+      handled = true
+      break
+    case 'PageUp':
+      delta = props.step * 10
+      handled = true
+      break
+    case 'PageDown':
+      delta = -props.step * 10
+      handled = true
+      break
+    case 'Home':
+      current.value = props.min
+      handled = true
+      break
+    case 'End':
+      current.value = props.max
+      handled = true
+      break
+  }
   if (delta !== 0) current.value = current.value + delta
+  if (handled) {
+    e.preventDefault()
+    e.stopPropagation()
+  }
 }
 </script>