@carlesandres/house 0.3.1 → 0.4.0

package/CHANGELOG.md

@@ -12,6 +12,25 @@ file is the curated, narrative version.
 
 ## [Unreleased]
 
+## [0.4.0] — 2026-05-21
+
+### Added
+
+- Command palette v1: `ctrl+p` opens a modal palette with visible browser
+  commands derived from the keymap, including quit, sidebar toggle, help,
+  filter, open-in-browser, and theme controls.
+- Palette search uses a small tiered scorer so empty queries stay in keymap
+  order while typed queries rank stronger title and word-boundary matches.
+
+### Fixed
+
+- Reader scroll focus is suspended while overlays are open, preventing palette
+  arrow navigation from scrolling the markdown pane behind the modal.
+
+### Tests
+
+- Added command-palette interaction coverage plus scroll regression checks.
+
 ## [0.3.1] — 2026-05-17
 
 Beta release gates (DESIGN §10.2) closed.
@@ -204,7 +223,9 @@ auto-detect, single-binary distribution (issue
 [#2](https://github.com/carlesandres/openmdr/issues/2)),
 Homebrew tap. All tracked.
 
-[Unreleased]: https://github.com/carlesandres/house/compare/v0.3.0...HEAD
+[Unreleased]: https://github.com/carlesandres/house/compare/v0.4.0...HEAD
+[0.4.0]: https://github.com/carlesandres/house/compare/v0.3.1...v0.4.0
+[0.3.1]: https://github.com/carlesandres/house/compare/v0.3.0...v0.3.1
 [0.3.0]: https://github.com/carlesandres/house/compare/v0.2.1...v0.3.0
 [0.2.1]: https://github.com/carlesandres/house/compare/v0.2.0...v0.2.1
 [0.2.0]: https://github.com/carlesandres/house/compare/v0.1.0...v0.2.0

package/README.md

@@ -37,6 +37,34 @@ house [options] <path>
 |------|---------|-------------|
 | `--theme <name>` | `opencode` | Starting theme (see list below) |
 | `--tone dark\|light` | `dark` | Starting tone |
+| `--config-path` | — | Print the resolved config-file path and exit |
+
+## Configuration
+
+house reads optional defaults from a TOML file:
+
+```
+$XDG_CONFIG_HOME/house/config.toml   (defaults to ~/.config/house/config.toml)
+```
+
+Run `house --config-path` to print the exact location.
+
+```toml
+# ~/.config/house/config.toml
+theme = "tokyonight"
+tone  = "dark"
+```
+
+Precedence, highest to lowest:
+
+1. CLI flags (`--theme`, `--tone`)
+2. Env vars (`HOUSE_THEME`, `HOUSE_TONE`)
+3. Config file
+4. Built-in defaults (`opencode` / `dark`)
+
+The file is optional — a missing file is fine. Invalid keys, unknown themes,
+or malformed TOML fail loudly with a one-line error. Per-project config
+(`.house/config.toml`) and additional keys are deferred.
 
 ## Keys
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@carlesandres/house",
-	"version": "0.3.1",
+	"version": "0.4.0",
 	"description": "TUI-first markdown reader on opentui",
 	"type": "module",
 	"license": "MIT",
@@ -45,7 +45,8 @@
 		"format:check": "oxfmt --check src/",
 		"test": "bun test",
 		"build:themes": "bun run dev/build-themes.ts",
-		"repro:pty-codeblocks": "bun run dev/repro-pty-codeblocks.ts"
+		"repro:pty-codeblocks": "bun run dev/repro-pty-codeblocks.ts",
+		"prepare": "git config core.hooksPath .githooks 2>/dev/null || true"
 	},
 	"dependencies": {
 		"@effect/atom-react": "4.0.0-beta.59",

package/src/Browser.tsx

@@ -15,6 +15,9 @@ import { useKeyboard, useRenderer, useTerminalDimensions } from "@opentui/react"
 import { useAtomValue, useAtomSet } from "@effect/atom-react"
 import { Effect } from "effect"
 import { useCallback, useEffect, useMemo, useRef, useState } from "react"
+import { buildCommands } from "./commands/buildCommands.ts"
+import { clampSelectedIndex, filterCommands } from "./commands/score.ts"
+import { CommandPalette } from "./CommandPalette.tsx"
 import { filterFiles } from "./discovery/filter.ts"
 import { type FileEntry } from "./discovery/walk.ts"
 import { Footer, FOOTER_HEIGHT } from "./Footer.tsx"
@@ -22,18 +25,32 @@ import { HelpOverlay } from "./HelpOverlay.tsx"
 import { readFileText } from "./io/readFile.ts"
 import { browserBindings, type BrowserCtx } from "./keymap/browser.ts"
 import { dispatch } from "./keymap/keymap.ts"
+import {
+	canFitInline,
+	defaultPreferredWidth,
+	initialShownForAuto,
+	resolveSidebarWidth,
+} from "./layout/resolve.ts"
 import { openInBrowser } from "./serve/openBrowser.ts"
 import { startServer, type ServerHandle } from "./serve/server.ts"
 import { colors, setActiveTheme } from "./theme/colors.ts"
 import { themeAtom } from "./theme/atom.ts"
 import { themeDefinitions, getThemeDefinition } from "./theme/registry.ts"
 
+export type SidebarMode = "auto" | "on" | "off"
+
 export interface BrowserProps {
 	readonly files: readonly FileEntry[]
 	readonly title?: string
 	readonly initialIndex?: number
 	/** Cap the rendered markdown's width at N columns. Null = fill the pane. */
 	readonly maxWidth?: number | null
+	/** Persistent footer indicator (e.g. "indexing… 42"). Pass null/undefined
+	 *  when discovery has finished; the indicator clears. */
+	readonly discoveryStatus?: string | null
+	/** Initial sidebar visibility (`--sidebar` flag). `auto` consults the
+	 *  launch viewport bucket once; subsequent visibility goes through `s`. */
+	readonly sidebarMode?: SidebarMode
 	readonly onQuit?: () => void
 	/** Test seam: replaces the file reader. */
 	readonly readFile?: (path: string) => Promise<string>
@@ -44,12 +61,15 @@ const defaultReadFile = (path: string): Promise<string> => Effect.runPromise(rea
 const clamp = (n: number, min: number, max: number) => Math.max(min, Math.min(max, n))
 
 /** Bindings the help overlay lets through. Single source of truth for both
- *  the keyboard early-return and the footer hint filter. */
+ *  the keyboard early-return and the footer hint filter. `palette.open`
+ *  passes through so users can jump from help into the palette in one
+ *  keystroke — `openPalette` closes help on its way in. */
 const HELP_ALLOWED_IDS: ReadonlySet<string> = new Set([
 	"help.toggle",
 	"theme.next",
 	"theme.prev",
 	"theme.toneToggle",
+	"palette.open",
 ])
 
 export const Browser = ({
@@ -57,6 +77,8 @@ export const Browser = ({
 	title = "house",
 	initialIndex = 0,
 	maxWidth = null,
+	discoveryStatus = null,
+	sidebarMode = "auto",
 	onQuit,
 	readFile = defaultReadFile,
 }: BrowserProps) => {
@@ -71,18 +93,47 @@ export const Browser = ({
 	)
 	const [loaded, setLoaded] = useState<{ path: string; content: string } | null>(null)
 	const [error, setError] = useState<string | null>(null)
-	const [focus, setFocus] = useState<"sidebar" | "reader">("sidebar")
-	const [sidebarVisible, setSidebarVisible] = useState<boolean>(true)
+	// `shown` is the user's sticky preference. Visibility is derived:
+	// `visible = shown || focus === "sidebar"`. See DESIGN.md §7.1.
+	//
+	// Launch consults the viewport bucket once for `--sidebar=auto`. The
+	// useState initializer pins this to the first render — buckets are
+	// launch-only by design, so resize must NOT re-evaluate.
+	const [shown, setShown] = useState<boolean>(() => {
+		switch (sidebarMode) {
+			case "on":
+				return true
+			case "off":
+				return false
+			case "auto":
+				return initialShownForAuto(width)
+		}
+	})
+	const [focus, setFocus] = useState<"sidebar" | "reader">(() => (shown ? "sidebar" : "reader"))
 	const [sidebarScroll, setSidebarScroll] = useState<number>(0)
 	const [helpVisible, setHelpVisible] = useState<boolean>(false)
 	const [filterOpen, setFilterOpen] = useState<boolean>(false)
 	const [filterQuery, setFilterQuery] = useState<string>("")
+	const [paletteOpen, setPaletteOpen] = useState<boolean>(false)
+	const [paletteQuery, setPaletteQuery] = useState<string>("")
+	const [paletteIndex, setPaletteIndex] = useState<number>(0)
+	// Synchronous mirrors for the keyboard handler — same reason filterOpenRef
+	// exists. Modal input can arrive in one React batch (e.g. ctrl+p, Down,
+	// Return), so every palette field read by later keys must update its ref
+	// before React state commits.
+	const paletteOpenRef = useRef(false)
+	const paletteQueryRef = useRef("")
+	const paletteIndexRef = useRef(0)
 	// Mirror filter state into refs so the keyboard handler sees synchronous
 	// updates even when multiple keys arrive in a single React batch (the
 	// first key opens the filter; subsequent keys in the same tick would
 	// otherwise still observe filterOpen=false through closure).
 	const filterOpenRef = useRef(false)
 	const filterQueryRef = useRef("")
+	// Snapshot the query at filter-open so Esc reverts edits but commit (Return)
+	// keeps them. Layout snapshots are no longer needed — focus drives drawer
+	// dismissal under the §7.1 visibility rule.
+	const priorFilterQueryRef = useRef("")
 	const [footerNotice, setFooterNotice] = useState<string | null>(null)
 	const serverRef = useRef<ServerHandle | null>(null)
 
@@ -181,17 +232,51 @@ export const Browser = ({
 	const ctx: BrowserCtx = {
 		files: displayedFiles,
 		focus,
-		sidebarVisible,
+		sidebarShown: shown,
 		helpVisible,
 		filterOpen,
+		paletteOpen,
 		setFocus,
 		setSelectedIndex,
-		setSidebarVisible,
+		toggleShown: () => {
+			// Per DESIGN.md §7.1 s-behavior table:
+			//   shown=true,  focus=sidebar → shown=false, focus=reader
+			//                                (otherwise the drawer would
+			//                                 immediately re-appear)
+			//   shown=true,  focus=reader  → shown=false, focus=reader
+			//   shown=false, focus=reader  → shown=true,  focus=sidebar
+			//   shown=false, focus=sidebar → shown=true,  focus=sidebar
+			if (shown) {
+				setShown(false)
+				if (focus === "sidebar") setFocus("reader")
+			} else {
+				setShown(true)
+				if (focus === "reader") setFocus("sidebar")
+			}
+		},
 		setHelpVisible,
 		openFilter: () => {
+			// Focus the sidebar so the filter input has a home. Under §7.1's
+			// `visible = shown || focus==="sidebar"` rule, focus alone makes
+			// the sidebar visible (as a drawer when `shown=false`), so we no
+			// longer need to mutate `shown` here.
+			priorFilterQueryRef.current = filterQueryRef.current
+			if (focus !== "sidebar") setFocus("sidebar")
 			filterOpenRef.current = true
 			setFilterOpen(true)
 		},
+		openPalette: () => {
+			// Close help if it was open — palette is the active modal now.
+			// Reset query/index so each open starts fresh (no stale state from
+			// the previous session).
+			if (helpVisible) setHelpVisible(() => false)
+			paletteQueryRef.current = ""
+			setPaletteQuery("")
+			paletteIndexRef.current = 0
+			setPaletteIndex(0)
+			paletteOpenRef.current = true
+			setPaletteOpen(true)
+		},
 		cycleTheme,
 		toggleTone,
 		serveCurrent: () => {
@@ -249,17 +334,46 @@ export const Browser = ({
 			//
 			// Centralized so the dual filterOpenRef / filterOpen invariant
 			// only has to be maintained in one place (plus `openFilter`).
-			const closeFilter = (focusReader: boolean) => {
+			const closeFilter = (commit: boolean) => {
 				const picked = displayedFiles[selectedIndex] ?? null
+				// Return on a zero-match list has nothing to commit. Treat it
+				// as Esc so the user isn't stranded in an "applied filter with
+				// no visible files" state they'd have to back out of manually.
+				const effectiveCommit = commit && picked !== null
 				filterOpenRef.current = false
-				filterQueryRef.current = ""
 				setFilterOpen(false)
-				setFilterQuery("")
-				if (picked) {
-					const fullIdx = files.findIndex((f) => f.path === picked.path)
-					if (fullIdx >= 0) setSelectedIndex(() => fullIdx)
+				if (effectiveCommit) {
+					// Return keeps the query. selectedIndex is already a valid
+					// position in the (still-filtered) displayedFiles list, so
+					// no translation is needed.
+				} else {
+					// Esc reverts the query to its pre-session value. After the
+					// revert, displayedFiles may change shape — translate the
+					// cursor by path so it stays on whatever the user was
+					// looking at, instead of snapping to a numerically-equivalent
+					// row in the restored list.
+					const before = priorFilterQueryRef.current
+					filterQueryRef.current = before
+					setFilterQuery(before)
+					if (picked) {
+						const restored = before === "" ? files : filterFiles(files, before)
+						const idx = restored.findIndex((f) => f.path === picked.path)
+						if (idx >= 0) setSelectedIndex(() => idx)
+					}
+				}
+				// Where focus lands depends on layout intent (DESIGN.md §7.1):
+				//   commit (Return on a real pick) → reader, always. The user
+				//     asked to open the match; show them what they picked.
+				//   cancel (Esc, or Return with no pick) → if the sidebar is
+				//     inline (shown && fits), keep focus there so j/k keeps
+				//     walking the list; if the sidebar was only up as a drawer
+				//     (shown=false), dismiss focus to the reader so the drawer
+				//     disappears under the §7.1 visibility rule.
+				if (effectiveCommit) {
+					setFocus("reader")
+				} else {
+					setFocus(shown && canFitInline(width) ? "sidebar" : "reader")
 				}
-				if (focusReader && picked) setFocus("reader")
 			}
 			if (key.name === "escape") {
 				closeFilter(false)
@@ -269,7 +383,15 @@ export const Browser = ({
 				closeFilter(true)
 				return
 			}
-			if (key.name === "backspace") {
+			if (key.name === "backspace" || key.name === "delete") {
+				// Pressing backspace/delete with no query left removes the
+				// leading `/` — i.e. closes the modal. Equivalent to Esc:
+				// reverts to the pre-session query (so an applied filter
+				// survives a "I changed my mind" tap).
+				if (filterQueryRef.current.length === 0) {
+					closeFilter(false)
+					return
+				}
 				filterQueryRef.current = filterQueryRef.current.slice(0, -1)
 				setFilterQuery(filterQueryRef.current)
 				setSelectedIndex(() => 0)
@@ -296,6 +418,74 @@ export const Browser = ({
 			}
 			return
 		}
+		// Command palette modal: capture keystrokes for the query input and
+		// list navigation. Esc closes (single press, regardless of query —
+		// #70 Q7a). Return runs the selected command. Up/Down navigate.
+		// Backspace edits the query and is a no-op on empty (#70 Q7b —
+		// intentionally diverges from the filter modal, which closes on
+		// empty-backspace, because accidental close feels worse in the
+		// palette). Printable characters extend the query and snap selection
+		// to 0 (#70 Q7c). Ctrl/Meta-modified keys are swallowed except
+		// ctrl+p, which toggles the palette closed (matches help-toggle's
+		// re-press-to-close behavior).
+		if (paletteOpenRef.current) {
+			const closePalette = () => {
+				paletteOpenRef.current = false
+				paletteQueryRef.current = ""
+				paletteIndexRef.current = 0
+				setPaletteOpen(false)
+				setPaletteQuery("")
+				setPaletteIndex(0)
+			}
+			const setPaletteIndexSync = (next: number) => {
+				paletteIndexRef.current = next
+				setPaletteIndex(next)
+			}
+			const allCommands = buildCommands(ctx)
+			const filtered = filterCommands(allCommands, paletteQueryRef.current)
+			if (key.name === "escape") {
+				closePalette()
+				return
+			}
+			if (key.name === "return") {
+				const picked = filtered[clampSelectedIndex(paletteIndexRef.current, filtered)]
+				closePalette()
+				picked?.run()
+				return
+			}
+			if (key.name === "up") {
+				setPaletteIndexSync(Math.max(0, paletteIndexRef.current - 1))
+				return
+			}
+			if (key.name === "down") {
+				setPaletteIndexSync(Math.min(Math.max(0, filtered.length - 1), paletteIndexRef.current + 1))
+				return
+			}
+			if (key.name === "backspace" || key.name === "delete") {
+				if (paletteQueryRef.current.length === 0) return
+				paletteQueryRef.current = paletteQueryRef.current.slice(0, -1)
+				setPaletteQuery(paletteQueryRef.current)
+				setPaletteIndexSync(0)
+				return
+			}
+			// ctrl+p again closes — matches help-toggle behavior.
+			if (key.ctrl && !key.meta && key.name === "p") {
+				closePalette()
+				return
+			}
+			if (key.ctrl || key.meta) return
+			let char: string | null = null
+			if (key.name === "space") char = " "
+			else if (typeof key.name === "string" && key.name.length === 1) {
+				char = key.shift ? key.name.toUpperCase() : key.name
+			}
+			if (char !== null) {
+				paletteQueryRef.current = paletteQueryRef.current + char
+				setPaletteQuery(paletteQueryRef.current)
+				setPaletteIndexSync(0)
+			}
+			return
+		}
 		// While help is open, swallow most keys: only ? (toggle), esc
 		// (close), and the theme bindings pass through. Theme keys stay live
 		// so users can preview palette changes against the overlay itself —
@@ -320,12 +510,26 @@ export const Browser = ({
 		dispatch(browserBindings, ctx, key)
 	})
 
-	// Min/max-clamped percentage of viewport: narrow terminals stay readable,
-	// wide terminals get more room without wasting space at extremes.
-	// User-configurable width is deferred — see DESIGN.md §12.
-	const sidebarWidth = Math.max(28, Math.min(60, Math.floor(width * 0.25)))
+	// Sidebar width is a pure function of viewport (DESIGN.md §7.1). Until
+	// persistent config (#13) lands, `preferred` is derived from viewport,
+	// matching the pre-#22 inline math.
+	const sidebarWidth = resolveSidebarWidth(width, defaultPreferredWidth(width))
 	const sidebarActive = focus === "sidebar"
 	const readerActive = focus === "reader"
+	// Visibility = shown OR sidebar-focused. When visible-because-focused
+	// only, render as a drawer (absolute) on top of the reader. We also
+	// fall back to drawer rendering when the viewport is too narrow for
+	// the inline two-pane layout even with `shown=true` (Q2 in DESIGN.md
+	// §7.1) — preserves the user's preference without squeezing the reader
+	// below READER_MIN_WIDTH.
+	const sidebarVisible = shown || sidebarActive
+	const sidebarAsDrawer = sidebarVisible && (!shown || !canFitInline(width))
+	const sidebarInline = sidebarVisible && !sidebarAsDrawer
+	// Drawer is offset 1 row from the top so the reader's title stays visible.
+	// That row comes off the drawer's own height, so the body has one fewer
+	// usable row than the inline sidebar. Tracked here so the virtualization
+	// slice matches the wrapper that actually paints it.
+	const drawerTopOffset = 1
 	const sidebarTitle = sidebarActive ? " ▸ files " : "   files "
 	const readerLabel = selected?.relativePath ?? title
 	const readerTitle = readerActive ? ` ▸ ${readerLabel} ` : `   ${readerLabel} `
@@ -335,8 +539,20 @@ export const Browser = ({
 	// every keystroke re-renders all N file rows even though only the bg of
 	// two of them changed (old + new selected). On a 195-file vault that
 	// dominates the per-keystroke cost.
-	// Sidebar box adds top/bottom borders (2); footer eats FOOTER_HEIGHT.
-	const sidebarBodyHeight = Math.max(1, height - 2 - FOOTER_HEIGHT)
+	// Sidebar box adds top/bottom borders (2); footer eats FOOTER_HEIGHT;
+	// the filter row eats one more cell when files are present *or* while
+	// discovery is in flight (allocates the row up front so it doesn't pop
+	// in when the first file arrives).
+	const discoveryActive = discoveryStatus !== null && discoveryStatus.length > 0
+	const filterRowVisible = files.length > 0 || discoveryActive
+	const sidebarBodyHeight = Math.max(
+		1,
+		height -
+			2 -
+			FOOTER_HEIGHT -
+			(filterRowVisible ? 1 : 0) -
+			(sidebarAsDrawer ? drawerTopOffset : 0),
+	)
 	const maxScroll = Math.max(0, displayedFiles.length - sidebarBodyHeight)
 	const desiredScroll = (() => {
 		let s = sidebarScroll
@@ -358,6 +574,30 @@ export const Browser = ({
 		[sidebarTextWidth],
 	)
 
+	// Filter row content + color. Three reachable states:
+	//   editing  — filterOpen=true              → /<query>▏  in textStrong
+	//   applied  — !filterOpen && query !== ""  → /<query>   in text
+	//   idle     — !filterOpen && query === ""  → "/ filter…" in textMuted
+	const filterRowFg = filterOpen
+		? colors.textStrong
+		: filterQuery.length > 0
+			? colors.text
+			: colors.textMuted
+	const filterRowRaw = filterOpen
+		? `/${filterQuery}▏`
+		: filterQuery.length > 0
+			? `/${filterQuery}`
+			: "/ filter…"
+	// Editing keeps the cursor visible — anchor the right edge with a leading
+	// ellipsis when the query overflows. Applied/idle anchor the left edge
+	// (lose the tail) so the leading `/` always reads as a filter marker.
+	const filterRowContent =
+		filterRowRaw.length <= sidebarTextWidth
+			? filterRowRaw
+			: filterOpen
+				? "…" + filterRowRaw.slice(filterRowRaw.length - sidebarTextWidth + 1)
+				: filterRowRaw.slice(0, sidebarTextWidth - 1) + "…"
+
 	// While help is open, the `?` key closes the overlay — relabel its hint
 	// so the footer accurately describes what pressing the key will do.
 	// Memoized: `helpVisible` changes rarely; `browserBindings` and
@@ -372,6 +612,49 @@ export const Browser = ({
 		[helpVisible],
 	)
 
+	// One sidebar element is reused for inline and drawer rendering; only
+	// the wrapper differs (flex sibling vs absolute-positioned). The body is
+	// identical so file rows / filter row don't drift between modes.
+	const sidebarBody = (
+		<>
+			{filterRowVisible && (
+				<text content={filterRowContent} wrapMode="none" style={{ fg: filterRowFg }} />
+			)}
+			{displayedFiles.length === 0 ? (
+				<text
+					content={
+						files.length === 0
+							? discoveryActive
+								? "(scanning…)"
+								: "(no markdown files)"
+							: "(no matches)"
+					}
+					style={{ fg: colors.textMuted }}
+				/>
+			) : (
+				visibleFiles.map((file, idx) => {
+					const realIdx = desiredScroll + idx
+					const isSelected = realIdx === selectedIndex
+					const display = truncatePath(file.relativePath)
+					if (!isSelected) {
+						return (
+							<text key={file.path} content={display} wrapMode="none" style={{ fg: colors.text }} />
+						)
+					}
+					const bg = sidebarActive ? colors.selectedBg : colors.selectedBgInactive
+					return (
+						<text
+							key={file.path}
+							content={display}
+							wrapMode="none"
+							style={{ fg: colors.textStrong, bg }}
+						/>
+					)
+				})
+			)}
+		</>
+	)
+
 	return (
 		<box style={{ width, height, flexDirection: "column", backgroundColor: colors.background }}>
 			<box
@@ -382,7 +665,7 @@ export const Browser = ({
 					backgroundColor: colors.background,
 				}}
 			>
-				{sidebarVisible && (
+				{sidebarInline && (
 					<box
 						title={sidebarTitle}
 						titleAlignment="left"
@@ -395,37 +678,7 @@ export const Browser = ({
 							backgroundColor: colors.surface,
 						}}
 					>
-						{displayedFiles.length === 0 ? (
-							<text
-								content={files.length === 0 ? "(no markdown files)" : "(no matches)"}
-								style={{ fg: colors.textMuted }}
-							/>
-						) : (
-							visibleFiles.map((file, idx) => {
-								const realIdx = desiredScroll + idx
-								const isSelected = realIdx === selectedIndex
-								const display = truncatePath(file.relativePath)
-								if (!isSelected) {
-									return (
-										<text
-											key={file.path}
-											content={display}
-											wrapMode="none"
-											style={{ fg: colors.text }}
-										/>
-									)
-								}
-								const bg = sidebarActive ? colors.selectedBg : colors.selectedBgInactive
-								return (
-									<text
-										key={file.path}
-										content={display}
-										wrapMode="none"
-										style={{ fg: colors.textStrong, bg }}
-									/>
-								)
-							})
-						)}
+						{sidebarBody}
 					</box>
 				)}
 				<box
@@ -451,7 +704,15 @@ export const Browser = ({
 								flexShrink: 1,
 								backgroundColor: colors.background,
 							}}
-							focused={readerActive}
+							// opentui's scrollbox consumes arrow keys at the focused-element
+							// level *before* useKeyboard fires, so a modal that handles
+							// arrow keys itself (palette nav, help dismissal) would still
+							// see the reader scroll alongside its own action. Unfocus the
+							// scrollbox while any blocking modal is up — useKeyboard's
+							// modal branches own the keys in that state. Filter is not
+							// listed because it force-focuses the sidebar (readerActive
+							// is already false).
+							focused={readerActive && !paletteOpen && !helpVisible}
 						>
 							<markdown
 								key={renderedPath ?? "empty"}
@@ -466,16 +727,50 @@ export const Browser = ({
 					)}
 				</box>
 			</box>
+			{sidebarAsDrawer && (
+				// Offset by 1 row so the reader pane's top border (which carries
+				// the current file name) stays visible above the drawer. Without
+				// this, the user loses the only on-screen indicator of which
+				// file they're reading whenever the drawer is up.
+				<box
+					position="absolute"
+					left={0}
+					top={drawerTopOffset}
+					width={sidebarWidth}
+					height={Math.max(1, height - FOOTER_HEIGHT - drawerTopOffset)}
+					zIndex={5}
+					title={sidebarTitle}
+					titleAlignment="left"
+					style={{
+						border: true,
+						borderColor: sidebarActive ? colors.borderActive : colors.border,
+						flexDirection: "column",
+						backgroundColor: colors.surface,
+					}}
+				>
+					{sidebarBody}
+				</box>
+			)}
 			<Footer
 				bindings={footerBindings}
 				ctx={ctx}
 				width={width}
 				notice={footerNotice}
-				filter={filterOpen ? { query: filterQuery } : null}
+				discoveryStatus={discoveryStatus}
+				filterQuery={!filterOpen && filterQuery.length > 0 ? filterQuery : null}
 			/>
 			{helpVisible && (
 				<HelpOverlay bindings={browserBindings} viewportWidth={width} viewportHeight={height} />
 			)}
+			{paletteOpen && (
+				<CommandPalette
+					commands={filterCommands(buildCommands(ctx), paletteQuery)}
+					query={paletteQuery}
+					selectedIndex={paletteIndex}
+					viewportWidth={width}
+					viewportHeight={height}
+				/>
+			)}
 		</box>
 	)
 }