tosijs-ui 1.16.30 → 1.16.32

package/CHANGELOG.md

@@ -1,5 +1,158 @@
 # Changelog
 
+## 1.16.32
+
+Two new components, a doc search that ranks, and live examples whose toolbar no longer covers
+what they draw. Nothing an adopter has to change: the toolbar and the search are doc-site
+behaviour, and both components are new. One thing to know if you embed the doc browser in an
+app: it now opens its search on Cmd/Ctrl-K. If your page owns that key, pass
+`createDocBrowser({ searchShortcut: '' })` (or another key).
+
+`dist/iife.js` grows by about 7 KB gzip (496.4 KB to 503.4 KB, +1.4%): the palette is 9.1 KB
+gzip and the affix 5.0 KB. The ESM path pays only for what it imports.
+
+### New components
+
+- **`<tosi-palette>`** (`tosiPalette`): a command palette. A compact search-field trigger
+  opens a centred modal of ranked results. Results come from `sources` (sync, or async with a
+  spinner and a `timeout`, 10s by default; each keystroke aborts the last search), are drawn
+  per `kind` by `renderers` (or a default row: icon, highlighted title, one-line description,
+  path), ranked by `score` and grouped by `group` (or by your own `rank`), with `quickLinks`
+  before anything is typed. Arrow keys, Enter and Escape drive it, `shortcut: 'mod+k'` opens it
+  from anywhere (a shortcut with an unknown modifier is ignored, with a console warning, rather
+  than binding the bare key), `multiline` makes the query a growing prompt, and choosing fires `action`.
+  `trigger` is `field` (the default, which shrinks to its icon below `compactWidth`, 160px),
+  `icon`, or `none` for a palette opened only by `open()` or its shortcut. Its colours come
+  from the theme's root `--tosi-text` / `--tosi-bg` / `--tosi-accent`, so a recoloured header
+  does not make its results invisible. The dialog sets its own line height, wrapping and font
+  size, so a header's do not reach it. The palette footer's Close is a button, for a phone,
+  which has no Escape key; on a touch screen the arrow/Enter cues and the Esc hint are hidden.
+  The ✕ that clears the query is hidden until something is typed.
+- **`<tosi-affix>`** (`tosiAffix`): fixes a fixture (`slot="fixture"`) to an edge of its
+  content, in the FloatPosition vocabulary: the first letter is the edge, the second the
+  alignment, so `en` is the right edge, top-aligned. Outside (the default) it takes a grid cell
+  beside the content, so it never covers it and an ancestor's overflow cannot clip it; `inside`
+  puts it within the content against that edge. `fallback` (e.g. `"s inside"`) is used while
+  the fixture is longer than its edge. Setting `position`/`inside` sets where it is wanted,
+  reading them gives where it is, the `placed` attribute reflects it, and a `reposition` event
+  fires when it changes. It looks finished with no styling: a flex column on a side edge, a row
+  on top or bottom, the theme's inset background and spacing, outer corners rounded
+  (`--tosi-affix-bg/gap/padding/radius`, `::part(fixture)`).
+
+### Doc system
+
+- **Search ranks pages, in the header.** The sidebar's nav filter (a substring test that hid
+  pages and ranked nothing) is replaced by a palette in the header bar: the site's search
+  field while there is room, its icon when the header is narrow, and Cmd/Ctrl-K on every page,
+  `{"header": false}` pages included. Pages are ranked by rough relevance (title, then
+  headings, keywords, description, opening paragraph, body), and a matching heading becomes a
+  deep link. A query word matches only the start of a word, camelCase split ("date" finds
+  `tosiDate`, not "update"), a whole word or its plural outranks a prefix, and a word used
+  often counts for more than one used once. A word matched in one heading no longer counts for
+  the next query word. The trigger looks like the search field it replaced (the site's
+  pill-shaped input), and the active row is a tint of the theme's accent. The ranking is
+  exported as `buildDocIndex` / `searchDocs` from `tosijs-ui/doc-system/doc-search`, with
+  section anchors taken from the renderer's own heading ids. `createDocBrowser({ searchShortcut })` sets the key
+  that opens the search, `''` for none.
+- **A live example's toolbar sits beside the preview**, outside its outline, instead of a
+  pocket bar over the preview's top-right corner (which covered whatever the example drew
+  there, the crud example's New button for one). It moves inside along the bottom when the
+  column is taller than the preview, and when the example is maximized. The run-tests check
+  shows the test status; the owl handle is gone.
+- Below 600px of header the link icons fold into the settings (⋮) menu, so an upright phone
+  has room for the title and the search.
+
+### Fixed
+
+- `<tosi-crud>` has a Close button (and `close()`) that returns to the list. Under 720px (the
+  doc preview included) an open record replaces the list instead of squeezing into a 210px
+  column beside it, and the component fills a container with a height. A store that can only
+  list no longer shows New, Save and Delete where the page styles `button` with a `display`.
+  Without a schema, New starts from the fields the listed rows have instead of an empty form.
+- Boolean columns from a schema asked for icons named "✓" and "✗", which do not exist; they
+  use `check` and `x`.
+- `<tosi-table>` with no `columns` and data that arrived later showed no columns: it now
+  infers them once there is a row.
+- `<tosi-schema-form>` with no schema kept the schema inferred from an empty value forever, and
+  threw "unobserve failed, listener not found" every time it left the page.
+
+### Dependencies
+
+- The optional `happy-dom` peer is now `^21.0.4` (was `^20.7.0`), and tosijs-ui's own tests
+  run on 21.0.4. Every happy-dom from 17.0.0 to 21.0.3 is affected by
+  [GHSA-834v-8h66-3h79](https://github.com/advisories/GHSA-834v-8h66-3h79) (an unsanitized
+  import alias leads to host code execution), and there is no fixed 20.x. It matters only if
+  you use `tosijs-ui/test-setup` or build ePubs; then upgrade to 21.0.4. Its one breaking
+  change is that CSS and iframe loading are off by default, which neither relies on.
+
+### Tunnel
+
+- A workspace no longer makes a request wait on the box for the revoked-device list. A
+  copy up to ten minutes old is used at once and refreshed behind, and when the list becomes
+  unreadable the dev server says so, and why. `tosijs-tunnel` refuses flag combinations it
+  used to ignore silently: `--share-ttl` with `--global` or without `--link --share`, and
+  `--label` anywhere but on a `--link --global` edit link.
+
+## 1.16.31
+
+**Tunnel users: each browser needs one new `tosijs-tunnel --link --global`.** The edit cookie
+from earlier versions held the box's edit key itself, and it no longer opens a workspace (see
+below). Reinstall the box's Caddyfile (`tosijs-caddy-install --go`) to drop `?t=<edit key>`.
+
+**If you used `--global` edit links or `?t=<edit key>` on 1.16.26–1.16.30, rotate the edit
+key.** Those versions put its raw value in browser cookies (for 30 days) and URLs (so browser
+history and anywhere one was pasted), and in 1.16.31 that same value signs every device pass:
+anyone holding a copy could sign passes of their own that `--revoke` cannot see. Set a new
+`PREVIEW_EDIT_TOKEN` in `/etc/caddy/preview.env` on the box and in
+`~/local-secrets/tosijs-preview.env` on each machine, re-run `tosijs-caddy-install --go`, and
+restart the dev servers. Upgrade every project that tunnels through the same box first: a new
+edit link expires the old `tosi_edit` cookie, so a workspace still on tosijs-ui 1.16.30 or
+earlier then opens read-only in that browser.
+
+### Tunnel
+
+- **Each device gets its own edit pass, and you can revoke one.** A `--link --global` edit link
+  used to give the browser the box's edit key as its cookie, so every device held the same
+  credential, and the only way to cut one off was to rotate the key everywhere. Now the link
+  gives that browser a pass for that one device, signed with the edit key, which no longer
+  reaches a browser. `tosijs-tunnel --devices` lists every pass issued, `--revoke=<id>` cuts one device
+  off, and `--label=<name>` names the device a link is for. Revoking ends
+  edit access; the device keeps the shared view key, so it can still browse until you rotate
+  that. Every workspace checks the box's
+  revoked list before it honours a pass, at most a minute old, and ends a revoked device's open
+  sessions within that minute. A workspace that cannot read the list honours no pass at all.
+  An edit link also sets the view key, which opens the box's root list and the static previews.
+- **A link that hands over a key lives five minutes.** The view `--global` link lasted a day;
+  now both kinds expire after five minutes, single use. The cookie it sets is what lasts (30
+  days), not the code that delivers it. `tunnel.linkTtlMinutes` can shorten the window, never
+  lengthen it, and `--share-ttl` no longer applies to these links; to give someone view access
+  later, send a plain `--link --share`.
+- **The edit key has no URL form.** The box no longer accepts `?t=<edit key>`, which made the
+  key a permanent bearer token in browser history and anywhere the URL was pasted. The view key
+  still works that way for the static previews.
+- **The box's workspace list opens each link in a new tab**, so the list stays open as the
+  place you pick the next one.
+
+### Notifications
+
+- **A long message can no longer push the close button out of the notification.** The message
+  column cannot grow past the note, an unbroken string wraps anywhere, and a message is cut off
+  with an ellipsis after four lines (`--notification-max-lines`); the full text is the tooltip,
+  and screen readers get all of it.
+- **Many notifications stack instead of scrolling.** The newest `TosiNotification.maxVisible`
+  (3) stay in view, newest on top; the lowest of them fronts a stack, with older notifications
+  behind it, each one's lower edge showing by `TosiNotification.stackOffsets` (`[16, 8, 4]` px),
+  and the rest hidden until the ones in front close. Stacked notifications show their lower
+  edges straight below the front card, with no sideways offset.
+- **Dismiss all.** A button whenever more than one notification is open, which sits centred
+  over those edges at the bottom, outlined in the colour of the most severe one open (hidden ones included), and
+  `TosiNotification.dismissAll()`. Both fire each notification's `close` callback, as if the
+  user had closed it.
+- **Smoother movement.** A closing notification fades where it is, then the rest move once,
+  straight to their new places; restacking used to slide cards in from wherever their last
+  offset left them. (A pre-release bug is fixed too: notes just pushed into the stack were
+  measured while still in the flow, so the stack sat one card too high.)
+
 ## 1.16.30
 
 ### Tunnel

