From c6eff4fb106d29998e0f752abcc6703b36bd426e Mon Sep 17 00:00:00 2001
From: xarmian <xarmian@gmail.com>
Date: Thu, 23 Jul 2026 03:56:48 +0000
Subject: [PATCH] fix(web): inert the collapsed sidebar so off-screen nav
 leaves the a11y tree (BUG-2282)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The mobile sidebar drawer collapses via translateX + pointer-events:none but
stayed in the accessibility tree and tab order, so a screen-reader virtual
cursor and keyboard Tab still reached its off-screen nav links. Bind `inert` to
the same !sidebarOpen condition that drives the collapse class + the existing
pointer-events:none rule, so a collapsed drawer leaves both the a11y tree and
the focus order — covering the mobile drawer and the latent desktop width:0
collapse. The re-open control lives in TopBar (outside the aside) so nothing is
trapped; swipe-to-open is a window handler, unaffected.

Claude-Session: https://claude.ai/code/session_01EZ6yr6pAUFb1uffan912ra
---
 web/src/lib/components/layout/Sidebar.svelte | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/web/src/lib/components/layout/Sidebar.svelte b/web/src/lib/components/layout/Sidebar.svelte
index 587710a6..c1337840 100644
--- a/web/src/lib/components/layout/Sidebar.svelte
+++ b/web/src/lib/components/layout/Sidebar.svelte
@@ -390,10 +390,20 @@
 	<div class="backdrop" onclick={() => uiStore.closeSidebar()}></div>
 {/if}
 
+<!--
+	BUG-2282: collapsed = off-screen/hidden (mobile drawer slid out via
+	translateX; desktop width:0). `pointer-events:none` (see .sidebar.collapsed)
+	blocks the mouse but leaves the nav in the a11y tree + tab order — an SR
+	virtual cursor / Tab reaches off-screen links. `inert` removes it from both,
+	matching the same collapsed condition. Safe: the re-open control lives in
+	TopBar (outside the aside), so this never traps the user; swipe-to-open is a
+	window handler, not on the aside.
+-->
 <aside
 	class="sidebar"
 	class:collapsed={!uiStore.sidebarOpen}
 	class:mobile={uiStore.isMobile}
+	inert={!uiStore.sidebarOpen}
 	bind:this={sidebarEl}
 	ontouchstart={handleTouchStart}
 	ontouchmove={handleTouchMove}