feat(utils): useButtonNavigation now exposes pressed button

app/composables/useButtonNavigation.ts

@@ -187,7 +187,40 @@ export const useButtonNavigation = <T extends Record<string, Rect>>({
     selectedButton.value = targetButton;
   };
 
-  const { onClick } = useScreen();
+  const { onClick, onMouseDown } = useScreen();
+
+  const pressedButton = ref<Entry | null>(null);
+  let lastPressedButton: Entry | null = null;
+
+  onMouseDown((x: number, y: number) => {
+    if (blockInteractions.value) return;
+
+    for (const [buttonName, buttonRect] of Object.entries(buttons) as [
+      Entry,
+      Rect,
+    ][]) {
+      const [sx, sy, sw, sh] = buttonRect;
+      if (x >= sx && x <= sx + sw && y >= sy && y <= sy + sh) {
+        if (canClickButton && !canClickButton(buttonName)) continue;
+
+        pressedButton.value = buttonName;
+        lastPressedButton = buttonName;
+        break;
+      }
+    }
+  });
+
+  const handleMouseUp = () => {
+    pressedButton.value = null;
+  };
+
+  onMounted(() => {
+    document.addEventListener("mouseup", handleMouseUp);
+  });
+
+  onUnmounted(() => {
+    document.removeEventListener("mouseup", handleMouseUp);
+  });
 
   onClick((x: number, y: number) => {
     if (blockInteractions.value) return;
@@ -200,6 +233,9 @@ export const useButtonNavigation = <T extends Record<string, Rect>>({
       if (x >= sx && x <= sx + sw && y >= sy && y <= sy + sh) {
         if (canClickButton && !canClickButton(buttonName)) continue;
 
+        if (lastPressedButton !== buttonName) break;
+        lastPressedButton = null;
+
         if (selectedButton.value === buttonName) {
           onActivate?.(buttonName);
         } else {
@@ -328,6 +364,7 @@ export const useButtonNavigation = <T extends Record<string, Rect>>({
 
   return {
     selected: readonly(selectedButton),
+    pressed: readonly(pressedButton),
     selectorPosition,
     select,
   };