diff --git a/src/renderer/components/layout/TabBar.tsx b/src/renderer/components/layout/TabBar.tsx
index c1b99164..9e079e03 100644
--- a/src/renderer/components/layout/TabBar.tsx
+++ b/src/renderer/components/layout/TabBar.tsx
@@ -243,42 +243,53 @@ export const TabBar = ({ paneId }: TabBarProps): React.JSX.Element => {
isMacElectron && isLeftmostPane
? 'var(--macos-traffic-light-padding-left, 72px)'
: '8px',
- WebkitAppRegion: 'no-drag',
+ WebkitAppRegion: isMacElectron ? 'drag' : 'no-drag',
opacity: isFocused || paneCount === 1 ? 1 : 0.7,
} as React.CSSProperties
}
>
- {/* Tab list with horizontal scroll, sortable DnD, and droppable area.
- Capped at 75% so the drag spacer always has room to the right. */}
{
- scrollContainerRef.current = el;
- setDroppableRef(el);
- }}
- className="scrollbar-none flex min-w-0 flex-1 items-center gap-1"
- style={{
- outline: isDroppableOver ? '1px dashed var(--color-accent, #6366f1)' : 'none',
- outlineOffset: '-1px',
- overflowX: 'auto',
- overflowY: 'hidden',
- }}
+ className="flex min-w-0 shrink items-center gap-1"
+ style={
+ {
+ WebkitAppRegion: 'no-drag',
+ flex: '0 1 auto',
+ maxWidth: 'calc(100% - 32px)',
+ } as React.CSSProperties
+ }
>
-
- {openTabs.map((tab) => (
-
- ))}
-
+ {/* Keep the sortable list inside a no-drag group so tabs remain clickable,
+ while any leftover space in the pane segment can drag the window. */}
+
{
+ scrollContainerRef.current = el;
+ setDroppableRef(el);
+ }}
+ className="scrollbar-none flex min-w-0 flex-1 items-center gap-1"
+ style={{
+ outline: isDroppableOver ? '1px dashed var(--color-accent, #6366f1)' : 'none',
+ outlineOffset: '-1px',
+ overflowX: 'auto',
+ overflowY: 'hidden',
+ }}
+ >
+
+ {openTabs.map((tab) => (
+
+ ))}
+
+
{/* Refresh button - show only for session tabs */}
{activeTab?.type === 'session' && (
@@ -298,6 +309,9 @@ export const TabBar = ({ paneId }: TabBarProps): React.JSX.Element => {
)}
+ {/* Guaranteed drag target, even when the tab list is dense. */}
+