Add right sidebar titlebar toggle

Sources/ContentView.swift

@@ -2050,23 +2050,9 @@ struct ContentView: View {
             .frame(maxWidth: .infinity)
             .overlay(alignment: .topLeading) {
                 customTitlebar(appearance: appearance)
-                    // The workspace titlebar band spans the full window width and sits at
-                    // zIndex(100) over the content/sidebar layout. Its drag/double-click
-                    // surface (`WindowDragHandleView` + `.contentShape(Rectangle())`) must
-                    // not cover the right sidebar, whose mode bar (Files/Search/Feed/Vault)
-                    // lives inside the titlebar-height strip — otherwise the band wins the
-                    // hit-test and swallows every click/hover on those buttons (#5099).
-                    // Confine the interactive titlebar surface to the area left of the
-                    // right sidebar, matching the pre-#5017 "only over terminal content,
-                    // not the sidebar" intent. The left sidebar's titlebar controls live in
-                    // the AppKit titlebar accessory (above this band), so only the trailing
-                    // (right-sidebar) edge needs to be ceded here.
-                    //
-                    // `rightSidebarWidth` is already `rightSidebarVisible ? fileExplorerWidth : 0`,
-                    // so it collapses to 0 when the sidebar is hidden. The sidebar panel itself
-                    // snaps without animation (`.transaction { $0.animation = nil }`), so we match
-                    // that here — otherwise this inset could animate out of step with the panel on
-                    // toggle and momentarily expose (or re-cover) the mode bar mid-transition.
+                    // Keep the drag surface off the right-sidebar mode bar (#5099).
+                    // The width collapses when hidden, and the sidebar itself snaps,
+                    // so disable animation here to keep both hit regions in lockstep.
                     .padding(.trailing, rightSidebarWidth)
                     .animation(nil, value: rightSidebarWidth)
             }
@@ -2424,6 +2410,17 @@ struct ContentView: View {
                     workspaceTitlebarBand(appearance: appearance)
                         .zIndex(100)
                 }
+
+                if !rightSidebarVisible {
+                    RightSidebarTitlebarToggleButton(
+                        foregroundColor: Color(nsColor: titlebarControlForegroundNSColor(opacity: 1))
+                    ) {
+                        _ = AppDelegate.shared?.toggleRightSidebarInActiveMainWindow(preferredWindow: observedWindow)
+                    }
+                    .environment(\.colorScheme, appearance.chromeColorScheme)
+                    .frame(maxWidth: .infinity, alignment: .trailing)
+                    .zIndex(101)
+                }
             }
                 .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .topLeading)
                 .frame(minWidth: CGFloat(SessionPersistencePolicy.minimumWindowWidth), minHeight: CGFloat(SessionPersistencePolicy.minimumWindowHeight))

Sources/MobileConnectTitlebarAccessory.swift

@@ -31,7 +31,9 @@ private struct TitlebarTrailingControls: View {
             ProBadgeView()
             MobileConnectTitlebarButton()
         }
-        .padding(.trailing, 8)
+        // The full-size content view owns the right-sidebar glyph / X lane.
+        // Keep the native controls left of that lane in standard mode.
+        .padding(.trailing, RightSidebarChromeMetrics.headerControlSize + 12)
     }
 }
 

Sources/RightSidebarHeaderCloseButton.swift

