From 6b074ed71880353db7c904d42423f97d11a871b2 Mon Sep 17 00:00:00 2001 From: "opencode-agent[bot]" <219766164+opencode-agent[bot]@users.noreply.github.com> Date: Tue, 30 Jun 2026 16:32:25 +1000 Subject: [PATCH] fix(app): suppress middle-click tab auxclick (#34355) Co-authored-by: Luke Parker <10430890+Hona@users.noreply.github.com> Co-authored-by: opencode-agent[bot] --- .../app/src/components/titlebar-tab-nav.tsx | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/packages/app/src/components/titlebar-tab-nav.tsx b/packages/app/src/components/titlebar-tab-nav.tsx index 9d9df7d2c9..499c50bf63 100644 --- a/packages/app/src/components/titlebar-tab-nav.tsx +++ b/packages/app/src/components/titlebar-tab-nav.tsx @@ -13,6 +13,9 @@ import type { Session } from "@opencode-ai/sdk/v2" import { canOpenTabRename, forwardTabRef } from "./titlebar-tab-gesture" import "./titlebar-tab-nav.css" +// MouseEvent.button uses 1 for the middle/wheel button. +const MIDDLE_MOUSE_BUTTON = 1 + export function TabNavItem(props: { ref?: Ref href: string @@ -184,7 +187,12 @@ export function TabNavItem(props: { data-dragging={props.dragging} data-pressed={props.pressed} onMouseDown={(event) => { - if (event.button !== 1) return + if (event.button !== MIDDLE_MOUSE_BUTTON) return + event.preventDefault() + event.stopPropagation() + }} + onAuxClick={(event) => { + if (event.button !== MIDDLE_MOUSE_BUTTON) return closeTab(event) }} > @@ -302,7 +310,12 @@ export function DraftTabItem(props: { class="group relative flex h-7 w-full min-w-0 flex-row items-center gap-1.5 overflow-hidden rounded-[6px] bg-[var(--tab-bg)] px-1.5 [container-type:inline-size] whitespace-nowrap [--tab-bg:var(--v2-background-bg-deep)] hover:[--tab-bg:var(--v2-background-bg-layer-02)] has-[>a:focus-visible]:[--tab-bg:var(--v2-background-bg-layer-02)] data-[active='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[dragging='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[pressed='true']:[--tab-bg:var(--v2-background-bg-layer-02)] data-[editing='true']:[--tab-bg:var(--v2-background-bg-layer-02)]" classList={{ invisible: props.hidden }} onMouseDown={(event) => { - if (event.button !== 1) return + if (event.button !== MIDDLE_MOUSE_BUTTON) return + event.preventDefault() + event.stopPropagation() + }} + onAuxClick={(event) => { + if (event.button !== MIDDLE_MOUSE_BUTTON) return closeTab(event) }} >