pi-odd-worktree 0.0.0-stage → 0.1.0

package/lib/tui-paint.js

@@ -0,0 +1,273 @@
+'use strict';
+// Shared palette for the full-screen readers (issues-view S11, odd-viewer S11,
+// customize S11).
+//
+// ONE place decides which theme role paints each kind of token — a shortcut KEY
+// versus its description, a frame title, a count, a static label, a live search
+// value — so every footer and header in these views reads as the same palette
+// and neither view keeps a second copy of the same try/catch wrappers.
+//
+// Roles are theme ROLE NAMES the host theme resolves (`accent`, `muted`, `dim`,
+// `border`, `error`, …). Nothing here names a colour or an escape sequence: a
+// caller injects the theme, and a missing, partial or throwing theme degrades to
+// plain text instead of breaking a render. Shortcut keys and titles are
+// emphasized through the theme's own `bold`, so the pairings below stay
+// distinguishable in a monochrome terminal too, where roles collapse to one
+// colour.
+//
+// S13/S16 («fijate en los titulos, usa un color secundario … para los botones
+// usa el principal del tema»): the reference is the Pi **Agents** view the reader
+// screenshotted, and its source lives in the installed `gentle-pi` package — no
+// colour is inferred here.
+//
+//   - TITLE = `customMessageLabel`. That view declares its role table at
+//     `gentle-pi/lib/agents-view.ts:42` —
+//       const ROLE = { FRAME: "border", TITLE: "customMessageLabel",
+//                      SELECTED: "accent", NAME: "text", NAME_IDLE: "muted",
+//                      META: "dim", KEY: "accent", KEY_TEXT: "dim", EMPTY: "dim" }
+//     — and paints its frame title with it at the same file's line 437:
+//       theme.fg(ROLE.FRAME, "╭─ ") + theme.fg(ROLE.TITLE, `❀ Agents · …`) + …
+//     The Jobs view uses the identical table (`gentle-pi/lib/jobs-view.ts:23`),
+//     so `customMessageLabel` is that family's panel-title role: a secondary,
+//     tinted colour (pi's dark theme resolves it to a purple, TokyoNight to
+//     `sky`) that is visibly NOT the primary accent and NOT a neutral grey.
+//   - BUTTON = the primary accent. The same table maps `KEY: "accent"` and
+//     `SELECTED: "accent"`, so every shortcut key and the selection stay on the
+//     primary colour (pi's documented accent: "logo, selected items, cursor").
+//   - ordinary text = `text` (`NAME: "text"` in that table); a selected row is
+//     told apart by its own `selectedBg` band rather than by being repainted.
+//   - `dim` stays what that table calls `META`/`KEY_TEXT`/`EMPTY`: small
+//     metadata, key descriptions and placeholders — which is also our `label`.
+//
+// Rejected earlier candidates: the Herdr *app*'s Agents sidebar paints its title
+// with `t.dim` (`~/.config/herdr-app/mods/agents/main.js:413`), but that is a
+// different product from the Pi Agents view the reader pointed at, and the
+// reader explicitly called a grey title wrong. `mdHeading` (a Markdown document
+// heading role) is not a UI title role either.
+
+// The role per token kind. `key` and `title` are painted AND emphasized;
+// `description`, `count` and `label` are colour-only, which is exactly what
+// keeps a key distinguishable from the words next to it.
+const ROLES = Object.freeze({
+  key: 'accent',
+  title: 'customMessageLabel',
+  description: 'muted',
+  count: 'muted',
+  label: 'dim',
+  value: 'text',
+  border: 'border',
+  error: 'error',
+});
+
+function textOf(value) {
+  if (typeof value === 'string') return value;
+  return value == null ? '' : String(value);
+}
+
+/**
+ * Paint `text` with one theme role.
+ *
+ * A theme that is absent, that has no `fg`, that throws, or that answers
+ * something that is not a string leaves the text unpainted — a hostile theme
+ * never breaks a view.
+ */
+function paint(theme, role, text) {
+  const value = textOf(text);
+  try {
+    if (theme && typeof theme.fg === 'function') {
+      const painted = theme.fg(role, value);
+      if (typeof painted === 'string') return painted;
+    }
+  } catch {
+    // Fall through to the plain text.
+  }
+  return value;
+}
+
+/** Bold `text` through the theme, or leave it plain for a hostile theme. */
+function emphasize(theme, text) {
+  const value = textOf(text);
+  try {
+    if (theme && typeof theme.bold === 'function') {
+      const bold = theme.bold(value);
+      if (typeof bold === 'string') return bold;
+    }
+  } catch {
+    // Fall through to the plain text.
+  }
+  return value;
+}
+
+/**
+ * The focused-row form: a selected-background band when the theme offers one,
+ * otherwise the accent role. This is what tells a SELECTED row apart from the
+ * ordinary `text` rows the palette paints (S13): focus never depends on the row
+ * already being a different colour. It stays visible on a theme that answers
+ * neither because the callers also mark the row with `▸`.
+ */
+function highlight(theme, text, focused) {
+  const value = textOf(text);
+  if (!focused) return value;
+  try {
+    if (theme && typeof theme.bg === 'function') {
+      const painted = theme.bg('selectedBg', value);
+      if (typeof painted === 'string') return painted;
+    }
+  } catch {
+    // Fall through to the accent form below.
+  }
+  return paint(theme, ROLES.key, value);
+}
+
+/** A shortcut key (a button): the PRIMARY accent + bold, never accent alone. */
+function key(theme, text) {
+  return emphasize(theme, paint(theme, ROLES.key, text));
+}
+
+/**
+ * A frame title: the role the Pi Agents view paints its own title with
+ * (`customMessageLabel`) + bold, named for what it is. A title is never painted
+ * with the primary `key` role (S13), never with `dim` (the grey the reader
+ * rejected) and never with a Markdown heading role.
+ */
+function title(theme, text) {
+  return emphasize(theme, paint(theme, ROLES.title, text));
+}
+
+/** What a shortcut key does. */
+function description(theme, text) {
+  return paint(theme, ROLES.description, text);
+}
+
+/** A tab count, a document count, a status word. */
+function count(theme, text) {
+  return paint(theme, ROLES.count, text);
+}
+
+/** A static label or prompt the reader does not type into. */
+function label(theme, text) {
+  return paint(theme, ROLES.label, text);
+}
+
+/**
+ * A live value the reader typed or derived — the query in the search row, a
+ * branch, a path, a page number. It is ordinary text, so it stays out of the
+ * accent a button owns and the selected row keeps its own band.
+ */
+function value(theme, text) {
+  return paint(theme, ROLES.value, text);
+}
+
+// The legend joins its kept entries with this separator (the same one the
+// one-row footer always used).
+const LEGEND_SEPARATOR = ' · ';
+
+// S14: one scroll GROUP is every hint that pages the same target — the primary
+// pair, the always-available page pair, the half-page pair, the printable
+// fallback. The reader reported the alternates as noise («alguna key generidad
+// como el page o half estan demas»), so the legend spends ONE token on the
+// group and says what it does (`ctrl+j/k scroll`); the list keys that also
+// scroll keep working unadvertised. Callers pass their own target word.
+const DEFAULT_SCROLL_LABEL = 'scroll';
+
+/**
+ * Collapse one scroll group's hints into the SINGLE legend entry that names
+ * the target it scrolls (S14).
+ *
+ * The group's FIRST entry decides both the key spelling and the priority: it is
+ * the binding the caller considers primary (the one the terminal can actually
+ * deliver), and the entries after it are alternates for the same target, so
+ * their tokens leave the legend. Only the HINT collapses — the caller's key
+ * handler is untouched, so a dropped token keeps working.
+ *
+ * @param {Array<{key?: string, text?: string, short?: string, priority?: number}>} entries
+ *   the group's entries, primary first.
+ * @param {string} [target] the pane the keys scroll, e.g. `doc`.
+ * @returns {{key: string, text: string, short: string, priority: number}|null}
+ *   the labelled entry, or null for an empty group so a caller can spread it
+ *   unconditionally.
+ */
+function scrollHint(entries, target) {
+  const list = (Array.isArray(entries) ? entries : []).filter((entry) => entry && typeof entry === 'object');
+  if (list.length === 0) return null;
+  const primary = list[0];
+  const keys = textOf(primary.key) || textOf(primary.short) || textOf(primary.text);
+  if (keys === '') return null;
+  // The target survives compaction: an unlabelled key pair is exactly the
+  // ambiguity S14 reported, so `short` carries the label too.
+  const token = `${keys} ${textOf(target) || DEFAULT_SCROLL_LABEL}`;
+  return {
+    key: keys,
+    text: token,
+    short: token,
+    priority: Number.isFinite(Number(primary.priority)) ? Number(primary.priority) : 0,
+  };
+}
+
+// Which entries survive, and which spelling of them: the FULL token while it
+// fits, then the compact token, then the same list minus its lowest-priority
+// entries until something fits. Display order never changes and no token
+// carries a newline, so the legend stays on ONE row.
+function legendSelection(entries, width, measure) {
+  const list = Array.isArray(entries) ? entries : [];
+  const join = (items, field) => items.map((entry) => textOf(entry && entry[field])).join(LEGEND_SEPARATOR);
+  const fits = (text) => {
+    try {
+      return Number(measure(text)) <= width;
+    } catch {
+      // A hostile measurer never claims a fit.
+      return false;
+    }
+  };
+  if (fits(join(list, 'text'))) return { entries: list, field: 'text' };
+  if (fits(join(list, 'short'))) return { entries: list, field: 'short' };
+  const kept = list.slice();
+  while (kept.length > 1) {
+    let drop = 0;
+    for (let at = 1; at < kept.length; at += 1) {
+      if (kept[at].priority <= kept[drop].priority) drop = at;
+    }
+    kept.splice(drop, 1);
+    if (fits(join(kept, 'short'))) break;
+  }
+  return { entries: kept, field: 'short' };
+}
+
+// One legend entry: its `key` prefix carries the key role (+ bold) and the rest
+// of the token carries the description role. An entry without a `key`, or one
+// whose chosen spelling does not start with it, is a description throughout —
+// the legend never guesses where a key ends and the words begin.
+function entryCell(theme, entry, field) {
+  const spelled = textOf(entry && entry[field]);
+  const keys = textOf(entry && entry.key);
+  if (keys === '' || !spelled.startsWith(keys)) return description(theme, spelled);
+  const rest = spelled.slice(keys.length);
+  if (rest === '') return key(theme, keys);
+  return `${key(theme, keys)}${description(theme, rest)}`;
+}
+
+/**
+ * The painted legend row: keys in the key role, descriptions in the muted one,
+ * compacted to ONE row as described above. `measure` reports the visible width
+ * of a string (ANSI-aware), so painting never changes what fits.
+ */
+function legendRow(theme, entries, width, measure) {
+  const selection = legendSelection(entries, width, measure);
+  const separator = paint(theme, ROLES.border, LEGEND_SEPARATOR);
+  return selection.entries.map((entry) => entryCell(theme, entry, selection.field)).join(separator);
+}
+
+module.exports = {
+  ROLES,
+  count,
+  description,
+  emphasize,
+  highlight,
+  key,
+  label,
+  legendRow,
+  paint,
+  scrollHint,
+  title,
+  value,
+};