@@ -0,0 +1,105 @@
+import CmuxFoundation
+import CmuxSettings
+import CmuxSettingsUI
+import SwiftUI
+
+/// Closes the right sidebar from its header while presenting the configured shortcut hint.
+struct RightSidebarHeaderCloseButton: View {
+    let action: () -> Void
+
+    @ObservedObject private var keyboardShortcutSettingsObserver = KeyboardShortcutSettingsObserver.shared
+    @State private var shortcutHintMonitor = WindowScopedShortcutHintModifierMonitor(activation: .commandOnly)
+    @LiveSetting(\.shortcuts.showModifierHoldHints) private var showModifierHoldHints
+    private let alwaysShowShortcutHints = ShortcutHintDebugSettings().alwaysShowHints
+    private let shortcutHintXOffset = ShortcutHintDebugSettings.defaultRightSidebarCloseHintX
+    private let shortcutHintYOffset = ShortcutHintDebugSettings.defaultRightSidebarCloseHintY
+
+    private func startShortcutHintMonitorIfNeeded() {
+        if showModifierHoldHints {
+            shortcutHintMonitor.start()
+        } else {
+            shortcutHintMonitor.stop()
+        }
+    }
+
+    var body: some View {
+        let _ = keyboardShortcutSettingsObserver.revision
+        let shortcut = KeyboardShortcutSettings.shortcut(for: .toggleRightSidebar)
+        let showsShortcutHint = ShortcutHintTitlebarPolicy.shouldShow(
+            shortcut: shortcut,
+            alwaysShowShortcutHints: alwaysShowShortcutHints,
+            modifierPressed: shortcutHintMonitor.isModifierPressed,
+            modifierHoldHintsEnabled: showModifierHoldHints
+        )
+
+        ZStack {
+            Button(action: action) {
+                HeaderChromeIconStyle.symbol("xmark")
+            }
+            .buttonStyle(
+                RightSidebarHeaderIconButtonStyle(
+                    iconGeometryKeyPrefix: "rightSidebarHeaderCloseIcon"
+                )
+            )
+            .frame(
+                width: RightSidebarChromeMetrics.headerControlSize,
+                height: RightSidebarChromeMetrics.headerControlSize
+            )
+            .reportRightSidebarChromeNamedGeometryForBonsplitUITest(
+                keyPrefix: "rightSidebarHeaderClose",
+                isVisible: true
+            )
+            .safeHelp(
+                KeyboardShortcutSettings.Action.toggleRightSidebar.tooltip(
+                    String(
+                        localized: "rightSidebar.toggle.tooltip",
+                        defaultValue: "Toggle right sidebar"
+                    )
+                )
+            )
+            .accessibilityLabel(
+                String(
+                    localized: "rightSidebar.close.accessibilityLabel",
+                    defaultValue: "Close Right Sidebar"
+                )
+            )
+            .accessibilityIdentifier("RightSidebar.closeButton")
+        }
+        .frame(
+            width: RightSidebarChromeMetrics.headerControlSize,
+            height: RightSidebarChromeMetrics.headerControlSize
+        )
+        .background(
+            WindowAccessor(refreshID: showModifierHoldHints) { window in
+                shortcutHintMonitor.setHostWindow(showModifierHoldHints ? window : nil)
+            }
+            .frame(width: 0, height: 0)
+        )
+        .overlay(alignment: .top) {
+            if showsShortcutHint {
+                ShortcutHintPill(shortcut: shortcut, fontSize: 9, emphasis: 1.05)
+                    .fixedSize(horizontal: true, vertical: false)
+                    .offset(
+                        x: CGFloat(ShortcutHintDebugSettings.clamped(shortcutHintXOffset)),
+                        y: CGFloat(ShortcutHintDebugSettings.clamped(shortcutHintYOffset))
+                    )
+                    .shortcutHintTransition()
+                    .accessibilityIdentifier("rightSidebarCloseShortcutHint")
+                    .allowsHitTesting(false)
+                    .zIndex(10)
+            }
+        }
+        .rightSidebarHeaderControlAlignment()
+        .shortcutHintVisibilityAnimation(value: showsShortcutHint)
+        .titlebarInteractiveControl()
+        .onAppear {
+            startShortcutHintMonitorIfNeeded()
+        }
+        .onDisappear {
+            shortcutHintMonitor.stop()
+        }
+        .onChange(of: showModifierHoldHints) { _, _ in
+            startShortcutHintMonitorIfNeeded()
+        }
+    }
+}

Sources/RightSidebarPanelView.swift

@@ -123,12 +123,9 @@ struct RightSidebarPanelView: View {
         return AppDelegate.shared?.isRightSidebarFocusResponder(responder, in: window) == true
     }
     @State private var focusShortcutHintMonitor = WindowScopedShortcutHintModifierMonitor(activation: .commandOnly)
-    @State private var closeShortcutHintMonitor = WindowScopedShortcutHintModifierMonitor(activation: .commandOnly)
     @State private var hasMountedRightSidebarContent = false
     @ObservedObject private var keyboardShortcutSettingsObserver = KeyboardShortcutSettingsObserver.shared
     private let alwaysShowShortcutHints = ShortcutHintDebugSettings().alwaysShowHints
