surshar / claude-code

Claude Code is an agentic coding tool that lives in your terminal, understands your codebase, and helps you code faster by executing routine tasks, explaining complex code, and handling git workflows - all through natural language commands.

Built by Anthropic · github.com/anthropics

diff: the header and list stay pinned while the hunks scroll beneath them three rows a tick (the pane answers ui.scroll itself), the list keys and ctrl+x b press Buttons that declare the built-in's actions, rows rest grey, toasts are held, and without the fullscreen layout /diff opens the built-in dialog's shape inline, focused, at any widthBrowse files

		@@ -1,0 +1,20 @@
	1	+import { countOf } from '../count-of'
	2	+import type { Hunk } from './types'
	3	+
	4	+/**
	5	+ * The hunk less its first so many lines, its starts moved past them so
	6	+ * the numbers of the lines kept stay right; whole at 0.
	7	+ *
	8	+ * @param hunk the hunk, its lines body lines only
	9	+ * @param count how many leading lines to drop
	10	+ * @returns the rest of the hunk
	11	+ */
	12	+export function hunkAfter(hunk: Hunk, count: number): Hunk {
	13	+ const dropped = hunk.lines.slice(0, count)
	14	+
	15	+ return {
	16	+ oldStart: hunk.oldStart + countOf(dropped, line => !line.startsWith('+')),
	17	+ newStart: hunk.newStart + countOf(dropped, line => !line.startsWith('-')),
	18	+ lines: hunk.lines.slice(count),
	19	+ }
	20	+}

		@@ -8,6 +8,7 @@
8	8	export * from './git-backend-of.js'
9	9	export * from './git-base-modes'
10	10	export * from './git-words'
	11	+export * from './hunk-after.js'
11	12	export * from './hunk-of'
12	13	export * from './large-file-hunks'
13	14	export * from './parse'

		@@ -9,7 +9,6 @@
9	9	ProcessRunResult,
10	10	SessionMessage,
11	11	TimerCall,
12		- UiScrollResult,
13	12	} from 'claude-code'
14	13
15	14	/**
		@@ -96,12 +95,6 @@
96	95	closePane: (pane: PaneCloseArgs) => Promise<void>
97	96
98	97	/**
99		- * `$.ui.scroll` to one of the pane's own keyed elements, its top at the
100		- * window's top.
101		- */
102		- scrollTo: (key: string) => Promise<UiScrollResult>
103		-
104		- /**
105	98	* `$.command.register`; rejects while another `/diff` is listed.
106	99	*/
107	100	registerCommand: (spec: CommandSpec) => Promise<unknown>

		@@ -4,6 +4,7 @@
4	4	export * from './max-lines-per-file.js'
5	5	export * from './max-listed-directories.js'
6	6	export * from './max-untracked-probes.js'
	7	+export * from './max-visible-files.js'
7	8	export * from './pane'
8	9	export * from './prompt-context-max-chars.js'
9	10

		@@ -1,0 +1,5 @@
	1	+/**
	2	+ * The file rows the dialog lists at once (DiffFileList's MAX_VISIBLE_FILES);
	3	+ * past them its window moves, `more files` rows counting the rest.
	4	+ */
	5	+export const MAX_VISIBLE_FILES = 5

		@@ -1,0 +1,5 @@
	1	+/**
	2	+ * The cells a diff gutter takes besides its digits: the marker and the
	3	+ * spaces round the number.
	4	+ */
	5	+export const GUTTER_CHROME = 3

		@@ -1,7 +1,9 @@
1	1	export * from './body-fetch-concurrency.js'
2		-export * from './max-dialog-rows.js'
	2	+export * from './gutter-chrome.js'
3	3	export * from './max-summary-rows.js'
4	4	export * from './pane-top-pad-rows.js'
5	5	export * from './pre-session-body-cap.js'
	6	+export * from './scroll-margin-rows.js'
	7	+export * from './wheel-rows.js'
6	8
7	9	export * as default from '.'

		@@ -1,5 +1,0 @@
1		-/**
2		- * How many file rows the inline pane's list shows at once, around the
3		- * selected one (the built-in dialog's window).
4		- */
5		-export const MAX_DIALOG_ROWS = 5

		@@ -1,0 +1,5 @@
	1	+/**
	2	+ * The rows the docked window draws past its own height, so a line whose
	3	+ * wrap was counted short still leaves it full; the pane clips the rest.
	4	+ */
	5	+export const SCROLL_MARGIN_ROWS = 8

		@@ -1,0 +1,5 @@
	1	+/**
	2	+ * The rows one wheel tick moves the docked body, as the built-in panel's
	3	+ * body moves.
	4	+ */
	5	+export const WHEEL_ROWS = 3

		@@ -1,0 +1,5 @@
	1	+/**
	2	+ * What follows a count on the docked list's lower edge row: the words and
	3	+ * the built-in's advertised list key (its macOS spelling).
	4	+ */
	5	+export const MORE_BELOW_TEXT = 'more below (opt+\u2193 to scroll)'

		@@ -23,4 +23,7 @@
23	23	todos: Object.freeze({ done: 0, total: 0 }),
24	24	armedPath: null,
25	25	placement: 'dock',
	26	+ isFullscreen: null,
	27	+ dialogView: 'list',
	28	+ place: Object.freeze({ top: 0, listStart: 0, columns: 0, rows: 0 }),
