CyberCoveLLC/Triple-C
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 35 Wiki Activity

Stop the drag from selecting the tab's text
Build App (Preview) / compute-version (pull_request) Successful in 4s
Details
Build App (Preview) / create-release (pull_request) Successful in 1s
Details
Build App (Preview) / build-macos (pull_request) Successful in 2m39s
Details
Build App (Preview) / build-windows (pull_request) Successful in 5m39s
Details
Build App (Preview) / build-linux (pull_request) Successful in 5m56s
Details

Browse Source 
A pointer-driven drag is still a mouse drag as far as the browser is
concerned, so moving a tab highlighted its label blue — something the OS
drag image never did, and the last visible difference between this and
a real drag.

`select-none` on the tab. The rename field gets `select-text` back:
`user-select` inherits, and selecting text is exactly what that field is
for.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
This commit is contained in:
shadow-test
2026-08-11 11:00:06 -07:00
co-authored by Claude Opus 5
parent 5bd80a05bc
commit 85ea3956e8
2 changed files with 16 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/src/components/layout/MainTabs.tsx
+3 -3
View File
@@ -178,7 +178,7 @@ export default function MainTabs() {
};
const tabClass = (active: boolean, dragging: boolean) =>
`flex items-center gap-1.5 pl-3 pr-1.5 h-full text-xs cursor-pointer border-r border-[var(--border-color)] transition-colors ${
`flex items-center gap-1.5 pl-3 pr-1.5 h-full text-xs cursor-pointer select-none border-r border-[var(--border-color)] transition-colors ${
active
? "bg-[var(--bg-primary)] text-[var(--text-primary)]"
: "text-[var(--text-secondary)] hover:text-[var(--text-primary)]"
@@ -402,7 +402,7 @@ export default function MainTabs() {
if (e.key === "Enter") (e.target as HTMLInputElement).blur();
if (e.key === "Escape") setRenamingId(null);
}}
className="max-w-[180px] px-1 py-0 bg-[var(--bg-primary)] border border-[var(--accent)] rounded-[var(--radius-control)] text-xs text-[var(--text-primary)]"
className="max-w-[180px] px-1 py-0 select-text bg-[var(--bg-primary)] border border-[var(--accent)] rounded-[var(--radius-control)] text-xs text-[var(--text-primary)]"
/>
) : (
<span className="truncate max-w-[180px]" title={displayLabel}>
@@ -465,7 +465,7 @@ export default function MainTabs() {
<div
aria-hidden="true"
data-testid="tab-drag-ghost"
className="fixed z-50 flex items-center gap-1.5 px-3 h-8 text-xs rounded-[var(--radius-control)] bg-[var(--bg-primary)] text-[var(--text-primary)] border border-[var(--accent)] pointer-events-none"
className="fixed z-50 flex items-center gap-1.5 px-3 h-8 text-xs rounded-[var(--radius-control)] bg-[var(--bg-primary)] text-[var(--text-primary)] border border-[var(--accent)] pointer-events-none select-none"
style={{
left: ghost.x,
top: ghost.y,