package/bin/resolve-site-config.ts

@@ -158,7 +158,61 @@ export {
 server reads the global tunnel keys from the same file; it is re-exported here for the bins.
 */
 export { readLocalSecret } from '../dist/doc-system/site/local-secrets.js'
-export { resolveGlobalKeys } from '../dist/doc-system/site/dev-auth.js'
+export {
+  resolveGlobalKeys,
+  DEVICE_ID_PATTERN,
+} from '../dist/doc-system/site/dev-auth.js'
+import {
+  DEVICE_ID_PATTERN,
+  cleanDeviceLabel,
+} from '../dist/doc-system/site/dev-auth.js'
+
+/*
+The box's device registry (board #3416): one tab-separated line per edit pass issued, written
+by `tosijs-tunnel` over ssh as `printf '%s\n' '<line>'`. So a line may hold no quote, tab or
+newline of its own: every field is checked or cleaned here, and a line that cannot be made safe
+is not written.
+*/
+export const DEVICE_LISTING_SEPARATOR = '--revoked--'
+
+export function deviceRegistryLine(device: {
+  id: string
+  issued: Date
+  project: string
+  label: string
+}): string | null {
+  if (!DEVICE_ID_PATTERN.test(device.id)) return null
+  const project = device.project.replace(/[^\w.-]/g, '').slice(0, 60)
+  return [
+    device.id,
+    device.issued.toISOString(),
+    project,
+    cleanDeviceLabel(device.label),
+  ].join('\t')
+}
+
+export interface DeviceRecord {
+  id: string
+  issued: string
+  project: string
+  label: string
+  revoked: boolean
+}
+
+/** `cat registry.tsv; echo --revoked--; cat revoked.txt` → one record per device, newest first. */
+export function parseDeviceListing(text: string): DeviceRecord[] {
+  const [registry = '', revokedText = ''] = text.split(
+    `${DEVICE_LISTING_SEPARATOR}\n`
+  )
+  const revoked = new Set(revokedText.split('\n').map((line) => line.trim()))
+  const devices: DeviceRecord[] = []
+  for (const line of registry.split('\n')) {
+    const [id = '', issued = '', project = '', label = ''] = line.split('\t')
+    if (!DEVICE_ID_PATTERN.test(id)) continue
+    devices.push({ id, issued, project, label, revoked: revoked.has(id) })
+  }
+  return devices.reverse()
+}
 import type { GlobalKeys } from '../dist/doc-system/site/dev-auth.js'
 import { readLocalSecret } from '../dist/doc-system/site/local-secrets.js'
 
@@ -368,6 +422,35 @@ export interface Argv {
   rest: string[]
 }
 
+/**
+ * `tosijs-tunnel` flag combinations that would otherwise be silently ignored, each with what to
+ * do instead (1.16.31 review). A flag that changes nothing is a promise the bin does not keep.
+ */
+export function tunnelFlagProblems(args: {
+  has: (name: string) => boolean
+  flag: (name: string) => string | undefined
+}): string[] {
+  const problems: string[] = []
+  const link = args.has('link')
+  const share = args.has('share')
+  const global = args.has('global')
+  if (args.flag('share-ttl') !== undefined) {
+    if (global)
+      problems.push(
+        '--share-ttl does not apply to --global links: they always expire after 5 minutes. For a longer-lived view link, use --link --share --share-ttl=… without --global.'
+      )
+    else if (!(link && share))
+      problems.push('--share-ttl only applies to --link --share.')
+  }
+  if (args.flag('label') !== undefined) {
+    if (!(link && global) || share)
+      problems.push(
+        '--label names the device a --link --global EDIT link is for; it does nothing elsewhere.'
+      )
+  }
+  return problems
+}
+
 /**
  * Parse `argv` against `spec`. Prints usage and exits on `--help` (0) or on an
  * unrecognised flag (1); returns a reader otherwise.

package/bin/tunnel.ts

@@ -44,26 +44,53 @@ import {
   resolveSiteConfig,
   resolveTunnelLocalPort,
   parseArgv,
+  deviceRegistryLine,
+  parseDeviceListing,
+  DEVICE_LISTING_SEPARATOR,
+  DEVICE_ID_PATTERN,
+  tunnelFlagProblems,
 } from './resolve-site-config.ts'
 
 const { has, flag } = parseArgv(process.argv.slice(2), {
   bin: 'tosijs-tunnel',
   summary: 'expose the local dev server through the preview host',
-  flags: ['close', 'link', 'status', 'share', 'global'],
-  values: ['host', 'port', 'local-port', 'remote-port', 'url', 'share-ttl'],
+  flags: ['close', 'link', 'status', 'share', 'global', 'devices'],
+  values: [
+    'host',
+    'port',
+    'local-port',
+    'remote-port',
+    'url',
+    'share-ttl',
+    'label',
+    'revoke',
+  ],
   usage:
     `  tosijs-tunnel                        open the tunnel (foreground)\n` +
     `  --status                             report whether a tunnel is up\n` +
     `  --close                              close a running tunnel\n` +
     `  --link                               print a magic edit link\n` +
     `  --link --share                       print a READ-ONLY link to send to a person\n` +
-    `  --link --global [--share]            a SINGLE-USE link that also gives that browser the\n` +
-    `                                       box's key for 30 days (every workspace, the root list)\n` +
-    `  --share-ttl=<minutes>                how long that share link lives (default 1440)\n` +
+    `  --link --global [--share]            a SINGLE-USE 5-minute link that also keeps that\n` +
+    `                                       browser in every workspace and the root list for\n` +
+    `                                       30 days (edit: a revocable device pass)\n` +
+    `  --label=<name>                       name the device a --global edit link is for\n` +
+    `  --devices                            list the devices given an edit pass, and which are revoked\n` +
+    `  --revoke=<device id>                 revoke one device's edit pass, on every workspace\n` +
+    `  --share-ttl=<minutes>                how long a plain share link lives (default 1440)\n` +
     `  --host=user@box                      override the configured preview host\n` +
     `  --port= --local-port= --remote-port= override the resolved ports`,
 })
 
+{
+  const problems = tunnelFlagProblems({ has, flag })
+  if (problems.length) {
+    for (const problem of problems) console.error(`\n${problem}`)
+    console.error('')
+    process.exit(1)
+  }
+}
+
 const siteConfig = await resolveSiteConfig()
 
 const preview = siteConfig.preview
@@ -122,7 +149,7 @@ let routed = true
 /** Ask the dev server (loopback only) for a link; `query` selects the kind. */
 async function askForLink(
   query: string
-): Promise<{ url?: string; error?: string }> {
+): Promise<{ url?: string; device?: string; error?: string }> {
   const res =
     await $`curl -sk --max-time 5 https://localhost:${localPort}/__devlink${query}`
       .nothrow()
@@ -142,8 +169,7 @@ carries a one-use code, never the key. Offered only for keys this workspace acce
 holds too; `notes` says why any other is missing.
 */
 async function globalLinks(
-  kinds: ('edit' | 'view')[] = ['edit', 'view'],
-  extraQuery = ''
+  kinds: ('edit' | 'view')[] = ['edit', 'view']
 ): Promise<{
   links: { kind: 'edit' | 'view'; url: string }[]
   notes: string[]
@@ -159,9 +185,27 @@ async function globalLinks(
   const plan = planGlobalLinks(local, box)
   const links: { kind: 'edit' | 'view'; url: string }[] = []
   for (const kind of plan.kinds.filter((k) => kinds.includes(k))) {
+    const label = flag('label')
     const answer = await askForLink(
-      `?global=${kind}&domain=${encodeURIComponent(plan.domain!)}${extraQuery}`
+      `?global=${kind}&domain=${encodeURIComponent(plan.domain!)}${
+        label ? `&label=${encodeURIComponent(label)}` : ''
+      }`
     )
+    if (answer.url && answer.device) {
+      // Recorded before the link is shown, so every pass in a browser is on the box's list.
+      const recorded = await registerDevice({
+        id: answer.device,
+        project: projectName,
+        // The links printed at start are recorded too, used or not; say which they were.
+        label: label ?? (has('link') ? '' : 'printed at tunnel start'),
+      })
+      if (!recorded) {
+        plan.notes.push(
+          `could not record device ${answer.device} on ${host}, so no ${kind} link: it could not be listed or revoked`
+        )
+        continue
+      }
+    }
     if (answer.url) links.push({ kind, url: answer.url })
     else
       plan.notes.push(
@@ -173,6 +217,33 @@ async function globalLinks(
 }
 let startLinks: Awaited<ReturnType<typeof globalLinks>> | undefined
 
+/*
+DEVICES (board #3416). Each --global edit link is a pass for one device. The box keeps the
+record: `_devices/registry.tsv` (not served) lists every pass issued, and `_index/revoked.txt`
+(served beside the root list, behind its cookie gate) is what every workspace reads before it
+honours a pass. Both live under the preview root, written over the same ssh as the rest.
+*/
+const devicesRoot = () =>
+  previewRootFor(
+    preview?.path ?? '/srv/preview/placeholder',
+    preview?.caddySitesDir
+  )
+
+async function registerDevice(device: {
+  id: string
+  project: string
+  label: string
+}): Promise<boolean> {
+  const line = deviceRegistryLine({ ...device, issued: new Date() })
+  if (!line) return false
+  const root = devicesRoot()
+  const run =
+    await $`ssh -o BatchMode=yes -o ConnectTimeout=10 ${host!} ${`mkdir -p ${root}/_devices && printf '%s\\n' '${line}' >> ${root}/_devices/registry.tsv`}`
+      .nothrow()
+      .quiet()
+  return run.exitCode === 0
+}
+
 /*
 Say where this is going, and where the address came from, BEFORE acting on it.
 
@@ -218,6 +289,67 @@ async function running(): Promise<number[]> {
   return out.trim().split('\n').filter(Boolean).map(Number)
 }
 
+if (has('devices')) {
+  const root = devicesRoot()
+  const read =
+    await $`ssh -o BatchMode=yes -o ConnectTimeout=10 ${host!} ${`cat ${root}/_devices/registry.tsv 2>/dev/null; echo ${DEVICE_LISTING_SEPARATOR}; cat ${root}/_index/revoked.txt 2>/dev/null; true`}`
+      .nothrow()
+      .quiet()
+  if (read.exitCode !== 0) {
+    console.error(
+      `\nCould not read the device list on ${host}: ${read.stderr
+        .toString()
+        .trim()}\n`
+    )
+    process.exit(1)
+  }
+  const devices = parseDeviceListing(read.stdout.toString())
+  if (!devices.length) {
+    console.log(
+      '\nNo edit passes issued yet (`tosijs-tunnel --link --global`).\n'
+    )
+  } else {
+    console.log('')
+    for (const d of devices)
+      console.log(
+        `  ${d.id}  ${d.revoked ? 'REVOKED' : 'active '}  ${d.issued}  ${
+          d.project
+        }${d.label ? `  "${d.label}"` : ''}`
+      )
+    console.log(
+      `\n  Revoke one with \`tosijs-tunnel --revoke=<id>\`. A pass also expires 30 days after it was issued.\n`
+    )
+  }
+  process.exit(0)
+}
+
+if (flag('revoke') !== undefined) {
+  const id = flag('revoke')!
+  if (!DEVICE_ID_PATTERN.test(id)) {
+    console.error(
+      `\n${JSON.stringify(
+        id
+      )} is not a device id (ten letters and digits; see --devices).\n`
+    )
+    process.exit(1)
+  }
+  const root = devicesRoot()
+  const run =
+    await $`ssh -o BatchMode=yes -o ConnectTimeout=10 ${host!} ${`mkdir -p ${root}/_index && printf '%s\\n' ${id} >> ${root}/_index/revoked.txt && chmod 644 ${root}/_index/revoked.txt`}`
+      .nothrow()
+      .quiet()
+  if (run.exitCode !== 0) {
+    console.error(
+      `\nCould not revoke ${id} on ${host}: ${run.stderr.toString().trim()}\n`
+    )
+    process.exit(1)
+  }
+  console.log(
+    `\n🔒 ${id} revoked. Every workspace stops honouring its edit pass, and ends its edit sessions, within a minute. It keeps the shared view key until you rotate that.\n`
+  )
+  process.exit(0)
+}
+
 if (has('link')) {
   /*
   Ask the dev server over loopback. The previous version ran
@@ -238,15 +370,16 @@ if (has('link')) {
   const shareTtl = flag('share-ttl')
   const ttl = shareTtl ? `&ttl=${encodeURIComponent(shareTtl)}` : ''
   /*
-  `--global` asks for a link that also hands over the box's key (see globalLinks): single-use,
-  and the browser keeps every workspace for 30 days. Opt-in, because it is a different promise
+  `--global` asks for a link that also hands over a global credential (see globalLinks): single-use,
+  valid five minutes whatever `--share-ttl` says, and the browser keeps every workspace for 30
+  days. Opt-in, because it is a different promise
   from the two links above, which are reusable for their window and open this workspace only.
   A share link spent by a chat app's link preview, or one that opens every workspace, would
   break the promise `--share` makes to the person you send it to.
   */
   let url: string
   if (has('global')) {
-    const global = await globalLinks([share ? 'view' : 'edit'], ttl)
+    const global = await globalLinks([share ? 'view' : 'edit'])
     for (const note of global.notes) console.log(`note: ${note}`)
     url = global.links[0]?.url ?? ''
     if (!url) {

package/deploy/Caddyfile

@@ -75,25 +75,17 @@
 		redir * {tosi_link_target} 302
 	}
 
-	# THE GLOBAL EDIT KEY: `?t=<edit key>` on any preview host sets `tosi_edit` across the
-	# whole preview domain for 30 days, the same cookie a workspace's single-use link from
-	# `tosijs-tunnel` sets (that link is the usual way in: it never puts the key in a URL).
-	# Every tunnelled workspace that holds the same key
-	# (PREVIEW_EDIT_TOKEN in ~/local-secrets/tosijs-preview.env on the machine running it)
-	# trades it for an editing session on the first page load, so the root's list opens them
-	# all, across dev-server restarts. It also opens these static previews. The view key above
-	# opens workspaces read-only the same way. See `globalKeys` in doc-site-system.md.
+	# THE GLOBAL EDIT KEY has NO URL form, and no browser holds it. A browser that opens a
+	# workspace's single-use link (`tosijs-tunnel --link --global`, a one-use code valid five
+	# minutes) gets a signed pass for that one device, plus the view key below; the cookie lasts
+	# 30 days, the code that delivers it does not (the maintainer's rule, 2026-10-20). Through
+	# 1.16.30 `?t=<edit key>` here set the raw key as a cookie, a permanent bearer token for
+	# writing source on every workspace that no one device could lose on its own.
 	#
-	# The cookie is the key itself: Caddy can compare a fixed value and cannot sign one. A
-	# leaked edit cookie is write access to every workspace that accepts the key until it is
-	# rotated (edit preview.env here and on each machine, re-run the installer).
-	@editlink query t=__PREVIEW_EDIT_TOKEN__
-	handle @editlink {
-		header Set-Cookie "tosi_edit=__PREVIEW_EDIT_TOKEN__; Domain=.{{PREVIEW_DOMAIN}}; Path=/; Max-Age=2592000; HttpOnly; Secure; SameSite=Lax"
-		header Referrer-Policy "no-referrer"
-		header Cache-Control "no-store"
-		redir * {tosi_link_target} 302
-	}
+	# The gate below still accepts the raw edit key: the dev servers present it to read
+	# `revoked.txt` (the root's revoked-device list, which `tosijs-tunnel --revoke` appends to).
+	# Rotating it (edit preview.env here and on each machine, re-run the installer) invalidates
+	# every device pass at once.
 
 	# Anchored at both ends: unanchored, `tosi_edit=<key>x` matched too. That needed the key
 	# anyway, but the dev servers compare exactly, and the gate should agree with them.

package/deploy/build-index.sh

@@ -27,6 +27,9 @@ html() { printf '%s' "$1" | sed -e 's/&/\&amp;/g' -e 's/</\&lt;/g' -e 's/>/\&gt;
 OUT="$ROOT/_index"
 mkdir -p "$OUT"
 
+# Every link opens in its own tab, so this page stays open as the place you pick the next one.
+# target=_blank implies noopener, so a workspace gets no handle on this page.
+
 # Collect deployed projects. A directory only counts if it has a version.json — a
 # half-finished rsync or a stray folder should not appear as a live preview.
 rows=""
@@ -64,7 +67,7 @@ for dir in "$ROOT"/*/; do
 	count=$((count + 1))
 	rows="$rows
 	<li>
-		<a href=\"//$host\">
+		<a href=\"//$host\" target=\"_blank\">
 			<span class=\"name\">$site</span>
 			<span class=\"meta\">
 				<code>${commit:-unknown}</code>
@@ -87,7 +90,7 @@ for frag in "$ROOT"/_sites/*-tunnel.caddy; do
 	[ -n "$host" ] || continue
 	live="$live
 	<li data-workspace=\"$host\">
-		<a href=\"https://$host/\">
+		<a href=\"https://$host/\" target=\"_blank\">
 			<span class=\"name\">$name</span>
 			<span class=\"meta\"><span class=\"access\">checking…</span><code>$host</code></span>
 		</a>

package/dist/affix.d.ts

@@ -0,0 +1,97 @@
+import { Component, ElementCreator, PartsMap } from 'tosijs';
+export type AffixPosition = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw' | 'en' | 'wn' | 'es' | 'ws';
+export interface AffixPlacement {
+    position: AffixPosition;
+    inside: boolean;
+}
+/** `position` as written, or the default when it is not one. */
+export declare function affixPosition(value: unknown): AffixPosition;
+/** `"s inside"` → `{position: 's', inside: true}`; '' → null (no fallback). */
+export declare function parsePlacement(value: unknown): AffixPlacement | null;
+/** `{position: 's', inside: true}` → `"s inside"`. */
+export declare const describePlacement: ({ position, inside }: AffixPlacement) => string;
+type Track = 1 | 2 | 3;
+type Align = 'start' | 'center' | 'end';
+/**
+ * The grid cell and alignment for a placement. Outside, the fixture takes the cell on its
+ * edge, hugging the content; inside, it shares the content's cell, against that edge.
+ */
+export declare function affixCell({ position, inside }: AffixPlacement): {
+    row: Track;
+    column: Track;
+    alignSelf: Align;
+    justifySelf: Align;
+    direction: string;
+    edge: "n" | "s" | "e" | "w";
+};
+interface AffixParts extends PartsMap {
+    content: HTMLSlotElement;
+    fixture: HTMLSlotElement;
+}
+export declare class TosiAffix extends Component<AffixParts> {
+    static initAttributes: Record<string, unknown>;
+    /** Where the fixture goes when the wanted place does not fit: `"s inside"`, or '' for nowhere. */
+    fallback: string;
+    static preferredTagName: string;
+    static shadowStyleSpec: {
+        ':host': {
+            display: string;
+            gridTemplateColumns: string;
+            gridTemplateRows: string;
+            '--tosi-affix-direction': string;
+        };
+        ':host([hidden])': {
+            display: string;
+        };
+        ':host > [part="content"]': {
+            display: string;
+            gridArea: string;
+            minWidth: string;
+            minHeight: string;
+            position: string;
+        };
+        ':host > [part="fixture"]': {
+            display: string;
+            flexDirection: string;
+            alignItems: string;
+            zIndex: string;
+            gap: string;
+            padding: string;
+            background: string;
+            color: string;
+        };
+        ':host > [part="fixture"][hidden]': {
+            display: string;
+        };
+    };
+    content: () => HTMLSlotElement[];
+    private _wanted;
+    private _placed;
+    private _wantedLength;
+    private _observer;
+    /** Where the fixture is (set: where it should be). */
+    get position(): AffixPosition;
+    set position(value: string);
+    /** Whether the fixture is inside the content (set: whether it should be). */
+    get inside(): boolean;
+    set inside(value: boolean | string);
+    /** Where the fixture should be, whatever fits. */
+    get wanted(): AffixPlacement;
+    /** An empty fixture slot is hidden, so it takes no room and draws no background. */
+    private syncEmpty;
+    handleSlotChange: () => void;
+    connectedCallback(): void;
+    private _observed;
+    observeContent: () => void;
+    disconnectedCallback(): void;
+    /** The fixture's and the content's lengths along `edge`, as laid out now. */
+    private lengths;
+    /** Choose where the fixture goes, lay it out there, and announce a change. */
+    place: () => void;
+    /** Lay the fixture out at `placement`, and announce it if that is a change. */
+    private layout;
+    private apply;
+    render(): void;
+}
+export declare const tosiAffix: ElementCreator<TosiAffix>;
+export {};