26	29	})

		@@ -1,21 +1,0 @@
1		-import type Git from '../git'
2		-import type { Partition } from './partition'
3		-
4		-/**
5		- * The rows a person can pick from right now: the session's shown rows,
6		- * then the pre-session rows while that section is open.
7		- *
8		- * @param partition the fetch's rows, grouped
9		- * @param preSession whether the pre-session section is open
10		- * @returns the pickable rows in drawing order
11		- */
12		-export function listedOf(
13		- partition: Partition,
14		- preSession: 'shown' \| 'hidden',
15		-): readonly Git.FileStat[] {
16		- const isOpen = preSession === 'shown'
17		-
18		- return isOpen
19		- ? [...partition.shown, ...partition.preSession]
20		- : partition.shown
21		-}

		@@ -36,7 +36,7 @@
36	36	return `branch vs ${source.baseBranch}`
37	37	}
38	38
39		- return isSettledBranch ? `vs ${base} (no base branch)` : 'branch'
	39	+ return isSettledBranch ? `vs ${base} (no base branch)` : 'branch diff'
40	40	}
41	41	}
42	42

		@@ -1,5 +1,6 @@
1	1	export * from './builtin-holds-pattern.js'
2	2	export * from './git-unanswered-text.js'
	3	+export * from './more-below-text.js'
3	4	export * from './not-in-repository-text.js'
4	5	export * from './panel-toggle'
5	6	export * from './register-failed-text-of.js'

		@@ -1,0 +1,4 @@
	1	+/**
	2	+ * The transcript line the built-in dialog leaves when the person closes it.
	3	+ */
	4	+export const DIALOG_DISMISSED_TEXT = 'Diff dialog dismissed'

		@@ -1,3 +1,4 @@
	1	+export * from './dialog-dismissed-text.js'
1	2	export * from './panel-hidden-text.js'
2	3	export * from './panel-shown-text.js'
3	4

		@@ -9,14 +9,12 @@
9	9	export * from './header-totals'
10	10	export * from './header-totals-of.js'
11	11	export * from './initial-model'
12		-export * from './listed-of.js'
13	12	export * from './mode-label-of'
14	13	export * from './no-bodies'
15	14	export * from './pane-model'
16	15	export * from './partition'
17	16	export * from './partition-of.js'
18	17	export * from './picked-turn-of'
19		-export * from './selection-of'
20	18	export * from './source'
21	19	export * from './turn-title-of'
22	20	export * from './turn-totals-of'

		@@ -8,9 +8,9 @@
8	8	/**
9	9	* Everything one drawing of the pane reads.
10	10	*
11		- * The last good fetch, what the person picked, the files' bodies read so
12		- * far, the transcript's turns and todos, where the surface seated the pane
13		- * last, and the pinned backend's words and base modes (git's until pinned).
	11	+ * The last good fetch, what the person picked, the bodies read so far, the
	12	+ * turns and todos, how the surface seated it, whether fullscreen (once
	13	+ * `/diff` said), the dialog's view, and the docked scroll in its last box.
14	14	*/
15	15	export type PaneModel = {
16	16	words: Backend.BackendWords
		@@ -29,4 +29,7 @@
29	29	todos: Todos.TodoProgress
30	30	armedPath: string \| null
31	31	placement: 'dock' \| 'inline'
	32	+ isFullscreen: boolean \| null
	33	+ dialogView: 'list' \| 'detail'
	34	+ place: { top: number; listStart: number; columns: number; rows: number }
32	35	}

		@@ -1,3 +1,0 @@
1		-export * from './selection-of.js'
2		-
3		-export * as default from '.'

		@@ -1,16 +1,0 @@
1		-import type Git from '../../git'
2		-
3		-/**
4		- * The file whose body the pane shows: the one the person picked while it is
5		- * still listed, else the first listed one, else none.
6		- *
7		- * @param listed the rows on screen, in order (session rows, then the
8		- * pre-session rows while that section is open)
9		- * @param selectedPath the person's pick, or null
10		- * @returns the selected row, or null for an empty list
11		- */
12		-export const selectionOf = (
13		- listed: readonly Git.FileStat[],
14		- selectedPath: string \| null,
15		-): Git.FileStat \| null =>
16		- listed.find(file => file.path === selectedPath) ?? listed[0] ?? null

		@@ -343,8 +343,22 @@