-    private let closeShortcutHintXOffset = ShortcutHintDebugSettings.defaultRightSidebarCloseHintX
-    private let closeShortcutHintYOffset = ShortcutHintDebugSettings.defaultRightSidebarCloseHintY
     private let focusShortcutHintXOffset = ShortcutHintDebugSettings.defaultRightSidebarFocusHintX
     private let focusShortcutHintYOffset = ShortcutHintDebugSettings.defaultRightSidebarFocusHintY
     @LiveSetting(\.shortcuts.showModifierHoldHints) private var showModifierHoldHints
@@ -163,13 +160,11 @@ struct RightSidebarPanelView: View {
         }
         modeShortcutHintMonitor.start()
         focusShortcutHintMonitor.start()
-        closeShortcutHintMonitor.start()
     }
 
     private func stopShortcutHintMonitors() {
         modeShortcutHintMonitor.stop()
         focusShortcutHintMonitor.stop()
-        closeShortcutHintMonitor.stop()
     }
 
     var body: some View {
@@ -190,7 +185,6 @@ struct RightSidebarPanelView: View {
                 let hintWindow = showModifierHoldHints ? window : nil
                 modeShortcutHintMonitor.setHostWindow(hintWindow)
                 focusShortcutHintMonitor.setHostWindow(hintWindow)
-                closeShortcutHintMonitor.setHostWindow(hintWindow)
             }
             .frame(width: 0, height: 0)
         )
@@ -249,7 +243,7 @@ struct RightSidebarPanelView: View {
                 if fileExplorerState.mode.canOpenAsPane {
                     openAsPaneButton(mode: fileExplorerState.mode)
                 }
-                closeButton
+                RightSidebarHeaderCloseButton(action: onClose)
             }
         }
         .rightSidebarChromeBar(leadingPadding: 4, trailingPadding: 6, height: titlebarHeight)
@@ -292,59 +286,6 @@ struct RightSidebarPanelView: View {
         .titlebarInteractiveControl()
     }
 