package/lib/view-layout.js

@@ -0,0 +1,368 @@
+'use strict';
+// Shared layout for the full-screen readers (issues-view, odd-view). One place
+// decides how wide the left list is and how many of its wrapped rows fit the
+// real body budget, so the two readers cannot drift apart the way they did when
+// each kept its own 34/36-column cap and its own fixed page size (S3, S5, S8,
+// D3).
+//
+// S3 also decides HOW the list moves: the issues and ODD readers scroll one
+// continuous window (`scrollWindow`/`shiftWindow`) with no page navigation. The
+// discrete `paginate` bounds the retired full-screen worktree detail was built
+// on stay exported for the layout tests and any paginated caller.
+//
+// Everything here is pure and injected: width measurement arrives through the
+// caller's TUI helpers, and no module-level state exists.
+//
+// Widths are counted in terminal cells, so a wide character costs what the
+// host says it costs, never a codepoint count.
+
+// The frame's own cells: `│ ` on the left and ` │` on the right.
+const CARD_PADDING = 4;
+// The divider between the two panes: ` │ `.
+const DIVIDER = 3;
+// The preview keeps at least this many cells on a terminal that can afford
+// it, and shrinks first on one that cannot.
+const PREVIEW_MIN = 24;
+// The left pane never drops below this while the terminal has room for it.
+const LIST_MIN = 8;
+// The default share is the 40% list / 60% preview split (S5) the retired
+// full-screen worktree detail was built on; the readers pass their own below.
+const LIST_SHARE = 0.4;
+// The issues and ODD readers ask for the smaller 30% share instead (S3): their
+// list is a short index of titles, so the reading pane gets the room.
+const READER_LIST_SHARE = 0.3;
+
+function num(value) {
+  const parsed = Number(value);
+  return Number.isFinite(parsed) ? parsed : 0;
+}
+
+function clampInt(value, min, max) {
+  const low = Math.ceil(num(min));
+  const high = Math.floor(num(max));
+  const wanted = Math.round(num(value));
+  if (high <= low) return Math.max(1, Math.min(low, high));
+  return Math.max(low, Math.min(high, wanted));
+}
+
+function measure(helpers, text) {
+  try {
+    if (helpers && typeof helpers.visibleWidth === 'function') {
+      const size = Number(helpers.visibleWidth(text));
+      if (Number.isFinite(size)) return size;
+    }
+  } catch {
+    // Fall through to the plain codepoint count.
+  }
+  return [...String(text).replace(/\x1b\[[0-9;]*m/g, '')].length;
+}
+
+/** Inner card width: the outer width minus the frame's own cells. */
+function innerWidth(width) {
+  return Math.max(1, Math.floor(num(width)) - CARD_PADDING);
+}
+
+/**
+ * The two pane widths for one inner width.
+ *
+ * `options.listShare` selects the list's share of the inner width; it defaults
+ * to the 40% the retired full-screen worktree detail was built on, and the
+ * issues and ODD readers pass `READER_LIST_SHARE` for their smaller 30% index
+ * (S3). The floors below
+ * only speak on a terminal too narrow for the split: both panes stay positive
+ * and the list keeps its minimum before the divider does.
+ *
+ * @param {number} inner the inner card width in cells.
+ * @param {{listShare?: number}} [options] the list's share of `inner`.
+ * @returns {{left: number, right: number, divider: number}}
+ */
+function paneWidths(inner, options = {}) {
+  const usable = Math.max(2, Math.floor(num(inner)));
+  const asked = num(options && options.listShare);
+  const share = asked > 0 && asked < 1 ? asked : LIST_SHARE;
+  const listFloor = Math.min(LIST_MIN, Math.max(1, usable - DIVIDER - 1));
+  let left = Math.round(usable * share);
+  if (left < listFloor) left = listFloor;
+  const previewFloor = Math.min(PREVIEW_MIN, Math.max(1, Math.floor(usable / 3)));
+  const maxLeft = usable - previewFloor - DIVIDER;
+  if (left > maxLeft) left = Math.max(listFloor, maxLeft);
+  left = clampInt(left, 1, Math.max(1, usable - DIVIDER - 1));
+  const right = Math.max(1, usable - left - DIVIDER);
+  return { left, right, divider: DIVIDER };
+}
+
+/**
+ * ONE list label's break opportunities.
+ *
+ * Whitespace separates words, and a hyphen ends a segment too, so a
+ * hyphenated name splits at its own separators instead of mid-word (S17).
+ * `glue` says the piece attaches directly to the one before it — a hyphen
+ * stays with the piece it closes, which is what makes the join lossless.
+ */
+function labelAtoms(text) {
+  const atoms = [];
+  for (const word of String(text ?? '').split(/\s+/).filter(Boolean)) {
+    const pieces = word.split(/(?<=-)/);
+    for (let at = 0; at < pieces.length; at += 1) {
+      atoms.push({ text: pieces[at], glue: at > 0 });
+    }
+  }
+  return atoms;
+}
+
+/**
+ * ONE list label wrapped to the pane width.
+ *
+ * `first` prefixes the first row (the focus marker) and `rest` every
+ * continuation row, both measured out of the available text width so the
+ * first row never loses a cell to the marker. Rows break at spaces and at
+ * hyphens; only a segment wider than the whole pane is hard-broken, because a
+ * title is never truncated to fit a row budget (S3, S17).
+ */
+function wrapLabel(helpers, text, width, options = {}) {
+  const first = String(options.first ?? '  ');
+  const rest = String(options.rest ?? '  ');
+  const total = Math.max(1, Math.floor(num(width)));
+  const firstRoom = Math.max(1, total - measure(helpers, first));
+  const restRoom = Math.max(1, total - measure(helpers, rest));
+  const rows = [];
+  let room = firstRoom;
+  let line = '';
+  const push = (value, nextRoom) => {
+    rows.push(value);
+    room = nextRoom;
+    line = '';
+  };
+  for (const atom of labelAtoms(text)) {
+    const glued = line === '' ? atom.text : (atom.glue ? `${line}${atom.text}` : `${line} ${atom.text}`);
+    if (measure(helpers, glued) <= room) {
+      line = glued;
+      continue;
+    }
+    if (line !== '') push(line, restRoom);
+    let tail = atom.text;
+    while (measure(helpers, tail) > room) {
+      const cut = hardCut(helpers, tail, room);
+      if (cut === '') break;
+      push(cut, restRoom);
+      tail = tail.slice(cut.length);
+    }
+    line = tail;
+  }
+  if (line !== '' || rows.length === 0) rows.push(line);
+  return rows.map((row, at) => `${at === 0 ? first : rest}${row}`);
+}
+
+// The longest prefix of `text` that fits `room` cells, at least one character
+// so a pane narrower than a single glyph still advances.
+function hardCut(helpers, text, room) {
+  const chars = [...text];
+  let cut = '';
+  for (const char of chars) {
+    if (measure(helpers, cut + char) > room) break;
+    cut += char;
+  }
+  return cut === '' ? chars[0] ?? '' : cut;
+}
+
+/** How many screen rows one wrapped label costs at `width`. */
+function rowCost(helpers, text, width, options = {}) {
+  return wrapLabel(helpers, text, width, options).length;
+}
+
+/**
+ * Page bounds for a list whose items cost `rowCosts[i]` screen rows.
+ *
+ * The discrete page bounds are kept from the retired full-screen worktree
+ * detail; the issues and ODD readers use `scrollWindow`/`shiftWindow` below
+ * instead (S3). A page holds as many
+ * whole items as fit `budget` rows; an item is never split across pages, an
+ * item taller than the budget still gets its own page, and every item lands on
+ * exactly one page (S8: capacity follows the wrapped titles and the real body
+ * height, never a fixed item count).
+ *
+ * @returns {Array<{start: number, end: number, rows: number}>}
+ */
+function paginate(rowCosts, budget) {
+  const list = Array.isArray(rowCosts) ? rowCosts : [];
+  const size = Math.max(1, Math.floor(num(budget)));
+  const pages = [];
+  let start = 0;
+  while (start < list.length) {
+    let end = start;
+    let rows = 0;
+    while (end < list.length) {
+      const cost = Math.max(1, Math.ceil(num(list[end])));
+      if (end > start && rows + cost > size) break;
+      rows += cost;
+      end += 1;
+    }
+    pages.push({ start, end, rows });
+    start = end;
+  }
+  if (pages.length === 0) pages.push({ start: 0, end: 0, rows: 0 });
+  return pages;
+}
+
+/** The (clamped) page that holds `index`, 1-based like the footer reads it. */
+function pageForIndex(pages, index) {
+  const bounds = Array.isArray(pages) && pages.length > 0 ? pages : [{ start: 0, end: 0, rows: 0 }];
+  const wanted = Math.max(0, Math.floor(num(index)));
+  for (let at = 0; at < bounds.length; at += 1) {
+    if (wanted >= bounds[at].start && wanted < bounds[at].end) {
+      return { page: at + 1, bounds: bounds[at] };
+    }
+  }
+  const last = bounds.length - 1;
+  return { page: last + 1, bounds: bounds[last] };
+}
+
+/** The requested (clamped) page with its 1-based number and total count. */
+function pageOf(rowCosts, options = {}) {
+  const pages = paginate(rowCosts, options.budget);
+  const wanted = Math.max(1, Math.floor(num(options.page)) || 1);
+  const page = Math.min(wanted, pages.length);
+  return { page, pageCount: pages.length, start: pages[page - 1].start, end: pages[page - 1].end };
+}
+
+// One item's row cost, clamped to at least one row so a zero or hostile cost
+// can never make the window consume unbounded items.
+function costOf(value) {
+  return Math.max(1, Math.ceil(num(value)));
+}
+
+function toCosts(rowCosts) {
+  return Array.isArray(rowCosts) ? rowCosts.map(costOf) : [];
+}
+
+// An item index clamped into `0..max`. Unlike `clampInt` this is happy with a
+// zero-width range, which a one-item list has.
+function clampIndex(value, max) {
+  const wanted = Math.floor(num(value));
+  if (!Number.isFinite(wanted)) return 0;
+  return Math.max(0, Math.min(Math.max(0, max), wanted));
+}
+
+// The index just past the last item fully inside `budget` rows from `start`.
+// The first item is always included, so an item taller than the budget still
+// gets a window of its own.
+function windowEnd(costs, start, budget) {
+  let rows = 0;
+  let end = start;
+  while (end < costs.length) {
+    if (end > start && rows + costs[end] > budget) break;
+    rows += costs[end];
+    end += 1;
+  }
+  return end;
+}
+
+// The furthest a window may start while still holding `index` inside `budget`
+// rows — `index` sits on the window's last row.
+function windowStartFor(costs, index, budget) {
+  let rows = costs[index];
+  let at = index;
+  while (at > 0 && rows + costs[at - 1] <= budget) {
+    rows += costs[at - 1];
+    at -= 1;
+  }
+  return at;
+}
+
+/**
+ * ONE continuous list window: no pages, only the rows that fit the body.
+ *
+ * The reader keeps its scroll position as the index of the first painted item
+ * (`start`), and this decides the window that paints `index` without leaving
+ * blank rows at the bottom while items remain above it (S3). The focused item
+ * is always inside the returned window: a selection below the window pushes it
+ * down until the focused row sits on its last row, and a selection above it
+ * pulls it back up.
+ *
+ * @param {number[]} rowCosts the screen rows each item needs, in list order.
+ * @param {{budget?: number, index?: number, start?: number}} [options] the body
+ *   row budget, the focused item and the wanted first item.
+ * @returns {{start: number, end: number, rows: number, above: boolean, below: boolean}}
+ *   the painted item range, the rows it spends and whether items remain on
+ *   either side of it.
+ */
+function scrollWindow(rowCosts, options = {}) {
+  const costs = toCosts(rowCosts);
+  const count = costs.length;
+  if (count === 0) return { start: 0, end: 0, rows: 0, above: false, below: false };
+  const budget = Math.max(1, Math.floor(num(options && options.budget)));
+  const index = clampIndex(options && options.index, count - 1);
+  const tailStart = windowStartFor(costs, count - 1, budget);
+  let start = clampIndex(options && options.start, count - 1);
+  // A window that stops short of the list's end shows its last full screen
+  // instead of trailing blank rows.
+  if (start > tailStart) start = tailStart;
+  if (index < start) {
+    start = index;
+  } else if (index >= windowEnd(costs, start, budget)) {
+    const wanted = windowStartFor(costs, index, budget);
+    // Prefer a full window at the bottom, but never at the cost of hiding the
+    // focused row: keep the focused window when the full one would drop it.
+    start = (wanted > tailStart && index < windowEnd(costs, tailStart, budget)) ? tailStart : wanted;
+  }
+  const end = windowEnd(costs, start, budget);
+  let rows = 0;
+  for (let at = start; at < end; at += 1) rows += costs[at];
+  return { start, end, rows, above: start > 0, below: end < count };
+}
+
+/**
+ * The window start `step` screenfuls away from `start`, for ←/→ scrolling.
+ *
+ * A forward step begins at the item just past the last visible one, a backward
+ * step returns to the screen above it, and a step that would run past either
+ * end clamps to the first or the last FULL window — so scrolling never parks on
+ * a half-empty screen (S3).
+ *
+ * @param {number[]} rowCosts the screen rows each item needs, in list order.
+ * @param {{budget?: number, start?: number, step?: number}} [options]
+ * @returns {number} the index of the first item to paint.
+ */
+function shiftWindow(rowCosts, options = {}) {
+  const costs = toCosts(rowCosts);
+  const count = costs.length;
+  if (count === 0) return 0;
+  const budget = Math.max(1, Math.floor(num(options && options.budget)));
+  const at = clampIndex(options && options.start, count - 1);
+  const step = Math.trunc(num(options && options.step));
+  if (step === 0) return at;
+  const tailStart = windowStartFor(costs, count - 1, budget);
+  if (step > 0) {
+    let cursor = at;
+    for (let moved = 0; moved < step; moved += 1) {
+      const end = windowEnd(costs, cursor, budget);
+      if (end >= count) return Math.min(cursor, tailStart);
+      cursor = end;
+    }
+    return Math.min(cursor, tailStart);
+  }
+  let cursor = at;
+  for (let moved = 0; moved < -step; moved += 1) {
+    if (cursor <= 0) return 0;
+    cursor = windowStartFor(costs, cursor - 1, budget);
+  }
+  return Math.max(0, cursor);
+}
+
+module.exports = {
+  CARD_PADDING,
+  DIVIDER,
+  PREVIEW_MIN,
+  LIST_MIN,
+  READER_LIST_SHARE,
+  innerWidth,
+  measure,
+  paneWidths,
+  wrapLabel,
+  rowCost,
+  paginate,
+  pageForIndex,
+  pageOf,
+  scrollWindow,
+  shiftWindow,
+};