343	343	engine: Host,
344	344	trigger: (typeof Record.SHOWN_TRIGGERS)[number],
345	345	): Promise<void> {
346		- model = { ...model, selectedPath: null }
347		- await engine.openPane({ id: Names.PANE_ID, title: Names.PANE_TITLE })
	346	+ const isDialog = model.isFullscreen === false
	347	+
	348	+ model = {
	349	+ ...model,
	350	+ selectedPath: null,
	351	+ dialogView: 'list',
	352	+ place: { ...model.place, top: 0, listStart: 0 },
	353	+ }
	354	+
	355	+ await engine.openPane({
	356	+ id: Names.PANE_ID,
	357	+ title: Names.PANE_TITLE,
	358	+ holdToasts: true,
	359	+ ...(isDialog ? ({ focus: true, closeOnEscape: true } as const) : {}),
	360	+ })
	361	+
348	362	isPaneOpen = true
349	363
350	364	const sessionId = await engine.sessionId().catch(() => null)
		@@ -388,6 +402,7 @@
388	402
389	403	const isEligible =
390	404	preference !== false &&
	405	+ model.isFullscreen !== false &&
391	406	columns !== null &&
392	407	columns >= floor &&
393	408	backend !== null
		@@ -408,14 +423,27 @@
408	423
409	424	const actionsOf = (engine: Host): Views.PaneActions => ({
410	425	selectFile: path => {
411		- model = { ...model, selectedPath: path }
	426	+ const isDocked = model.placement === 'dock'
412	427
413		- if (model.placement === 'dock') {
414		- void engine.scrollTo(Views.bodyKeyOf(path)).catch(() => undefined)
	428	+ model = {
	429	+ ...model,
	430	+ selectedPath: path,
	431	+ dialogView: isDocked ? model.dialogView : 'detail',
	432	+ place: isDocked ? Views.placeAtFile(model, path) : model.place,
415	433	}
416	434
417	435	redraw(engine)
418	436	},
	437	+ scrollList: delta => {
	438	+ const place = Views.listScrolledBy(model, delta)
	439	+ const isDocked = model.placement === 'dock'
	440	+
	441	+ model = isDocked
	442	+ ? { ...model, place }
	443	+ : { ...model, place, selectedPath: null }
	444	+
	445	+ redraw(engine)
	446	+ },
419	447	toggleNoise: () => {
420	448	model = { ...model, isNoiseShown: !model.isNoiseShown }
421	449	void loadBodies(engine)
		@@ -426,10 +454,14 @@
426	454	void loadBodies(engine)
427	455	redraw(engine)
428	456	},
429		- chooseBase: value => {
430		- const mode = PaneState.baseModeOf(value)
	457	+ cycleBase: () => {
	458	+ const { baseModes, requestedMode } = model
431	459
432		- if (!mode \|\| mode === model.requestedMode) {
	460	+ const mode =
	461	+ baseModes[(baseModes.indexOf(requestedMode) + 1) % baseModes.length] ??
	462	+ requestedMode
	463	+
	464	+ if (mode === requestedMode) {
433	465	return
434	466	}
435	467
		@@ -459,7 +491,7 @@
459	491	? { kind: 'turn', index }
460	492	: { kind: 'current' }
461	493
462		- model = { ...model, source, selectedPath: null }
	494	+ model = { ...model, source, selectedPath: null, dialogView: 'list' }
463	495	redraw(engine)
464	496	},
465	497	toggleAsk: path => {
		@@ -529,8 +561,6 @@
529	561	uiLog: text => $.ui.log(text),
530	562	openPane: pane => $.ui.open(pane),
531	563	closePane: pane => $.ui.close(pane),
532		- scrollTo: key =>
533		- $.ui.scroll({ to: { key }, in: Names.PANE_ID, block: 'start' }),
534	564	registerCommand: spec => $.command.register(spec),
535	565	sessionId: () => $.session.id(),
536	566	mark: entry => $.telemetry.mark(entry),
		@@ -556,8 +586,20 @@
556	586	const { Box, Text, Button, Select, Code } = await $.ui.resolve(e)
557	587
558	588	columns = e.viewport?.columns ?? columns
559		- model = { ...model, placement: e.props.placement }
560	589
	590	+ model = {
	591	+ ...model,
	592	+ placement: e.props.placement,
	593	+ place: {
	594	+ ...model.place,
	595	+ columns: Math.max(
	596	+ 1,
	597	+ e.props.bodyColumns - Limits.PANE_RIGHT_PAD_COLUMNS,
	598	+ ),
	599	+ rows: e.props.scroll.bodyRows,
	600	+ },
	601	+ }
	602	+
561	603	return Views.paneView(
562	604	{
563	605	ui: { Box, Text, Button, Select, Code },
		@@ -585,14 +627,27 @@
585	627	}
586	628	}
587	629
588		- const toggle = PaneToggle.paneToggleOf({ isOpen: isPaneOpen, columns })
	630	+ const { isFullscreen } = e.presentation
589	631
	632	+ columns = e.presentation.columns
	633	+ model = { ...model, isFullscreen }
	634	+
	635	+ const toggle = PaneToggle.paneToggleOf({
	636	+ isOpen: isPaneOpen,
	637	+ columns: isFullscreen ? columns : null,
	638	+ })
	639	+
590	640	if (toggle === 'too-narrow') {
591	641	return { text: Names.RESIZE_TERMINAL_TEXT }
592	642	}
593	643
594	644	const isOpening = toggle === 'open'
595	645	await (isOpening ? openPane(host, 'manual') : closePane(host))
	646	+
	647	+ if (!isFullscreen) {
	648	+ return isOpening ? {} : { text: Names.DIALOG_DISMISSED_TEXT }
	649	+ }
	650	+
596	651	markTabSwitch(host, isOpening ? 'diff' : 'convo')
597	652	await host.storeSet(Names.STORE_OPEN_KEY, isOpening).catch(() => undefined)
598	653
		@@ -602,6 +657,28 @@
602	657	})
603	658
604	659	on('ui.close', { id: Names.PANE_ID }, async ($, e, next) => {
	660	+ const isBack =
	661	+ e.origin.kind === 'person' &&
	662	+ model.placement === 'inline' &&
	663	+ model.dialogView === 'detail'
	664	+
	665	+ if (isBack && host) {
	666	+ model = { ...model, dialogView: 'list' }
	667	+ redraw(host)
	668	+
	669	+ void host
	670	+ .openPane({
	671	+ id: Names.PANE_ID,
	672	+ title: Names.PANE_TITLE,
	673	+ focus: true,
	674	+ closeOnEscape: true,
	675	+ holdToasts: true,
	676	+ })
	677	+ .catch(() => undefined)
	678	+
	679	+ return { deny: 'back to the file list' }
	680	+ }
	681	+
605	682	const result = await next(e)
606	683	const isClosed = result.deny === undefined
607	684	const isPersons = isClosed && e.origin.kind === 'person'
		@@ -610,7 +687,13 @@
610	687	isPaneOpen = false
611	688	}
612	689
613		- if (isPersons && host) {
	690	+ const isDialog = model.isFullscreen === false
	691	+
	692	+ if (isPersons && host && isDialog) {
	693	+ host.uiLog(Names.DIALOG_DISMISSED_TEXT)
	694	+ }
	695	+
	696	+ if (isPersons && host && !isDialog) {
614	697	markTabSwitch(host, 'convo')
615	698	await host.storeSet(Names.STORE_OPEN_KEY, false).catch(() => undefined)
616	699	}
		@@ -618,6 +701,19 @@
618	701	return result
619	702	})
620	703
	704	+ on('ui.scroll', { requestId: Names.PANE_ID }, ($, e, next) => {
	705	+ const isOwnBody = e.origin.kind === 'person' && model.placement === 'dock'
	706	+
	707	+ if (!isOwnBody \|\| !host) {
	708	+ return next(e)
	709	+ }
	710	+
	711	+ model = { ...model, place: Views.bodyScrolledBy(model, e) }
	712	+ host.invalidate()
	713	+
	714	+ return {}
	715	+ })
	716	+
621	717	on('command.run', { command: ['clear', 'resume'] }, async ($, e, next) => {
622	718	const result = await next(e)
623	719

		@@ -1,0 +1,47 @@
	1	+import type { UiScrollInput } from 'claude-code'
	2	+
	3	+import Limits from '../../limits'
	4	+import type PaneState from '../../pane-state'
	5	+import Plan from './plan'
	6	+
	7	+/**
	8	+ * The docked pane's place after one of the person's scrolls: a wheel tick
	9	+ * or arrow three rows, a page key the window's rows, Home and End the ends.
	10	+ *
	11	+ * Told apart by the rows the move asks for against the pane's body and
	12	+ * tree, as the engine sizes each; clamped to the body's extent.
	13	+ *
	14	+ * @param model the pane's state
	15	+ * @param scroll the move: its signed rows, the body's rows, the tree's rows
	16	+ * @returns the place
	17	+ */
	18	+export function bodyScrolledBy(
	19	+ model: PaneState.PaneModel,
	20	+ scroll: Pick<UiScrollInput, 'by' \| 'bodyRows' \| 'contentRows'>,
	21	+): PaneState.PaneModel['place'] {
	22	+ const { visibleRows, maxTop } = Plan.bodyLayoutOf(
	23	+ model,
	24	+ Plan.dockPlanOf(model),
	25	+ )
	26	+
	27	+ const size = Math.abs(scroll.by)
	28	+
	29	+ const isEnd =
	30	+ size >= scroll.contentRows && scroll.contentRows > scroll.bodyRows
	31	+
	32	+ const isPage = !isEnd && size >= scroll.bodyRows
	33	+
	34	+ const step = isEnd
	35	+ ? maxTop
	36	+ : isPage
	37	+ ? Math.max(1, visibleRows)
	38	+ : size * Limits.WHEEL_ROWS
	39	+
	40	+ return {
	41	+ ...model.place,
	42	+ top: Math.max(
	43	+ 0,
	44	+ Math.min(maxTop, model.place.top + Math.sign(scroll.by) * step),
	45	+ ),
	46	+ }
	47	+}

		@@ -1,0 +1,85 @@
	1	+/* @jsxRuntime classic */
	2	+/* @jsx h */
	3	+/* @jsxFrag Fragment */
	4	+import type { RenderElement } from 'claude-code'
	5	+
	6	+import Limits from '../../limits'
	7	+import type { Kit } from '../kit'
	8	+import Sections from '../sections'
	9	+import Plan from './plan'
	10	+import type { BodyLayout, Segment } from './types'
	11	+
	12	+/**
	13	+ * The rows of the docked body its window shows from a row down: each
	14	+ * segment drawn from the row the window cuts it at, until the window fills.
	15	+ *
	16	+ * A hunk cut by the window's top draws from the line holding that row on;
	17	+ * rows past its foot are the pane's to clip, so a few more are drawn than
	18	+ * fit (SCROLL_MARGIN_ROWS) lest a miscounted wrap leave it short.
	19	+ *
	20	+ * @param kit the elements, the handlers, the width
	21	+ * @param layout the body laid out
	22	+ * @param top the body row wanted at the window's top; clamped to the body
	23	+ * @returns the elements, top to bottom
	24	+ */
	25	+export function drawWindow(
	26	+ kit: Kit,
	27	+ layout: BodyLayout,
	28	+ top: number,
	29	+): RenderElement[] {
	30	+ const { Box, Text } = kit.ui
	31	+ const drawn: RenderElement[] = []
	32	+ const wanted = layout.visibleRows + Limits.SCROLL_MARGIN_ROWS
	33	+ const at = Math.max(0, Math.min(top, layout.maxTop))
	34	+ const onPress = kit.actions.togglePreSession
	35	+
	36	+ let start = 0
	37	+ let filled = 0
	38	+
	39	+ function elementOf(segment: Segment, skip: number): RenderElement {
	40	+ switch (segment.kind) {
	41	+ case 'rule':
	42	+ return Sections.divider(kit)
	43	+ case 'blank':
	44	+ return <Box height={1} />
	45	+ case 'name':
	46	+ return Sections.nameRow(kit, segment.name)
	47	+ case 'hunk':
	48	+ return Plan.hunkCodeOf(kit, segment, skip)
	49	+ case 'note':
	50	+ return (
	51	+ <Text dimColor italic wrap="wrap">
	52	+ {segment.text}
	53	+ </Text>
	54	+ )
	55	+ case 'footer':
	56	+ return (
	57	+ <Text dimColor italic>
	58	+ … diff truncated (exceeded 400 line limit)
	59	+ </Text>
	60	+ )
	61	+ case 'text':
	62	+ return Sections.dimNote(kit, segment.text)
	63	+ case 'toggle':
	64	+ return Sections.toggleRow(kit, 'presession', { ...segment, onPress })
	65	+ case 'legend':
	66	+ return Sections.legendRow(kit, segment.entry)
	67	+ }
	68	+ }
	69	+
	70	+ for (const segment of layout.segments) {
	71	+ const rows = Plan.segmentRowsOf(segment)
	72	+ const isShown = start + rows > at && filled < wanted
	73	+
	74	+ if (isShown) {
	75	+ const skip = Math.max(0, at - start)
	76	+
	77	+ drawn.push(elementOf(segment, skip))
	78	+ filled += rows - skip
	79	+ }
	80	+
	81	+ start += rows
	82	+ }
	83	+
	84	+ return drawn
	85	+}

		@@ -1,0 +1,9 @@
	1	+export * from './body-scrolled-by.js'
	2	+export * from './draw-window.jsx'
	3	+export * from './list-block-of.jsx'
	4	+export * from './list-scrolled-by.js'
	5	+export * from './place-at-file.js'
	6	+export * from './plan'
	7	+export * from './types'
	8	+
	9	+export * as default from '.'

		@@ -1,0 +1,89 @@
	1	+/* @jsxRuntime classic */
	2	+/* @jsx h */
	3	+/* @jsxFrag Fragment */
	4	+import type { RenderElement } from 'claude-code'
	5	+
	6	+import { keptOf } from '../../kept-of'
	7	+import Names from '../../names'
	8	+import type PaneState from '../../pane-state'
	9	+import type Entries from '../entries'
	10	+import type { Kit } from '../kit'
	11	+import Layout from '../layout'
	12	+import Sections from '../sections'
	13	+import Plan from './plan'
	14	+import type { DockPlan } from './types'
	15	+
	16	+/**
	17	+ * The docked list block (ReplDiffSidebar's summary rows): the window's rows
	18	+ * between its edge rows, the untracked note, the noise toggle.
	19	+ *
	20	+ * The edge rows count the files out of the window and take the built-in's
	21	+ * list keys; files past the row cap join the lower one. Empty with no row
	22	+ * and no noise to toggle.
	23	+ *
	24	+ * @param kit the elements, the handlers, the width
	25	+ * @param model the pane's state
	26	+ * @param plan the docked pane's decisions over that state
	27	+ * @returns the block's rows
	28	+ */
	29	+export function listBlockOf(
	30	+ kit: Kit,
	31	+ model: PaneState.PaneModel,
	32	+ plan: DockPlan,
	33	+): RenderElement[] {
	34	+ const { shown, above, below } = Plan.listWindowOf(model, plan)
	35	+ const { noiseCount } = plan.partition
	36	+ const { notShown } = plan.totals
	37	+ const hasNoise = !plan.turn && noiseCount > 0
	38	+ const hasMoreAbove = above > 0
	39	+ const hasMoreBelow = below > 0
	40	+ const hasNotShown = notShown > 0
	41	+ const noiseFace = model.isNoiseShown ? 'hide' : 'show'
	42	+
	43	+ const lower = keptOf([
	44	+ hasMoreBelow ? `${below} ${Names.MORE_BELOW_TEXT}` : null,
	45	+ hasNotShown ? `${notShown} not shown` : null,
	46	+ ]).join(' · ')
	47	+
	48	+ const rowOf = (entry: Entries.BodyEntry) =>
	49	+ Sections.fileRow(
	50	+ kit,
	51	+ {
	52	+ key: Sections.fileKeyOf(entry),
	53	+ path: entry.path,
	54	+ displayPath: entry.displayPath,
	55	+ added: entry.added,
	56	+ removed: entry.removed,
	57	+ note: null,
	58	+ isSelected: false,
	59	+ },
	60	+ () => kit.actions.selectFile(entry.path),
	61	+ )
	62	+
	63	+ const upperEdge = hasMoreAbove
	64	+ ? Sections.listEdgeButton(kit, 'list-up', `↑ ${above} more above`)
	65	+ : null
	66	+
	67	+ const lowerEdge = hasMoreBelow
	68	+ ? Sections.listEdgeButton(kit, 'list-down', `↓ ${lower}`)
	69	+ : hasNotShown
	70	+ ? Sections.dimNote(kit, `… ${lower}`)
	71	+ : null
	72	+
	73	+ const noiseToggle = hasNoise
	74	+ ? Sections.toggleRow(kit, 'noise', {
	75	+ label: `${Layout.plural(noiseCount, 'test')}/generated (${noiseFace})`,
	76	+ onPress: kit.actions.toggleNoise,
	77	+ })
	78	+ : null
	79	+
	80	+ return Sections.present([
	81	+ upperEdge,
	82	+ ...shown.map(rowOf),
	83	+ lowerEdge,
	84	+ plan.isUntrackedNoted
	85	+ ? Sections.dimNote(kit, Names.untrackedWithheldTextOf(model))
	86	+ : null,
	87	+ noiseToggle,
	88	+ ])
	89	+}

		@@ -1,0 +1,33 @@
	1	+import Limits from '../../limits'
	2	+import type PaneState from '../../pane-state'
	3	+import DialogPane from '../dialog-pane'
	4	+import Plan from './plan'
	5	+
	6	+/**
	7	+ * The pane's place with its list window moved by so many files, clamped:
	8	+ * docked, ReplDiffSidebar's scrollSummary; inline, the dialog's window.
	9	+ *
	10	+ * @param model the pane's state
	11	+ * @param delta the files to move by, negative toward the top
	12	+ * @returns the place
	13	+ */
	14	+export function listScrolledBy(
	15	+ model: PaneState.PaneModel,
	16	+ delta: number,
	17	+): PaneState.PaneModel['place'] {
	18	+ const isDocked = model.placement === 'dock'
	19	+ const paths = DialogPane.dialogEntriesOf(model).map(entry => entry.path)
	20	+
	21	+ const last = isDocked
	22	+ ? Plan.dockPlanOf(model).rows.length - Limits.MAX_SUMMARY_ROWS
	23	+ : paths.length - Limits.MAX_VISIBLE_FILES
	24	+
	25	+ const start = isDocked
	26	+ ? Math.min(model.place.listStart, Math.max(0, last))
	27	+ : DialogPane.dialogWindowOf(model, paths)
	28	+
	29	+ return {
	30	+ ...model.place,
	31	+ listStart: Math.max(0, Math.min(Math.max(0, last), start + delta)),
	32	+ }
	33	+}

		@@ -1,0 +1,64 @@
	1	+import Limits from '../../../limits'
	2	+import type PaneState from '../../../pane-state'
	3	+import type { BodyLayout, DockPlan } from '../types'
	4	+import Segments from './segments'
	5	+
	6	+/**
	7	+ * The docked pane's scrolling body laid out under its pinned rows: the
	8	+ * segments, their rows, the window's rows, where each file's block starts.
	9	+ *
	10	+ * The pinned rows are counted as sidebarPane draws them (header, base or
	11	+ * turn line, todo bar, list block); read from the box last drawn (`place`),
	12	+ * so before any draw the window shows nothing and the top stays 0.
	13	+ *
	14	+ * @param model the pane's state
	15	+ * @param plan the docked pane's decisions over that state
	16	+ * @returns the layout
	17	+ */
	18	+export function bodyLayoutOf(
	19	+ model: PaneState.PaneModel,
	20	+ plan: DockPlan,
	21	+): BodyLayout {
	22	+ const segments = Segments.segmentsOf(model, plan)
	23	+ const window = Segments.listWindowOf(model, plan)
	24	+ const hasNoise = !plan.turn && plan.partition.noiseCount > 0
	25	+ const isListed = plan.message.length === 0
	26	+ const hasList = isListed && (plan.rows.length > 0 \|\| hasNoise)
	27	+
	28	+ const listRows = hasList
	29	+ ? window.shown.length +
	30	+ Number(window.above > 0) +
	31	+ Number(window.below > 0 \|\| plan.totals.notShown > 0) +
	32	+ Number(plan.isUntrackedNoted) +
	33	+ Number(hasNoise) +
	34	+ 2
	35	+ : Number(isListed)
	36	+
	37	+ const headRows =
	38	+ 1 + Number(plan.line !== null) + (model.todos.total > 0 ? 2 : 0)
	39	+
	40	+ const tops = new Map<string, number>()
	41	+
	42	+ const visibleRows = Math.max(
	43	+ 0,
	44	+ model.place.rows - Limits.PANE_TOP_PAD_ROWS - headRows - listRows,
	45	+ )
	46	+
	47	+ let extent = 0
	48	+
	49	+ for (const segment of segments) {
	50	+ if (segment.kind === 'rule' && segment.path !== null) {
	51	+ tops.set(segment.path, extent)
	52	+ }
	53	+
	54	+ extent += Segments.segmentRowsOf(segment)
	55	+ }
	56	+
	57	+ return {
	58	+ segments,
	59	+ extent,
	60	+ visibleRows,
	61	+ maxTop: Math.max(0, extent - visibleRows),
	62	+ tops,
	63	+ }
	64	+}

		@@ -1,0 +1,80 @@
	1	+import PaneState from '../../../pane-state'
	2	+import DialogPane from '../../dialog-pane'
	3	+import Entries from '../../entries'
	4	+import Layout from '../../layout'
	5	+import type { DockPlan } from '../types'
	6	+
	7	+/**
	8	+ * The docked pane's decisions over a model (ReplDiffSidebarBody's): which
	9	+ * rows list, what the header counts, what stands in for an empty list.
	10	+ *
	11	+ * Over a picked turn the rows are the turn's files and nothing is empty;
	12	+ * else the fetch's session rows, its pre-session rows apart. Under the
	13	+ * header: the base line outside settled session mode, or the unborn note.
	14	+ *
	15	+ * @param model the pane's state
	16	+ * @returns the plan
	17	+ */
	18	+export function dockPlanOf(model: PaneState.PaneModel): DockPlan {
	19	+ const { data, requestedMode } = model
	20	+ const turn = PaneState.pickedTurnOf(model)
	21	+ const noise = model.isNoiseShown ? 'shown' : 'hidden'
	22	+ const partition = PaneState.partitionOf(data?.files ?? [], noise)
	23	+ const face = model.isPreSessionShown ? 'hide' : 'show'
	24	+
	25	+ const totals = turn
	26	+ ? PaneState.turnTotalsOf(turn)
	27	+ : data
	28	+ ? PaneState.headerTotalsOf(data, partition)
	29	+ : PaneState.ZERO_TOTALS
	30	+
	31	+ const empty = turn ? null : PaneState.emptyStateOf(model, totals.filesCount)
	32	+
	33	+ const listed = turn
	34	+ ? []
	35	+ : DialogPane.listBodyOf({ data, partition, totals, empty })
	36	+
	37	+ const notes = listed.flatMap(line => (typeof line === 'string' ? [line] : []))
	38	+ const hasRows = turn ? turn.files.length > 0 : notes.length < listed.length
	39	+
	40	+ const entryOf = (file: Parameters<typeof Entries.bodyEntryOf>[0]) =>
	41	+ Entries.bodyEntryOf(file, model)
	42	+
	43	+ const rows = turn
	44	+ ? turn.files.map(Entries.turnEntryOf)
	45	+ : hasRows
	46	+ ? partition.shown.map(entryOf)
	47	+ : []
	48	+
	49	+ const earlier = turn ? [] : partition.preSession.map(entryOf)
	50	+ const hasEarlier = earlier.length > 0
	51	+
	52	+ const isBaseShown =
	53	+ data !== null &&
	54	+ !data.isUnborn &&
	55	+ (requestedMode !== 'session' \|\| data.mode !== 'session')
	56	+
	57	+ const line = turn
	58	+ ? `Turn ${turn.index} "${turn.preview}"`
	59	+ : isBaseShown
	60	+ ? PaneState.modeLabelOf(requestedMode, model)
	61	+ : PaneState.unbornNoteOf(model, totals.filesCount)
	62	+
	63	+ return {
	64	+ turn,
	65	+ partition,
	66	+ totals,
	67	+ empty,
	68	+ line: line === null ? null : Layout.sanitizeName(line),
	69	+ rows,
	70	+ earlier,
	71	+ earlierLabel: hasEarlier
	72	+ ? `+${Layout.plural(earlier.length, 'file')} edited before this ` +
	73	+ `session (${face})`
	74	+ : null,
	75	+ notes,
	76	+ message: empty ? [empty.headline, ...notes] : hasRows ? [] : notes,
	77	+ isUntrackedNoted:
	78	+ !turn && data?.isUntrackedWithheld === true && empty === null,
	79	+ }
	80	+}

		@@ -1,0 +1,6 @@
	1	+export * from './body-layout-of.js'
	2	+export * from './dock-plan-of.js'
	3	+export * from './hunk-code-of.jsx'
	4	+export * from './segments'
	5	+
	6	+export * as default from '.'

		@@ -1,0 +1,5 @@
	1	+export * from './list-window-of.js'
	2	+export * from './segment-rows-of.js'
	3	+export * from './segments-of.js'
	4	+
	5	+export * as default from '.'

		@@ -1,0 +1,29 @@
	1	+import Limits from '../../../../limits'
	2	+import type PaneState from '../../../../pane-state'
	3	+import type { DockPlan, ListWindow } from '../../types'
	4	+
	5	+/**
	6	+ * The docked list's MAX_SUMMARY_ROWS-row window starting at the file the
	7	+ * person scrolled it to, clamped so a shrinking list pulls it back.
	8	+ *
	9	+ * @param model where the person put the list window
	10	+ * @param plan the docked pane's rows
	11	+ * @returns the window
	12	+ */
	13	+export function listWindowOf(
	14	+ model: Pick<PaneState.PaneModel, 'place'>,
	15	+ plan: Pick<DockPlan, 'rows'>,
	16	+): ListWindow {
	17	+ const first = Math.max(
	18	+ 0,
	19	+ Math.min(model.place.listStart, plan.rows.length - Limits.MAX_SUMMARY_ROWS),
	20	+ )
	21	+
	22	+ const shown = plan.rows.slice(first, first + Limits.MAX_SUMMARY_ROWS)
	23	+
	24	+ return {
	25	+ shown,
	26	+ above: first,
	27	+ below: plan.rows.length - first - shown.length,
	28	+ }
	29	+}

		@@ -1,0 +1,11 @@
	1	+import type { Segment } from '../../types'
	2	+
	3	+/**
	4	+ * The rows a segment takes: a hunk's as counted when it was laid out, one
	5	+ * for anything else.
	6	+ *
	7	+ * @param segment the segment
	8	+ * @returns the rows
	9	+ */
	10	+export const segmentRowsOf = (segment: Segment): number =>
	11	+ segment.kind === 'hunk' ? segment.rows : 1

		@@ -1,0 +1,124 @@
	1	+import { countOf } from '../../../../count-of'
	2	+import type Git from '../../../../git'
	3	+import { keptOf } from '../../../../kept-of'
	4	+import Limits from '../../../../limits'
	5	+import type PaneState from '../../../../pane-state'
	6	+import Detail from '../../../detail'
	7	+import Entries from '../../../entries'
	8	+import Layout from '../../../layout'
	9	+import type { DockPlan, Segment } from '../../types'
	10	+
	11	+/**
	12	+ * The docked pane's scrolling body as segments (ReplDiffSidebar's scroll
	13	+ * box): each listed file's block, a blank between, the pre-session section.
	14	+ *
	15	+ * Under an empty state whose pre-session section is open, the empty lines
	16	+ * head the body instead. A hunk carries the rows its lines take wrapped
	17	+ * past the engine's gutter at the body's width; pre-session bodies stack.
	18	+ *
	19	+ * @param model the pane's state: which file is armed, which section is open
	20	+ * @param plan the docked pane's decisions over that state
	21	+ * @returns the segments, top to bottom
	22	+ */
	23	+export function segmentsOf(
	24	+ model: PaneState.PaneModel,
	25	+ plan: DockPlan,
	26	+): Segment[] {
	27	+ const { earlier } = plan
	28	+ const { columns } = model.place
	29	+ const isEmptied = plan.message.length > 0
	30	+ const isOpen = model.isPreSessionShown && earlier.length > 0
	31	+ const isCapped = earlier.length > Limits.PRE_SESSION_BODY_CAP
	32	+
	33	+ const gutterOf = (hunk: Git.Hunk) =>
	34	+ String(
	35	+ Math.max(
	36	+ 1,
	37	+ hunk.oldStart + countOf(hunk.lines, line => !line.startsWith('+')) - 1,
	38	+ hunk.newStart + countOf(hunk.lines, line => !line.startsWith('-')) - 1,
	39	+ ),
	40	+ ).length + Limits.GUTTER_CHROME
	41	+
	42	+ function hunkOf(entry: Entries.BodyEntry, hunk: Git.Hunk): Segment {
	43	+ const room = Math.max(1, columns - gutterOf(hunk))
	44	+
	45	+ const lineRows = hunk.lines.map(line =>
	46	+ Math.max(
	47	+ 1,
	48	+ Math.ceil(
	49	+ Layout.cellWidth(
	50	+ Layout.sanitizeLine(
	51	+ line.slice(1).replaceAll('\t', ' '.repeat(Layout.TAB_WIDTH)),
	52	+ ),
	53	+ ) / room,
	54	+ ),
	55	+ ),
	56	+ )
	57	+
	58	+ return {
	59	+ kind: 'hunk',
	60	+ path: entry.path,
	61	+ hunk,
	62	+ lineRows,
	63	+ rows: lineRows.reduce((sum, rows) => sum + rows, 0),
	64	+ }
	65	+ }
	66	+
	67	+ function fileOf(entry: Entries.BodyEntry): Segment[] {
	68	+ const detail = Entries.detailModelOf(entry, model)
	69	+ const notes = Detail.placeholderOf(detail)
	70	+ const isTruncated = entry.body?.isTruncated === true
	71	+
	72	+ const body: Segment[] = notes
	73	+ ? notes.map(text => ({ kind: 'note', text }))
	74	+ : (entry.body?.hunks ?? []).map(hunk => hunkOf(entry, hunk))
	75	+
	76	+ return [
	77	+ { kind: 'rule', path: entry.path },
	78	+ {
	79	+ kind: 'name',
	80	+ name: { ...detail, isTruncated, isAskable: notes === null },
	81	+ },
	82	+ { kind: 'rule', path: null },
	83	+ ...body,
	84	+ ...(isTruncated ? [{ kind: 'footer' } as const] : []),
	85	+ ]
	86	+ }
	87	+
	88	+ const spacedFileOf = (entry: Entries.BodyEntry): Segment[] => [
	89	+ ...fileOf(entry),
	90	+ { kind: 'blank' },
	91	+ ]
	92	+
	93	+ const messageOf = (): Segment[] => [
	94	+ { kind: 'blank' },
	95	+ ...plan.message.map(text => ({
	96	+ kind: 'text' as const,
	97	+ text: Layout.sanitizeName(text),
	98	+ })),
	99	+ { kind: 'blank' },
	100	+ ]
	101	+
	102	+ const hiddenNote: Segment = {
	103	+ kind: 'text',
	104	+ text: `diffs hidden above ${Limits.PRE_SESSION_BODY_CAP} files`,
	105	+ }
	106	+
	107	+ const bodiesOf = (): Segment[] =>
	108	+ isCapped ? [hiddenNote] : earlier.flatMap(fileOf)
	109	+
	110	+ const openedOf = (): Segment[] => [
	111	+ { kind: 'blank' },
	112	+ ...earlier.map(entry => ({ kind: 'legend' as const, entry })),
	113	+ ...bodiesOf(),
	114	+ ]
	115	+
	116	+ return [
	117	+ ...(isEmptied ? messageOf() : plan.rows.flatMap(spacedFileOf)),
	118	+ ...keptOf([plan.earlierLabel]).map(label => ({
	119	+ kind: 'toggle' as const,
	120	+ label,
	121	+ })),
	122	+ ...(isOpen ? openedOf() : []),
	123	+ ]
	124	+}