-    private var closeButton: some View {
-        let _ = keyboardShortcutSettingsObserver.revision
-        let shortcut = KeyboardShortcutSettings.shortcut(for: .toggleRightSidebar)
-        let showsShortcutHint = ShortcutHintTitlebarPolicy.shouldShow(
-            shortcut: shortcut,
-            alwaysShowShortcutHints: alwaysShowShortcutHints,
-            modifierPressed: closeShortcutHintMonitor.isModifierPressed,
-            modifierHoldHintsEnabled: showModifierHoldHints
-        )
-        return ZStack {
-            Button(action: onClose) {
-                HeaderChromeIconStyle.symbol("xmark")
-            }
-            .buttonStyle(RightSidebarHeaderIconButtonStyle(iconGeometryKeyPrefix: "rightSidebarHeaderCloseIcon"))
-            .frame(
-                width: RightSidebarChromeMetrics.headerControlSize,
-                height: RightSidebarChromeMetrics.headerControlSize
-            )
-            .reportRightSidebarChromeNamedGeometryForBonsplitUITest(
-                keyPrefix: "rightSidebarHeaderClose",
-                isVisible: true
-            )
-            .safeHelp(
-                KeyboardShortcutSettings.Action.toggleRightSidebar.tooltip(
-                    String(localized: "rightSidebar.toggle.tooltip", defaultValue: "Toggle right sidebar")
-                )
-            )
-            .accessibilityLabel(String(localized: "rightSidebar.close.accessibilityLabel", defaultValue: "Close Right Sidebar"))
-            .accessibilityIdentifier("RightSidebar.closeButton")
-        }
-        .frame(
-            width: RightSidebarChromeMetrics.headerControlSize,
-            height: RightSidebarChromeMetrics.headerControlSize
-        )
-        .overlay(alignment: .top) {
-            if showsShortcutHint {
-                ShortcutHintPill(shortcut: shortcut, fontSize: 9, emphasis: 1.05)
-                    .fixedSize(horizontal: true, vertical: false)
-                    .offset(
-                        x: CGFloat(ShortcutHintDebugSettings.clamped(closeShortcutHintXOffset)),
-                        y: CGFloat(ShortcutHintDebugSettings.clamped(closeShortcutHintYOffset))
-                    )
-                    .shortcutHintTransition()
-                    .accessibilityIdentifier("rightSidebarCloseShortcutHint")
-                    .allowsHitTesting(false)
-                    .zIndex(10)
-            }
-        }
-        .rightSidebarHeaderControlAlignment()
-        .shortcutHintVisibilityAnimation(value: showsShortcutHint)
-        .titlebarInteractiveControl()
-    }
-
     @ViewBuilder
     private var focusShortcutHintOverlay: some View {
         let _ = keyboardShortcutSettingsObserver.revision

Sources/RightSidebarTitlebarToggleButton.swift

@@ -0,0 +1,60 @@
+import CmuxAppKitSupportUI
+import CmuxFoundation
+import CmuxSettings
+import SwiftUI
+
+/// The built-in title-bar control for showing the hidden right sidebar.
+struct RightSidebarTitlebarToggleButton: View {
+    let foregroundColor: Color
+    let action: () -> Void
+    @AppStorage(TitlebarControlsStyle.storageKey)
+    private var styleRawValue = TitlebarControlsStyle.defaultRawValue
+    @ObservedObject private var keyboardShortcutSettingsObserver = KeyboardShortcutSettingsObserver.shared
+
+    var body: some View {
+        let _ = keyboardShortcutSettingsObserver.revision
+        let config = TitlebarControlsStyle.stored(rawValue: styleRawValue).config
+        TitlebarControlButton(
+            config: config,
+            foregroundColor: foregroundColor,
+            accessibilityIdentifier: "titlebarControl.toggleRightSidebar",
+            accessibilityLabel: String(
+                localized: "shortcut.toggleRightSidebar.label",
+                defaultValue: "Toggle Right Sidebar"
+            ),
+            action: action
+        ) {
+            TitlebarSidebarGlyph(edge: .trailing, iconSize: config.iconSize)
+            .frame(
+                width: HeaderChromeIconStyle.iconFrameSize(forIconSize: config.iconSize),
+                height: HeaderChromeIconStyle.iconFrameSize(forIconSize: config.iconSize)
+            )
+            .background(
+                TitlebarChromeGeometryReporter(
+                    keyPrefix: "titlebarControl_toggleRightSidebarIcon"
+                )
+            )
+        }
+        .safeHelp(
+            KeyboardShortcutSettings.Action.toggleRightSidebar.tooltip(
+                String(
+                    localized: "rightSidebar.toggle.tooltip",
+                    defaultValue: "Toggle right sidebar"
+                )
+            )
+        )
+        .frame(
+            width: RightSidebarChromeMetrics.headerControlSize + 12,
+            height: WindowChromeMetrics.appTitlebarHeight
+        )
+        .overlay(alignment: .leading) {
+            WindowChromeBorder(
+                orientation: .vertical,
+                ignoresSafeArea: false,
+                refreshNotificationName: .ghosttyDefaultBackgroundDidChange,
+                backgroundColorProvider: { GhosttyBackgroundTheme.currentColor() }
+            )
+            .allowsHitTesting(false)
+        }
+    }
+}

Sources/TitlebarSidebarGlyph.swift

@@ -0,0 +1,43 @@
+import SwiftUI
+
+/// Draws the sidebar outline used by the built-in leading and trailing title-bar toggles.
+struct TitlebarSidebarGlyph: View {
+    enum Edge: Equatable {
+        case leading
+        case trailing
+    }
+
+    let edge: Edge
+    let iconSize: CGFloat
+
+    var body: some View {
+        GlyphShape(edge: edge)
+            .stroke(
+                style: StrokeStyle(
+                    lineWidth: HeaderChromeIconStyle.sidebarGlyphStrokeWidth,
+                    lineCap: .round,
+                    lineJoin: .round
+                )
+            )
+            .frame(width: max(13, iconSize + 2), height: max(11, iconSize - 1))
+    }
+
+    private struct GlyphShape: Shape {
+        let edge: Edge
+
+        func path(in rect: CGRect) -> Path {
+            var path = Path()
+            let insetRect = rect.insetBy(dx: 0.5, dy: 0.5)
+            path.addRoundedRect(
+                in: insetRect,
+                cornerSize: CGSize(width: 2, height: 2)
+            )
+
+            let dividerFraction = edge == .leading ? 0.36 : 0.64
+            let dividerX = insetRect.minX + insetRect.width * dividerFraction
+            path.move(to: CGPoint(x: dividerX, y: insetRect.minY + 1.5))
+            path.addLine(to: CGPoint(x: dividerX, y: insetRect.maxY - 1.5))
+            return path
+        }
+    }
+}