fix: draggable tabs — use div instead of button, set dataTransfer data
All checks were successful
Build & Sign Wraith / Build Windows + Sign (push) Successful in 2m59s

Buttons resist drag in WebView2. Switched to div[role=tab] with
select-none. Added setData() call on dragstart — required by most
WebView implementations to actually initiate the drag operation.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Vantz Stockwell 2026-03-24 21:35:30 -04:00
parent 02b3ee053d
commit 5fc8951334

View File

@ -2,11 +2,12 @@
<div class="flex items-center bg-[var(--wraith-bg-secondary)] border-b border-[var(--wraith-border)] h-9 shrink-0"> <div class="flex items-center bg-[var(--wraith-bg-secondary)] border-b border-[var(--wraith-border)] h-9 shrink-0">
<!-- Tabs --> <!-- Tabs -->
<div class="flex items-center overflow-x-auto min-w-0"> <div class="flex items-center overflow-x-auto min-w-0">
<button <div
v-for="(session, index) in sessionStore.sessions" v-for="(session, index) in sessionStore.sessions"
:key="session.id" :key="session.id"
draggable="true" draggable="true"
class="group flex items-center gap-1.5 px-3 h-9 text-xs whitespace-nowrap border-r border-[var(--wraith-border)] transition-all duration-500 cursor-pointer shrink-0" role="tab"
class="group flex items-center gap-1.5 px-3 h-9 text-xs whitespace-nowrap border-r border-[var(--wraith-border)] transition-all duration-500 cursor-pointer shrink-0 select-none"
:class="[ :class="[
session.id === sessionStore.activeSessionId session.id === sessionStore.activeSessionId
? 'bg-[var(--wraith-bg-primary)] text-[var(--wraith-text-primary)] border-b-2 border-b-[var(--wraith-accent-blue)]' ? 'bg-[var(--wraith-bg-primary)] text-[var(--wraith-text-primary)] border-b-2 border-b-[var(--wraith-accent-blue)]'
@ -38,7 +39,7 @@
> >
&times; &times;
</span> </span>
</button> </div>
</div> </div>
<!-- New tab button --> <!-- New tab button -->
@ -68,6 +69,7 @@ function onDragStart(index: number, event: DragEvent): void {
draggedIndex.value = index; draggedIndex.value = index;
if (event.dataTransfer) { if (event.dataTransfer) {
event.dataTransfer.effectAllowed = "move"; event.dataTransfer.effectAllowed = "move";
event.dataTransfer.setData("text/plain", String(index));
} }
} }