From 12215e6a4afc2bc6cc4b230486262a4dc1634796 Mon Sep 17 00:00:00 2001
From: pa <maplenagisa@gmail.com>
Date: Tue, 17 Mar 2026 17:03:23 +0900
Subject: [PATCH] fix: Add `@select.prevent` to `ContextMenuCheckboxItem`s in
 the status bar and data table to prevent unintended context menu closure.

---
 src/components/StatusBar.vue                     | 12 +++++++++++-
 src/components/ui/data-table/DataTableLayout.vue |  3 +++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/StatusBar.vue b/src/components/StatusBar.vue
index 1078e5d0..6fcc0f45 100644
--- a/src/components/StatusBar.vue
+++ b/src/components/StatusBar.vue
@@ -246,36 +246,42 @@
                 <ContextMenuCheckboxItem
                     v-if="!isMacOS"
                     :model-value="visibility.vrchat"
+                    @select.prevent
                     @update:model-value="toggleVisibility('vrchat')">
                     {{ t('status_bar.game') }}
                 </ContextMenuCheckboxItem>
                 <ContextMenuCheckboxItem
                     :model-value="visibility.servers"
+                    @select.prevent
                     @update:model-value="toggleVisibility('servers')">
                     {{ t('status_bar.servers') }}
                 </ContextMenuCheckboxItem>
                 <ContextMenuCheckboxItem
                     v-if="!isMacOS"
                     :model-value="visibility.steamvr"
+                    @select.prevent
                     @update:model-value="toggleVisibility('steamvr')">
                     {{ t('status_bar.steamvr') }}
                 </ContextMenuCheckboxItem>
                 <ContextMenuCheckboxItem
                     :model-value="visibility.proxy"
+                    @select.prevent
                     @update:model-value="toggleVisibility('proxy')">
                     {{ t('status_bar.proxy') }}
                 </ContextMenuCheckboxItem>
-                <ContextMenuCheckboxItem :model-value="visibility.ws" @update:model-value="toggleVisibility('ws')">
+                <ContextMenuCheckboxItem :model-value="visibility.ws" @select.prevent @update:model-value="toggleVisibility('ws')">
                     WebSocket
                 </ContextMenuCheckboxItem>
                 <ContextMenuCheckboxItem
                     :model-value="visibility.uptime"
+                    @select.prevent
                     @update:model-value="toggleVisibility('uptime')">
                     {{ t('status_bar.app_uptime_short') }}
                 </ContextMenuCheckboxItem>
                 <ContextMenuCheckboxItem
                     v-if="!isMacOS"
                     :model-value="visibility.zoom"
+                    @select.prevent
                     @update:model-value="toggleVisibility('zoom')">
                     {{ t('status_bar.zoom') }}
                 </ContextMenuCheckboxItem>
@@ -285,21 +291,25 @@
                     <ContextMenuSubContent>
                         <ContextMenuCheckboxItem
                             :model-value="clockCount === 0"
+                            @select.prevent
                             @update:model-value="setClockCount('0')">
                             {{ t('status_bar.clocks_none') }}
                         </ContextMenuCheckboxItem>
                         <ContextMenuCheckboxItem
                             :model-value="clockCount === 1"
+                            @select.prevent
                             @update:model-value="setClockCount('1')">
                             1 {{ t('status_bar.clock') }}
                         </ContextMenuCheckboxItem>
                         <ContextMenuCheckboxItem
                             :model-value="clockCount === 2"
+                            @select.prevent
                             @update:model-value="setClockCount('2')">
                             2 {{ t('status_bar.clocks_label') }}
                         </ContextMenuCheckboxItem>
                         <ContextMenuCheckboxItem
                             :model-value="clockCount === 3"
+                            @select.prevent
                             @update:model-value="setClockCount('3')">
                             3 {{ t('status_bar.clocks_label') }}
                         </ContextMenuCheckboxItem>
diff --git a/src/components/ui/data-table/DataTableLayout.vue b/src/components/ui/data-table/DataTableLayout.vue
index a74d0f3d..5390d1af 100644
--- a/src/components/ui/data-table/DataTableLayout.vue
+++ b/src/components/ui/data-table/DataTableLayout.vue
@@ -73,6 +73,7 @@
                                 v-for="col in toggleableColumns"
                                 :key="col.id"
                                 :model-value="col.getIsVisible()"
+                                @select.prevent
                                 @update:model-value="col.toggleVisibility(!!$event)">
                                 {{ resolveHeaderLabel(col) }}
                             </ContextMenuCheckboxItem>
@@ -80,6 +81,7 @@
                                 <ContextMenuSeparator />
                                 <ContextMenuCheckboxItem
                                     :model-value="tcColumnOrderLocked"
+                                    @select.prevent
                                     @update:model-value="table.options.meta.columnOrderLocked.value = $event">
                                     {{ t('table.header_menu.lock_column_order') }}
                                 </ContextMenuCheckboxItem>
@@ -154,6 +156,7 @@
                             <template v-if="tcColumnOrderLocked != null">
                                 <ContextMenuCheckboxItem
                                     :model-value="tcColumnOrderLocked"
+                                    @select.prevent
                                     @update:model-value="table.options.meta.columnOrderLocked.value = $event">
                                     {{ t('table.header_menu.lock_column_order') }}
                                 </ContextMenuCheckboxItem>