@leftoff/cli 0.9.18-beta.11 → 0.9.18-beta.13

package/ui/prs.js

@@ -5,7 +5,7 @@ const esc = (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (c) => ({ '&':
 import { repoChips, labelRepos, repoMatches, chipSelected, orderSelectedFirst, PROJECT_KEY } from './repos.js'
 import { renderDoc } from './handoffs.js'
 import { COPY_IC, DONE_IC, COPIED_TIP, COPIED_MS, copyIconClick } from './copy-icon.js'
-const safeUrl = (u) => (/^https:\/\/github\.com\//.test(String(u || '')) ? String(u) : '')
+export const safeUrl = (u) => (/^https:\/\/github\.com\//.test(String(u || '')) ? String(u) : '')
 
 export function shortAgo(iso, now = Date.now()) {
   const t = Date.parse(iso || '')
@@ -93,24 +93,38 @@ export async function prCopyClick(btn, env = {}) {
 export function prMoreHtml(p, open = false) {
   return ' · <button type="button" class="pr-more pr-toggle" data-action="pr-expand" data-url="' + esc(p.url) + '" aria-expanded="' + !!open + '">' + (open ? 'Less' : 'More…') + '</button>'
 }
+// 2026-11-06 Walk me through this PR: the session's walkthrough opened on this PR's own range (src/walk-pr.js)
+export const WALK_IC = '<svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><circle cx="18" cy="18" r="3"/><circle cx="6" cy="6" r="3"/><path d="M13 6h3a2 2 0 0 1 2 2v7"/><path d="M11 18H8a2 2 0 0 1-2-2V9"/></svg>'
+export { GH_MARK }
+const OPEN_IC = '<svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/></svg>'
+export const prWalkScope = (p) => (p && p.repo && p.number ? 'pr:' + p.repo + '#' + p.number : null)
+// One Open button: a menu asking where (Walk me through it in Leftoff, or GitHub) when the PR has a walkthrough;
+// else the plain GitHub link. (Joel, 2026-11-06: four glyphs took the title's room.)
+export function prOpenHtml(p, walkId) {
+  const url = safeUrl(p.url), sc = walkId && prWalkScope(p), n = '#' + (p.number || '')
+  if (sc) return '<button type="button" class="pr-ic pr-open" data-action="pr-open" data-id="' + esc(walkId) + '" data-scope="' + esc(sc) + '" data-url="' + esc(url || '') + '" data-repo="' + esc(p.repo || '') + '" data-num="' + esc(p.number) + '" aria-haspopup="menu" data-tip="Open in Leftoff or on GitHub" aria-label="' + esc('Open ' + n + '…') + '">' + OPEN_IC + '</button>'
+  return url ? '<a class="pr-ic pr-gh" href="' + esc(url) + '" target="_blank" rel="noopener noreferrer" data-tip="Open on GitHub" aria-label="Open ' + esc(n) + ' on GitHub">' + GH_MARK + '</a>' : ''
+}
 // 2026-10-29 a compact row (closed): GitHub only; Copy link and Unlink come with the details
-export function prGhOnlyHtml(p) {
-  const url = safeUrl(p.url)
-  return url ? '<div class="pr-actions"><a class="pr-ic pr-gh" href="' + esc(url) + '" target="_blank" rel="noopener noreferrer" data-tip="Open on GitHub" aria-label="Open ' + esc('#' + (p.number || '')) + ' on GitHub">' + GH_MARK + '</a></div>' : ''
+// (2026-11-06 Open asks Leftoff or GitHub, when the row is a session's)
+export function prGhOnlyHtml(p, { walkId = null } = {}) {
+  const open = prOpenHtml(p, walkId)
+  return open ? '<div class="pr-actions">' + open + '</div>' : ''
 }
-export function prActionsHtml(p, { unlinkId = null } = {}) {
+export function prActionsHtml(p, { unlinkId = null, walkId = null } = {}) {
   const url = safeUrl(p.url), n = '#' + (p.number || '')
   if (!url && !unlinkId) return ''
   const copyLabel = 'Copy link to ' + n
   return '<div class="pr-actions">' +
     (url ? '<button type="button" class="pr-ic pr-copy" data-action="pr-copy" data-copy="' + esc(url) + '" data-tip="' + PR_COPY_TIP + '" data-label="' + esc(copyLabel) + '" aria-label="' + esc(copyLabel) + '">' + COPY_IC + DONE_IC + '</button>' : '') +
-    (url ? '<a class="pr-ic pr-gh" href="' + esc(url) + '" target="_blank" rel="noopener noreferrer" data-tip="Open on GitHub" aria-label="Open ' + esc(n) + ' on GitHub">' + GH_MARK + '</a>' : '') +
+    prOpenHtml(p, walkId) +
     (unlinkId ? '<button type="button" class="pr-ic pr-unlink" data-action="pr-unlink" data-id="' + esc(unlinkId) + '" data-url="' + esc(p.url) + '" data-tip="Unlink from this session" aria-label="Unlink ' + esc(n) + ' from this session">' + UNLINK + '</button>' : '') +
     '</div>'
 }
 
 // The session page: its PRs with Unlink, and "Link a PR" (a text box: a URL or #number).
 export function sessionPrsSection(s, { mayEdit = true, open = null, details = {} } = {}) {
+  const walkId = s && !s.agent ? s.id : null
   // 2026-10-29 + prsMore: closed PRs (a card leaves them out) and refs that couldn't be checked
   const more = (s.prsMore || []).filter((p) => p && p.number)
   const list = (s.prs || []).filter((p) => p && p.number).concat(more.filter((p) => !p.unchecked && p.url && !(s.prs || []).some((x) => x && x.url === p.url)))
@@ -122,11 +136,13 @@ export function sessionPrsSection(s, { mayEdit = true, open = null, details = {}
     // the repo, branch, checks and the details in place. Copy, GitHub and Unlink stay one tap away.
     h += '<div class="prlist pr-compact">' + list.map((p) => {
       const isOpen = !!(open && open.has && open.has(p.url))
-      return '<article class="prrow slim' + (isOpen ? ' open' : '') + '" data-pr="' + esc(p.url) + '"><div class="pr-main">' +
+      // how many glyphs sit at the right (the title line leaves them room when open)
+      const acts = isOpen ? (safeUrl(p.url) ? 1 : 0) + (safeUrl(p.url) || (prWalkScope(p) && walkId) ? 1 : 0) + (mayEdit ? 1 : 0) : 0
+      return '<article class="prrow slim' + (isOpen ? ' open pr-acts-' + acts : '') + '" data-pr="' + esc(p.url) + '"><div class="pr-main">' +
         '<div class="pr-c1">' + stateHtml(p.state) + '<span class="pr-num">#' + esc(p.number) + '</span>' +
         '<span class="pr-title"><button type="button" class="linkish pr-title-btn" data-tip="' + esc(p.title || 'Pull request #' + p.number) + '" data-action="pr-expand" data-url="' + esc(p.url) + '" aria-expanded="' + isOpen + '">' + esc(p.title || 'Pull request #' + p.number) + '</button></span></div>' +
-        (isOpen ? '<div class="pr-meta">' + esc(p.repo || '') + (p.branch ? ' · <span class="mono">' + esc(p.branch) + '</span>' : '') + (whyText(p) ? ' · <span class="pr-why">' + esc(whyText(p)) + '</span>' : '') + checksHtml(p.checks) + prMoreHtml(p, isOpen) + '</div>' + prDetailHtml(p, details && details[p.url], {}) : '') + '</div>' +
-        (isOpen ? prActionsHtml(p, { unlinkId: mayEdit ? s.id : null }) : prGhOnlyHtml(p)) + '</article>'
+        (isOpen ? '<div class="pr-meta">' + esc(p.repo || '') + (p.branch ? ' · <span class="mono">' + esc(p.branch) + '</span>' : '') + (whyText(p) ? ' · <span class="pr-why">' + esc(whyText(p)) + '</span>' : '') + (checksHtml(p.checks) ? ' · ' + checksHtml(p.checks) : '') + prMoreHtml(p, isOpen) + '</div>' + prDetailHtml(p, details && details[p.url], {}) : '') + '</div>' +
+        (isOpen ? prActionsHtml(p, { unlinkId: mayEdit ? s.id : null, walkId }) : prGhOnlyHtml(p, { walkId })) + '</article>'
     }).join('') + '</div>'
   }
   // several refs that couldn't be checked fold into one "+4 not checked" row
@@ -198,12 +214,14 @@ export function prRowHtml(r, { team = false, now = Date.now(), mayEdit = true, s
     : [p.repo, p.branch, when].filter(Boolean)
   const why = whyText(r)
   const unlinkTo = !team && mayEdit && (r.sessions || []).length === 1 ? r.sessions[0] : null
+  // 2026-11-06 Walk me through this PR: in its newest session's walkthrough (never a scripted run's)
+  const walkTo = !team ? (r.sessions || []).find((x) => x && x.id && !x.nonInteractive && x.archivedReason !== 'non_interactive' && !x.agent) : null
   return '<article class="prrow' + (open ? ' open' : '') + (pick ? ' pickable' : '') + (picked ? ' picked' : '') + '" data-pr="' + esc(p.url) + '">' + pick + '<div class="pr-main">' +
     '<div class="pr-line1">' + line1 + '</div>' +
     '<div class="pr-title">' + (url ? '<a href="' + esc(url) + '" target="_blank" rel="noopener noreferrer">' + esc(p.title || '') + '</a>' : esc(p.title || '')) + '</div>' +
     '<div class="pr-meta">' + meta.map(esc).join(' · ') + (why ? ' · <span class="pr-why">' + esc(why) + '</span>' : '') + prMoreHtml(p, open) + '</div>' +
     sessionLinks(r, { sessionAction, showMachine }) + (open ? prDetailHtml(p, detail, { now }) : '') + '</div>' +
-    prActionsHtml(p, { unlinkId: unlinkTo ? unlinkTo.id : null }) + '</article>'
+    prActionsHtml(p, { unlinkId: unlinkTo ? unlinkTo.id : null, walkId: walkTo ? walkTo.id : null }) + '</article>'
 }
 
 // ---------------------------------------------------------------- 0.8.5: details on tap

package/ui/pull.js

@@ -9,10 +9,24 @@ export const PULL_MAX = 110 // how far the spinner travels at most
 // sideways scrollers, and anything open on top of the page.
 export const PULL_SKIP = 'input, textarea, [contenteditable=""], [contenteditable="true"], .live-box, lo-select, lo-combo, .lo-menu, .lo-backdrop, .cmdk, .quicklook, .moremenu, .statuspop, .doc-viewer, .emoji-sheet-wrap, .relay-screen, .tabs, pre, .scroll-x, .fs-side, [data-no-pull]'
 
-// The phone layout on a touch screen, at the very top of the page, from a
-// place that isn't a field or an overlay, and with no overlay open.
+// 2026-11-06 ("it's really hard to do that when you're at the bottom of a long message chain, because
+// you have to scroll all the way to the top"): the bars at the top of the screen are a handle of their
+// own. A pull that starts on the top row, a session's head or the Live box's head refreshes wherever
+// the page or the chat is scrolled to. Fields, menus, sideways scrollers and the sheets still never
+// start one (PULL_HEAD_SKIP: PULL_SKIP without the Live box, whose head is one of the bars).
+export const PULL_HEAD = 'header.top, .s-head, .fs-head, .live-head, .live-fbar' // .live-fbar: full-screen Live's slim bar
+export const PULL_HEAD_SKIP = PULL_SKIP.split(', ').filter((x) => x !== '.live-box' && x !== 'pre').join(', ') + ', button.chip-x, [role="slider"]'
+export function onPullHead(target) {
+  if (!target || typeof target.closest !== 'function') return false
+  return !!target.closest(PULL_HEAD) && !target.closest(PULL_HEAD_SKIP)
+}
+
+// The phone layout on a touch screen, at the very top of the page (or on one of
+// the bars at the top, onPullHead), from a place that isn't a field or an
+// overlay, and with no overlay open.
 export function canStartPull({ coarse, narrow, scrollY, target, overlayOpen } = {}) {
   if (!coarse || !narrow || overlayOpen) return false
+  if (onPullHead(target)) return true
   if (scrollY > 0) return false
   if (target && typeof target.closest === 'function' && target.closest(PULL_SKIP)) return false
   if (scrolledAbove(target)) return false

package/ui/relay-client.js

@@ -364,7 +364,9 @@ class RelayEventSource extends EventTarget {
         if (this.readyState === 0) { this.readyState = 1; if (this.onopen) this.onopen(new Event('open')) }
         this.dispatchEvent(new MessageEvent('ping', { data: '{}' })) // a poll that answered is the stream's heartbeat
         const first = this.seq == null
+        const lost = !first && (j.reset || j.gap) // 2026-11-06: events this browser never got (the Mac restarted, another took over, or more happened than it keeps)
         this.seq = j.seq
+        if (lost) this.dispatchEvent(new MessageEvent('resync', { data: JSON.stringify({ reset: !!j.reset, gap: !!j.gap }) }))
         if (!first) for (const e of j.events || []) {
           const ev = new MessageEvent(e.event, { data: JSON.stringify(e.data) })
           this.dispatchEvent(ev)

package/ui/semdiff.js

@@ -371,11 +371,25 @@ function fileMapHtml(data, { esc, icon, cur }) {
   return h + '<div class="wt-fm-k"><span class="kbd">j</span><span class="kbd">k</span> next step</div></nav>'
 }
 
+// 2026-11-06 every PR the session has is its own range ('pr:<owner/repo>#<n>'): up to PR_CHIPS of them are
+// chips; more fold into one "PRs" chip that opens a menu (the one picked shows its number)
+export const PR_CHIPS = 2
+export const isPrKey = (k) => k === 'pr' || /^pr:/.test(String(k || ''))
+const PR_WORD = { merged: 'merged', closed: 'closed', draft: 'draft' }
+export function prScopeTip(x) { return [x.title, x.repo, x.state ? (x.state === 'open' ? 'Open' : x.state[0].toUpperCase() + x.state.slice(1)) : ''].filter(Boolean).join(' · ') }
 function scopesHtml(data, scope, { esc, icon, sid }) {
   const sc = (data && data.scopes) || [{ key: 'checkpoint', label: SCOPE_WORDS.checkpoint, available: false }, { key: 'session', label: SCOPE_WORDS.session, available: true }]
-  return '<div class="wt-seg" role="group" aria-label="What to walk through">' + sc.map((x) =>
-    '<button type="button" data-action="wt-scope" data-id="' + esc(sid) + '" data-scope="' + esc(x.key) + '" aria-pressed="' + (x.key === scope ? 'true' : 'false') + '"' + (x.available === false ? ' disabled data-tip="No checkpoint yet"' : '') + '>' +
-    (x.key === 'pr' ? icon('git-pull-request') : '') + '<span>' + esc(x.label) + '</span></button>').join('') + '</div>'
+  const prs = sc.filter((x) => isPrKey(x.key)), rest = sc.filter((x) => !isPrKey(x.key))
+  const chip = (x) => '<button type="button" data-action="wt-scope" data-id="' + esc(sid) + '" data-scope="' + esc(x.key) + '" aria-pressed="' + (x.key === scope ? 'true' : 'false') + '"' + (x.available === false ? ' disabled data-tip="No checkpoint yet"' : isPrKey(x.key) && prScopeTip(x) ? ' data-tip="' + esc(prScopeTip(x)) + '"' : '') + '>' +
+    (isPrKey(x.key) ? icon('git-pull-request') : '') + '<span>' + esc(x.label) + (PR_WORD[x.state] ? ' · ' + PR_WORD[x.state] : '') + '</span></button>'
+  let h = rest.map(chip).join('')
+  if (prs.length <= PR_CHIPS) h += prs.map(chip).join('')
+  else {
+    const cur = prs.find((x) => x.key === scope)
+    h += '<button type="button" data-action="wt-prs" data-id="' + esc(sid) + '" aria-pressed="' + (cur ? 'true' : 'false') + '" aria-haspopup="menu" aria-expanded="false" aria-label="' + esc(cur ? cur.label + ', pick another of ' + prs.length + ' PRs' : 'Pick one of ' + prs.length + ' PRs') + '"' + (cur && prScopeTip(cur) ? ' data-tip="' + esc(prScopeTip(cur)) + '"' : '') + '>' +
+      icon('git-pull-request') + '<span>' + esc(cur ? cur.label + (PR_WORD[cur.state] ? ' · ' + PR_WORD[cur.state] : '') : 'PRs · ' + prs.length) + '</span>' + icon('chevron-down', 'ic wt-seg-chev') + '</button>'
+  }
+  return '<div class="wt-seg" role="group" aria-label="What to walk through">' + h + '</div>'
 }
 
 // 2026-10-30 (asked: "the left side file list should be somewhat collapsible"): folded to a
@@ -464,7 +478,7 @@ export function walkthroughHtml({ s, data, ui, reviewed = new Set(), esc, icon,
   if (ui.loading) h += '<p class="wt-sum wt-loading" role="status"><span class="wt-spin" aria-hidden="true"></span><span>Reading the change' + (data && data.status === 'ok' ? '' : '…') + '</span><button type="button" class="linkish wt-stop" data-action="wt-stop" data-id="' + esc(sid) + '">Stop</button></p>'
   if (ui.error) h += '<p class="wt-note" role="alert">' + icon('circle-alert') + '<span>' + esc(ui.error) + '</span></p>'
   if (data && !ui.loading && data.status !== 'ok' && data.message) {
-    const msg = data.status === 'empty' && scope === 'session' ? 'No changes in this session yet.' : data.status === 'empty' && scope === 'pr' ? 'No changes in this PR yet.' : data.message
+    const msg = data.status === 'empty' && scope === 'session' ? 'No changes in this session yet.' : data.status === 'empty' && isPrKey(scope) ? 'No changes in this PR yet.' : data.message
     h += '<p class="wt-note">' + icon('info') + '<span>' + esc(msg) + (data.status === 'no_model' ? ' <a href="#/settings/summaries">Settings</a>' : '') + '</span></p>'
     h += unreadableHtml(data, { esc, icon }) // 2026-10-29 a repo that couldn't be read says so
     // a fallback says why (the first reason; the model's whole reply: leftoff walkthrough debug)
@@ -473,7 +487,7 @@ export function walkthroughHtml({ s, data, ui, reviewed = new Set(), esc, icon,
     if (data.status === 'fallback' && data.small) h += '<p class="faint wt-small">' + icon('info') + '<span>Small local models struggle here. Try Claude or qwen2.5-coder 7B in <a href="#/settings/models">Settings</a>.</span></p>'
   }
   // 2026-11-03 switched to the other scope with nothing written for it: never a model run on its own; Write it is one tap
-  if (data && !ui.loading && data.status === 'none' && view === 'story') h += '<p class="wt-stale" role="status"><i class="wt-chg-g" aria-hidden="true"></i><span>' + (data.fileScope && data.fileScope.key === 'folder' ? 'No walkthrough of the whole folder yet.' : 'No walkthrough of this session’s changes yet.') + ' The files are under Files.</span><button type="button" class="linkish wt-upd" data-action="wt-update" data-id="' + esc(sid) + '">' + icon('refresh-cw') + 'Write it</button></p>'
+  if (data && !ui.loading && data.status === 'none' && view === 'story') h += '<p class="wt-stale" role="status"><i class="wt-chg-g" aria-hidden="true"></i><span>' + (isPrKey(ui.scope) ? 'No walkthrough of this PR yet.' : data.fileScope && data.fileScope.key === 'folder' ? 'No walkthrough of the whole folder yet.' : 'No walkthrough of this session’s changes yet.') + ' The files are under Files.</span><button type="button" class="linkish wt-upd" data-action="wt-update" data-id="' + esc(sid) + '">' + icon('refresh-cw') + 'Write it</button></p>'
   const deck = ok && view === 'story' && ui.deck !== false && (data.steps || []).length > 0 // 0.9.18 the slideshow
   if (ok && view === 'story' && !deck) {
     const steps = data.steps || []
@@ -562,7 +576,7 @@ function deckHtml(data, ui, { esc, icon, reviewed, sid }) {
   let h = '<div class="wt-deck" id="wtDeck" data-cur="' + cur + '" data-n="' + total + '" tabindex="-1" aria-roledescription="slideshow" aria-label="Walkthrough slides">'
   // the overview
   const st = data.stats || {}
-  const scope = SCOPE_WORDS[ui.scope] || ''
+  const scope = SCOPE_WORDS[ui.scope] || (((data.scopes || []).find((x) => x.key === ui.scope) || {}).label) || ''
   const pm = Array.isArray(data.files) && data.files.length ? data.files.reduce((a, f) => ({ add: a.add + (f.add || 0), del: a.del + (f.del || 0) }), { add: 0, del: 0 }) : null
   let o = '<p class="wt-sum big"><b>' + esc(data.headline) + '</b></p>' + (data.summary ? '<p class="wt-sum md-in">' + walkInlineLinks(data.summary) + '</p>' : '')
   o += '<div class="wt-meta">' + (scope ? '<span>' + icon('git-compare') + esc(scope) + '</span>' : '') + '<span>' + plural(st.files || 0, 'file') + (pm ? ' <b class="wt-pl">+' + n0(pm.add) + '</b> <b class="wt-mi">−' + n0(pm.del) + '</b>' : '') + '</span><span>' + plural(steps.length, 'step') + '</span><span id="wtProg">' + steps.filter((x) => reviewed.has(x.id)).length + ' of ' + steps.length + ' reviewed</span></div>'

package/ui/subagents-view.js

@@ -0,0 +1,41 @@
+// 2026-11-06 subagents working, on the board (src/subagents.js reads them): the session's status says
+// "2 subagents working" instead of looking idle, and Live shows a line with what the newest one is
+// doing ("Bash: pnpm test"). Words and a shape (the spinner), never color alone.
+
+export function subCount(s) { const n = s && s.subagents ? Number(s.subagents.n) || 0 : 0; return n > 0 ? n : 0 }
+export function subLabel(sub) {
+  const n = sub ? Number(sub.n) || 0 : 0
+  return n > 0 ? n + (n === 1 ? ' subagent working' : ' subagents working') : ''
+}
+export function subStep(sub) {
+  const l = sub && sub.latest
+  if (!l) return ''
+  return String(l.tool ? l.tool + (l.detail ? ': ' + l.detail : '') : l.detail || '').replace(/\s+/g, ' ').trim().slice(0, 160)
+}
+const who = (a) => (a && (a.label || (a.type ? a.type + ' agent' : ''))) || 'a subagent'
+export function subTip(sub) {
+  const list = (sub && Array.isArray(sub.agents) ? sub.agents : []).map((a) => who(a) + (a && a.bg ? ' (background)' : ''))
+  const step = subStep(sub)
+  return (list.length ? list.join('\n') : subLabel(sub)) + (step ? '\nNow: ' + step : '')
+}
+// The status pill while subagents work (a session in a turn or with background work)
+export function subPillHtml(s, esc) {
+  const sub = s && s.subagents
+  const label = subLabel(sub)
+  if (!label) return ''
+  const tip = subTip(sub)
+  return '<span class="pill s-active sub-pill" tabindex="0" data-tip="' + esc(tip) + '" aria-label="' + esc(label + ': ' + tip.replace(/\n/g, ', ')) + '"><span class="sub-spin" aria-hidden="true"></span>' + esc(label) + '</span>'
+}
+// Live's line under the thread
+export function subStripHtml(sub, esc, { now = Date.now() } = {}) {
+  const label = subLabel(sub)
+  if (!label) return ''
+  const step = subStep(sub)
+  const at = sub.latest && sub.latest.at ? Number(sub.latest.at) : 0
+  const ago = at ? Math.max(0, Math.round((now - at) / 1000)) : null
+  const when = ago == null ? '' : ago < 5 ? 'just now' : ago < 90 ? ago + 's ago' : Math.round(ago / 60) + 'm ago'
+  return '<div class="lv-subs" role="status" data-tip="' + esc(subTip(sub)) + '"><span class="sub-spin" aria-hidden="true"></span><span class="lv-subs-what"><b>' + esc(label) + '</b>' +
+    (step ? '<span class="lv-subs-step">' + esc(step) + '</span>' : '') + '</span>' + (when ? '<span class="faint lv-subs-when">' + esc(when) + '</span>' : '') + '</div>'
+}
+// What Live's refetch compares, beside the thread's own signature
+export function subSig(sub) { return sub && sub.n > 0 ? sub.n + ':' + (sub.latest ? sub.latest.at + (sub.latest.tool || '') + (sub.latest.detail || '') : '') : '' }

package/ui/viewport-fit.js

@@ -22,13 +22,14 @@ export function isTypingTarget(el) {
 export const KEYBOARD_MIN_PX = 120 // less than this is the browser's own bars, not a keyboard
 
 // innerHeight: the layout viewport's height; vv: { height, offsetTop, scale }; typing: a text box has focus.
-// -> { h, top, kb } in CSS px (null without a visualViewport: the CSS falls back to 100dvh).
+// accessory: px a keyboard bar drawn over the page covers (keyboardAccessoryPx).
+// -> { h, top, kb, pad? } in CSS px (pad only when there's room to keep) (null without a visualViewport: the CSS falls back to 100dvh).
 // 2026-11-04 (switching keyboards mid-typing hid the composer): while a text box has focus, full
 // screen is exactly the visual viewport as iOS reports it right now, whatever the keyboard's height
 // (a keyboard swap reports a passing full-height or tiny keyboard on the way; following each report
 // means the next one puts it right). Nothing is remembered from when the box took focus. `kb` (the
 // keyboard's own look: no home-indicator gap) still needs a keyboard's worth of height.
-export function fullViewportFit({ innerHeight, vv, typing = false } = {}) {
+export function fullViewportFit({ innerHeight, vv, typing = false, accessory = 0 } = {}) {
   if (!vv || !(Number(innerHeight) > 0)) return null
   const ih = Number(innerHeight)
   const vh = Number(vv.height) > 0 ? Number(vv.height) : ih
@@ -37,15 +38,32 @@ export function fullViewportFit({ innerHeight, vv, typing = false } = {}) {
   if (!typing && !zoomed) return { h: Math.round(ih), top: 0, kb: false } // no keyboard: the whole window, from its top
   const room = Math.max(0, ih - vh) // a visual viewport as tall as the window can't be panned (a stale pan)
   const top = Math.min(Math.max(0, Number(vv.offsetTop) || 0), room)
-  return { h: Math.round(Math.min(vh, ih)), top: Math.round(top), kb }
+  // pad: room kept clear at the bottom for a keyboard bar drawn over the page (iOS 26's form bar), only with a keyboard up
+  const pad = kb ? Math.max(0, Math.round(Number(accessory) || 0)) : 0
+  const fit = { h: Math.round(Math.min(vh, ih)), top: Math.round(top), kb }
+  if (pad) fit.pad = pad
+  return fit
+}
+
+// 2026-11-06 (Joel, iPhone: "So close but not quite": the sheet stepped aside, but only the reply
+// box's top edge showed above the keyboard's ^ v ✓ bar). Since iOS 26 that bar floats over the
+// page (Liquid Glass: it and the band behind it show the page through), and the visual viewport iOS
+// reports runs down behind it, so a reply box placed at the reported bottom sits under the bar. No
+// browser number says how tall the bar is, so on an iPhone or iPad whose Safari is 26 or later
+// (glass: a CSS feature that arrived in Safari 26) full screen keeps this much clear at its bottom
+// while a keyboard is up. On older iOS the bar was outside the reported viewport: nothing kept.
+// Measured from the screenshot: the band from the bar's top edge to the keys is about 68px.
+export const ACCESSORY_PX = 64
+export function keyboardAccessoryPx({ ios = false, glass = false } = {}) {
+  return ios && glass ? ACCESSORY_PX : 0
 }
 
 // How far full screen's composer sits outside what you can see (the visual viewport, in the same
 // page coordinates as getBoundingClientRect): > 0 means move it up by that much, < 0 down, 0 it's in view.
 // rect: the composer's { top, bottom }; vv: { height, offsetTop }.
-export function outOfView(rect, vv, slack = 1) {
+export function outOfView(rect, vv, slack = 1, pad = 0) {
   if (!rect || !vv || !(Number(vv.height) > 0)) return 0
-  const top = Number(vv.offsetTop) || 0, bottom = top + Number(vv.height)
+  const top = Number(vv.offsetTop) || 0, bottom = top + Number(vv.height) - Math.max(0, Number(pad) || 0) // pad: covered by a keyboard bar
   if (rect.bottom > bottom + slack) return Math.round(Math.min(rect.bottom - bottom, rect.top - top)) // below the keyboard's edge (never past its own top)
   if (rect.top < top - slack) return -Math.round(top - rect.top) // above the top of what you can see
   return 0
@@ -57,6 +75,10 @@ export const SETTLE_AFTER_BLUR_MS = [0, 120, 350, 700, 1100]
 // The same beats after every report while a text box has focus: a keyboard swap's last change can
 // come with no event of its own, so the board looks again a few times after each one.
 export const SETTLE_WHILE_TYPING_MS = SETTLE_AFTER_BLUR_MS
+// And every frame for this long after the box takes focus and after each report: iOS animates the
+// keyboard (and pans) for ~0.3–0.5 s, part of it with no event, and its numbers settle a frame or
+// two after the event that announced them (WebKit bug 237851: offsetTop read 0 mid-animation).
+export const FOLLOW_FRAMES_MS = 1000
 
 // 2026-11-06 (the phone's session sheet covered the reply box while typing; "sometimes I have to
 // scroll that down, and then the message box appears"): the sheet went away only when the board