@michaelthielemann/kestrel 1.7.0 → 2.0.0

package/layers/admin/app/utils/editor-expose.ts

@@ -23,4 +23,12 @@ export interface EditorExpose {
   live: PublishStatusData | null
   /** The record's own title (see `recordTitle`), or `''` — the header then shows "Edit {collection} #{id}". */
   recordTitle: string
+  /** Save, then write the static output (ADR-0008) — a draft is promoted to published on the way. */
+  publish: () => Promise<void>
+  publishing: boolean
+  /** False when `output.publishOnSave` is on — a save republishes, so the hosts hide the Publish button. */
+  canPublish: boolean
+  /** Open the record in a new tab: the saved URL, or the unsaved state carried by a preview ticket. */
+  openPreview: () => Promise<void>
+  previewOpening: boolean
 }

package/layers/core/modules/auto-discovery/extract-block.ts

@@ -100,7 +100,9 @@ function evalObjectExpr(content: string, node: Node, scope: Record<string, unkno
   const src = content.slice(node.start, node.end)
   const names = Object.keys(scope)
   try {
-    // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func
+    // `src` is a slice of the CONSUMER's own block-SFC source, evaluated once here at build/discovery time
+    // to recover the object literal's runtime shape — never attacker- or request-supplied, so this is not
+    // an eval-injection surface.
     const fn = new Function(...names, `return (${src})`)
     const out = fn(...names.map((k) => scope[k]))
     if (!out || typeof out !== 'object') throw new Error('expected an object literal')
@@ -109,6 +111,7 @@ function evalObjectExpr(content: string, node: Node, scope: Record<string, unkno
     throw new Error(
       `${where}: could not evaluate the block declaration. Field/block args must be self-contained literals + ` +
         `field-factory calls (no imported constants, computed values, or TS type-args). Cause: ${(e as Error).message}`,
+      { cause: e },
     )
   }
 }
@@ -126,7 +129,7 @@ export function extractBlockDef(sfcSource: string, fileBase: string): ExtractedB
   try {
     ast = parse(content, { sourceType: 'module', plugins: ['typescript'] })
   } catch (e) {
-    throw new Error(`${fileBase}: could not parse <script setup> — ${(e as Error).message}`)
+    throw new Error(`${fileBase}: could not parse <script setup> — ${(e as Error).message}`, { cause: e })
   }
 
   const props = macroCall(ast, 'defineProps')

package/layers/core/modules/kestrel/index.ts

@@ -74,6 +74,7 @@ export default defineNuxtModule<KestrelConfig>({
       dir: c.output.dir,
       publicDir: c.output.publicDir,
       auto: c.output.auto,
+      publishOnSave: c.output.publishOnSave,
       reconcileMinutes: c.output.reconcileMinutes,
       verbose: c.output.verbose,
       s3: {

package/layers/core/server/schema/introspect.ts

@@ -1,4 +1,4 @@
-import type { ColumnShape, IndexShape, TableShape, SchemaSnapshot } from './model'
+import type { ColumnShape, IndexShape, SchemaSnapshot } from './model'
 
 // Read the *actual* schema of a live SQLite database into the normalized model, so `diffSchema` can
 // compare it against the desired schema (ADR-0002). Typed structurally (prepare + pragma) to keep the

package/layers/core/server/schema/sync.ts

@@ -1,4 +1,4 @@
-import { type IntrospectDb } from './introspect'
+import type { IntrospectDb } from './introspect'
 import { diffSchema } from './diff'
 import { sqlite, type Dialect } from './dialect'
 import type { SchemaSnapshot, SchemaOp } from './model'

package/layers/core/server/utils/crud.ts

@@ -465,10 +465,11 @@ export function removeMany(db: DB, c: BuiltCollection, ids: number[]): { count:
 }
 
 /**
- * Publish / unpublish a batch of rows by persisting their `status` — NOT a separate publish path. Writing
- * `status` and emitting the SAME write event the editor save emits IS the publish: classifyWrite →
- * planInvalidation → the publish queue coalesces N emits into one incremental publish (PUBLISH renders the
- * self route, UNPUBLISH prunes the old route). ALL-OR-NOTHING like `removeMany` (a missing id 404s before
+ * Publish / unpublish a batch of rows by persisting their `status` — the record's public INTENT, not the
+ * static file. Since ADR-0008 those are two steps: this write emits the same event an editor save emits,
+ * and the public layer's listener acts on the removal half only (UNPUBLISH prunes the route at once, so a
+ * page taken offline can never stay live). Making a page appear is the explicit publish action
+ * (`POST /api/publish`). ALL-OR-NOTHING like `removeMany` (a missing id 404s before
  * any write). Validation (`assertConditions`) runs on PUBLISH ONLY — unpublishing must never be blockable
  * (you must always be able to take a broken page offline). Omits `update()`'s slug/transform branches,
  * which are provably inert for a status-only change.

package/layers/core/server/utils/kestrel-config.ts

@@ -123,6 +123,11 @@ export interface KestrelConfig {
     publicDir?: string
     /** Auto-publish affected pages on every content write (default true). */
     auto?: boolean
+    /** Opt out of the save/publish split (ADR-0008): `true` makes every content write republish the pages
+     *  it affects, as before 2.0 — the editor's Publish button then has nothing left to do and is hidden.
+     *  Default false: saving writes the DB, publishing writes the static files.
+     *  Env `KESTREL_OUTPUT_PUBLISH_ON_SAVE`. */
+    publishOnSave?: boolean
     /** Run a FULL reconcile every N minutes (default 0 = off) — self-heals a missed invalidation. */
     reconcileMinutes?: number
     /** Verbose publish logging: emit a timestamped per-route line (rendered / pruned) on each incremental
@@ -158,6 +163,7 @@ export interface ResolvedKestrel {
     dir: string
     publicDir: string
     auto: boolean
+    publishOnSave: boolean
     reconcileMinutes: number
     verbose: boolean
     s3: ResolvedS3Settings
@@ -394,6 +400,7 @@ export function resolveKestrel(config: KestrelConfig | undefined, env: Env, root
     dir: resolveMaybe(rootDir, clean(env.KESTREL_OUTPUT_DIR) ?? clean(o.dir) ?? '.data/published'),
     publicDir: resolveMaybe(rootDir, clean(env.KESTREL_OUTPUT_PUBLIC_DIR) ?? clean(o.publicDir) ?? '.output/public'),
     auto: envBool(env.KESTREL_OUTPUT_AUTO, o.auto ?? true),
+    publishOnSave: envBool(env.KESTREL_OUTPUT_PUBLISH_ON_SAVE, o.publishOnSave ?? false),
     reconcileMinutes: resolveNonNegInt(o.reconcileMinutes, env.KESTREL_OUTPUT_RECONCILE_MINUTES),
     verbose: envBool(env.KESTREL_OUTPUT_VERBOSE, o.verbose ?? false),
     s3: resolveS3Settings(o.s3, env, 'KESTREL_OUTPUT_S3'),

package/layers/fields/server/field-registry/index.ts

@@ -161,6 +161,7 @@ export const fieldTypes: Record<string, FieldTypeDescriptor> = {
             type: z.literal('external'),
             // http(s) only, no control chars, no embedded credentials — the value ends up in a static <a href>.
             url: z.string().trim().pipe(z.url({ protocol: /^https?$/ })).refine((v) => {
+              // eslint-disable-next-line no-control-regex -- deliberately rejects control characters embedded in a URL destined for a static <a href>
               if (/[\u0000-\u001f]/.test(v)) return false
               const u = new URL(v)
               return !u.username && !u.password
@@ -168,7 +169,7 @@ export const fieldTypes: Record<string, FieldTypeDescriptor> = {
             label,
           }),
           z.object({ type: z.literal('email'), email: z.string().trim().pipe(z.email()), label }),
-          z.object({ type: z.literal('tel'), tel: z.string().trim().min(1).regex(/^[+0-9 ()\-.\/]+$/).refine((v) => /[0-9]/.test(v), 'Tel must contain at least one digit'), label }),
+          z.object({ type: z.literal('tel'), tel: z.string().trim().min(1).regex(/^[+0-9 ()\-./]+$/).refine((v) => /[0-9]/.test(v), 'Tel must contain at least one digit'), label }),
         ]),
         f,
       )

package/layers/fields/server/field-registry/sanitize.ts

@@ -1,16 +1,19 @@
 import sanitizeHtml from 'sanitize-html'
 import { RICHTEXT_LINK_SCHEME } from '../../app/utils/richtext-links'
 
+// Kept deliberately in step with the editor's schema (`ui/Richtext.vue`): a tag allowed here that no
+// extension can parse is not "supported", it is a delayed deletion — the editor drops it on load and the
+// next save persists the loss. `richtext.dom.test.ts` asserts the two lists agree, so widening this one
+// means teaching the editor the tag in the same change. Images belong in a media field or an image
+// block, not in flow text; tables await an editor that can hold them.
 export const RICHTEXT_ALLOWLIST: sanitizeHtml.IOptions = {
   allowedTags: [
     'p', 'br', 'span', 'strong', 'b', 'em', 'i', 'u', 's', 'sub', 'sup', 'mark',
     'blockquote', 'pre', 'code', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
-    'ul', 'ol', 'li', 'a', 'img', 'figure', 'figcaption', 'hr',
-    'table', 'thead', 'tbody', 'tfoot', 'tr', 'th', 'td',
+    'ul', 'ol', 'li', 'a', 'hr',
   ],
   allowedAttributes: {
     a: ['href', 'title', 'target', 'rel'],
-    img: ['src', 'alt', 'title', 'width', 'height', 'loading'],
     '*': ['class', 'style'],
   },
   allowedStyles: {

package/layers/media/app/components/MediaLibrary.vue

@@ -82,7 +82,8 @@ function onSelect(item: LibraryItem, mods: { toggle: boolean; range: boolean })
   if (props.pick && props.multiple) {
     if (item.type !== 'file') return
     const s = new Set(picked.value)
-    s.has(item.file.id) ? s.delete(item.file.id) : s.add(item.file.id)
+    if (s.has(item.file.id)) s.delete(item.file.id)
+    else s.add(item.file.id)
     picked.value = s
     return
   }
@@ -288,6 +289,7 @@ const localizedMenu = computed(() => menuItems.value.map((s) => ({
 </script>
 
 <template>
+  <!-- eslint-disable-next-line vuejs-accessibility/click-events-have-key-events, vuejs-accessibility/no-static-element-interactions -- @click.self clears selection as a mouse-only bulk convenience; Space-toggle on each MediaGrid/MediaTable item already gives keyboard users the same end state -->
   <section class="media-library" @click.self="lib.clear()" @dragenter="onDragEnter" @dragover="onDragOver" @dragleave="onDragLeave" @drop="onDrop">
     <MediaPathBar :folder="folder" @navigate="lib.navigate" />
     <MediaToolbar
@@ -301,6 +303,7 @@ const localizedMenu = computed(() => menuItems.value.map((s) => ({
     />
     <UiMenu :items="localizedMenu" @select="onMenuSelect">
       <!-- @contextmenu.capture sets the menu target before Reka's own handler opens the menu, so menuItems is correct when the menu renders -->
+      <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -- contextmenu fires natively via Shift+F10/the Menu key when a MediaGrid/MediaTable item has focus, so this capture handler is already keyboard-reachable -->
       <div class="media-library__items" @contextmenu.capture="onContextMenu">
         <UiAlert v-if="error" variant="error">{{ error }}</UiAlert>
         <p v-else-if="!loading && !items.length" class="media-library__empty">{{ t('media.folderEmpty') }}</p>

package/layers/media/app/components/MediaToolbar.vue

@@ -47,7 +47,7 @@ function onFiles(e: Event) {
     <div class="media-toolbar__actions">
       <UiButtonGroup v-model="viewModel" :options="VIEW_OPTIONS" :aria-label="t('mediaToolbar.viewAriaLabel')" />
       <span class="media-toolbar__divider" aria-hidden="true"></span>
-      <input ref="fileInput" type="file" multiple class="media-toolbar__file" @change="onFiles" />
+      <input ref="fileInput" type="file" multiple class="media-toolbar__file" :aria-label="t('mediaToolbar.upload')" @change="onFiles" />
       <UiButton :disabled="disabled" @click="fileInput?.click()"><UiIcon name="upload" :size="16" /> {{ t('mediaToolbar.upload') }}</UiButton>
       <UiButton :disabled="disabled" @click="emit('new-folder')"><UiIcon name="folder-plus" :size="16" /> {{ t('mediaToolbar.newFolder') }}</UiButton>
     </div>

package/layers/media/app/components/field/Media.vue

@@ -117,7 +117,9 @@ defineExpose({ onConfirm, removeId, onDragStart, onDrop, moveItem })
   <UiField :id="id" :label="name" :error="error" :required="required">
     <template #default="f">
       <div class="field-media">
+        <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -- @dragleave is a mouse-only progressive enhancement; the move-earlier/move-later buttons below give the same reorder fully keyboard access -->
         <ul v-if="resolved.length" ref="itemsEl" class="field-media__items" @dragleave="onDragLeave">
+          <!-- eslint-disable-next-line vuejs-accessibility/no-static-element-interactions -- drag handlers are a mouse-only progressive enhancement; the move-earlier/move-later buttons below give the same reorder fully keyboard access -->
           <li
             v-for="(r, i) in resolved"
             :key="r.id"

package/layers/media/app/composables/useMediaLibrary.ts

@@ -119,7 +119,8 @@ export function useMediaLibrary(opts: { urlSync?: boolean; accept?: 'image' | 'a
   function select(item: LibraryItem) { const k = itemKey(item); selected.value = new Set([k]); anchorKey = k }
   function toggle(item: LibraryItem) {
     const k = itemKey(item); const s = new Set(selected.value)
-    s.has(k) ? s.delete(k) : s.add(k)
+    if (s.has(k)) s.delete(k)
+    else s.add(k)
     selected.value = s; anchorKey = k
   }
   function range(item: LibraryItem) { selected.value = computeRange(orderedKeys.value, anchorKey ?? itemKey(item), itemKey(item), selected.value) }

package/layers/public/app/pages/[...slug].vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import type { LayoutKey } from 'nuxt/app'
+import type { LayoutKey } from '#app'
 import type { SiteHead } from '../utils/site-head'
 
 // The record decides its own layout, so route-meta resolution is opted out of and this page renders the
@@ -45,7 +45,20 @@ const { data: resolved, error: resolveError } = await useAsyncData(`page:${local
     site?: SiteHead | null
   }),
 )
-const page = computed(() => resolved.value?.page ?? null)
+// Ticket preview (ADR-0008): `?kestrel-preview-token=…` carries the editor's UNSAVED state, so an external
+// tab can show work in progress without a save and without publishing. The ticket is admin-only and
+// session-bound server-side; an expired/foreign/unknown one reads as null and the saved record renders.
+const previewToken = route.query[PREVIEW_TOKEN_QUERY]
+const { data: ticket } = typeof previewToken === 'string' && previewToken
+  ? await useAsyncData(`kestrel-preview-ticket:${previewToken}`, () =>
+      requestFetch('/api/preview', { query: { token: previewToken } })
+        .then((r) => r as { payload?: { values?: Record<string, unknown> } } | null)
+        .catch(() => null))
+  : { data: ref<{ payload?: { values?: Record<string, unknown> } } | null>(null) }
+const previewValues = computed(() => ticket.value?.payload?.values ?? null)
+const previewingTicket = computed(() => previewValues.value !== null)
+
+const page = computed(() => previewPage(resolved.value?.page ?? null, previewValues.value) as (RenderedPage & Record<string, unknown>) | null)
 // `fallback` below only rescues a truthy name that is missing from the layout map, so the empty cases have
 // to be coalesced here — see resolvePageLayout. The cast is the one honest bridge in this file: the stored
 // name is arbitrary editor data, while `NuxtLayout` types `name` as the union of layouts that existed at
@@ -60,7 +73,7 @@ const pageState = usePublicPageState()
 watchEffect(() => {
   pageState.value = {
     collection: resolved.value?.collection ?? null,
-    page: resolved.value?.page ?? null,
+    page: page.value,
   }
 })
 
@@ -68,6 +81,13 @@ watchEffect(() => {
 // published-only), so its presence is an unambiguous "you are previewing an unpublished page" signal.
 const isDraftPreview = computed(() => page.value?.status === 'draft')
 
+// What this tab is actually showing, when it is not the live page. A ticket outranks the draft notice: the
+// content on screen was never saved at all, which is the stronger caveat.
+const previewNotice = computed(() => {
+  if (previewingTicket.value) return 'Preview — unsaved changes, not published'
+  return isDraftPreview.value ? 'Draft preview — not published' : ''
+})
+
 // Editor live-preview mode: `?kestrel-preview=1` AND an authenticated admin session. The session is
 // checked server-side (cookies forwarded, same seam as the draft fetch above) so SSR and hydration
 // agree on which branch renders; an anonymous visitor with the query param gets the normal page.
@@ -129,7 +149,8 @@ useHead({
 useSeoMeta({
   title: documentTitle,
   description: fallbacks.description,
-  robots: seo.noindex ? 'noindex, nofollow' : undefined,
+  // A ticket preview is unsaved content at a real URL — never indexable, whatever the record's own SEO says.
+  robots: previewingTicket.value || seo.noindex ? 'noindex, nofollow' : undefined,
   ogTitle: head.meta.ogTitle,
   ogDescription: head.meta.ogDescription,
   ogUrl: head.meta.ogUrl,
@@ -148,9 +169,9 @@ useSeoMeta({
       <!-- Only ever shown to an authenticated admin previewing an unpublished page (drafts never resolve
            for anonymous visitors or the static render), so it never ships to the public/static site.
            Suppressed inside the editor preview iframe — the editor's own status ampel covers it. -->
-      <div v-if="isDraftPreview && !previewActive" class="kestrel-draft-badge" role="status">
+      <div v-if="previewNotice && !previewActive" class="kestrel-draft-badge" role="status">
         <span class="kestrel-draft-badge__dot" aria-hidden="true" />
-        Draft preview — not published
+        {{ previewNotice }}
       </div>
       <!-- Editor preview: the bridge swaps in the editor's live (unsaved) tree over postMessage and makes
            blocks selectable; the saved content renders until the first message. Normal path unchanged. -->

package/layers/public/app/pages/__kestrel/preview.vue

@@ -3,8 +3,10 @@
  * Dedicated editor live-preview page for records WITHOUT a public URL — a new/unsaved record, a blank
  * slug, or a blocks-enabled non-pageLike collection. It renders the real public app (default layout,
  * the consumer's CSS/fonts/breakpoints) around an empty BlockRenderer that the editor fills over the
- * postMessage bridge. Saved pageLike records preview at their REAL URL instead (higher fidelity);
- * this page is the graceful fallback so previews never regress to "save first".
+ * postMessage bridge — or, when opened in a separate tab with `?kestrel-preview-token=…`, around the
+ * ticket's unsaved content (ADR-0008), since a tab with no parent window has no bridge to listen to.
+ * Saved pageLike records preview at their REAL URL instead (higher fidelity); this page is the graceful
+ * fallback so previews never regress to "save first".
  *
  * Admin-gated server-side: `useRequestFetch` forwards the incoming cookies to `/api/auth/session`
  * (the same seam the catch-all uses for draft rendering), and anonymous requests get a 404 — the
@@ -20,6 +22,16 @@ if (!session.value?.authenticated) throw createError({ statusCode: 404, statusMe
 // Content locale from the editor (drives <html lang> for faithful per-locale rendering).
 const route = useRoute()
 const lang = typeof route.query.locale === 'string' && route.query.locale ? route.query.locale : undefined
+
+// Ticket content for the external-tab case; null (→ the bridge's own empty tree) without one.
+const token = route.query[PREVIEW_TOKEN_QUERY]
+const { data: ticket } = typeof token === 'string' && token
+  ? await useAsyncData(`kestrel-preview-ticket:${token}`, () =>
+      requestFetch('/api/preview', { query: { token } })
+        .then((r) => r as { payload?: { values?: Record<string, unknown> } } | null)
+        .catch(() => null))
+  : { data: ref<{ payload?: { values?: Record<string, unknown> } } | null>(null) }
+const ticketBlocks = computed(() => (ticket.value?.payload?.values?.content as unknown[] | undefined) ?? [])
 useHead({
   title: 'Preview',
   meta: [{ name: 'robots', content: 'noindex, nofollow' }],
@@ -28,7 +40,7 @@ useHead({
 </script>
 
 <template>
-  <KestrelPreviewBridge v-slot="{ blocks }">
+  <KestrelPreviewBridge :blocks="ticketBlocks" v-slot="{ blocks }">
     <BlockRenderer :blocks="(blocks as any[])" />
   </KestrelPreviewBridge>
 </template>

package/layers/public/app/utils/preview-protocol.ts

@@ -13,6 +13,8 @@
 
 /** Query flag that switches the public page into preview mode (value `1`). */
 export const PREVIEW_QUERY = 'kestrel-preview'
+/** Query carrying a preview TICKET — the editor's unsaved state, rendered in a normal tab (ADR-0008). */
+export const PREVIEW_TOKEN_QUERY = 'kestrel-preview-token'
 /** Dedicated preview page for records without a public URL (new/unsaved, non-pageLike). Admin-gated. */
 export const PREVIEW_FALLBACK_PATH = '/__kestrel/preview'
 
@@ -74,6 +76,40 @@ export function parseFrameMessage(data: unknown): FrameToEditorMessage | null {
  * pageLike record — server-populated first paint, drafts included for the admin session), else the
  * dedicated fallback page (new/unsaved records, non-pageLike collections). Both carry the preview flag.
  */
+/**
+ * The record a ticket preview renders: the saved row with the editor's unsaved values laid over it. Both
+ * halves are column-keyed (the editor sends what a save would send), so this is a shallow override — a
+ * field the editor did not touch keeps the stored value, and a page that does not exist yet (an unsaved
+ * slug) renders from the payload alone. Pure.
+ *
+ * One override is not shallow: a single-valued relation/media field is column-keyed `<name>Id` (the
+ * `resolveColumnName`/`isSingleRefColumn` convention — many-relations and multi-media stay bare-keyed, so
+ * they're untouched by this), while its populated sidecar sits ALONGSIDE the id, not under it — `$<name>`
+ * for a relation (`buildRelationFieldPopulator`), `$media.<name>` for media (`populate.ts`'s `attach`).
+ * `values` here is raw unsaved editor state, never itself populated, so clearing such a field to null
+ * leaves `saved`'s old sidecar with nothing to overwrite it — a plain spread would let a removed
+ * author/cover keep rendering. Drop it explicitly for every `<name>Id` key the editor cleared.
+ */
+export function previewPage(
+  saved: Record<string, unknown> | null,
+  values: Record<string, unknown> | null | undefined,
+): Record<string, unknown> | null {
+  if (!values) return saved
+  const merged: Record<string, unknown> = { ...(saved ?? {}), ...values }
+  for (const key of Object.keys(values)) {
+    if (values[key] !== null || !key.endsWith('Id')) continue
+    const name = key.slice(0, -2)
+    if (!name) continue
+    if (Object.hasOwn(merged, `$${name}`)) delete merged[`$${name}`]
+    const media = merged.$media as Record<string, unknown> | undefined
+    if (media && Object.hasOwn(media, name)) {
+      const { [name]: _dropped, ...rest } = media
+      merged.$media = rest
+    }
+  }
+  return merged
+}
+
 export function previewSrc(publicUrl: string | null, locale: string): string {
   if (publicUrl) return `${publicUrl}?${PREVIEW_QUERY}=1`
   const loc = locale ? `&locale=${encodeURIComponent(locale)}` : ''

package/layers/public/server/api/preview.get.ts

@@ -0,0 +1,28 @@
+import { usePreviewStore, previewOwner } from '../utils/preview-token'
+
+/**
+ * Read back a preview ticket (ADR-0008) — the public page fetches it during SSR when the URL carries
+ * `?kestrel-preview-token=…` and renders the editor's unsaved state instead of the stored record. Admin-
+ * only and session-bound; an expired, foreign or unknown token is `null`, which the page treats as
+ * "nothing to preview" and falls back to the saved content rather than failing the render.
+ */
+export default defineEventHandler((event) => {
+  requireAdmin(event) // write-authorization backstop (defense-in-depth; see require-admin.ts)
+  const token = getQuery(event).token
+  if (typeof token !== 'string' || !token) return null
+  const payload = usePreviewStore().read(token, previewOwner(event))
+  if (!payload) return null
+
+  // The editor sends what a SAVE would send — raw ids for media and relations — so the ticket goes through
+  // the same read population a stored record does. Without it the preview would render a page with the
+  // images and internal links stripped, which is worse than useless for judging a layout.
+  const c = getCollection(payload.collection)
+  if (!c) return { payload }
+  const locale = payload.locale || primaryLocale()
+  const values = withResolveScope(
+    () => populateRow({ ...payload.values }, { depth: 1, locale, def: c.def }),
+    resolveBudgetFor(1),
+    `preview ${payload.collection}`,
+  )
+  return { payload: { ...payload, values } }
+})

package/layers/public/server/api/preview.post.ts

@@ -0,0 +1,93 @@
+import { usePreviewStore, previewOwner, type PreviewPayload } from '../utils/preview-token'
+import type { BuiltCollection } from '../../../core/server/utils/collection-types'
+import { fieldIs, type FieldDef } from '../../../core/server/utils/defineCollection'
+import { resolveColumnName } from '../../../fields/server/field-registry/naming'
+import { sanitizeRichtext } from '../../../fields/server/field-registry/sanitize'
+import { getBlock } from '../../../fields/server/utils/defineBlock'
+
+/** Editor payloads are form state, not uploads — a block tree with populated media is far below this. */
+const MAX_PAYLOAD_BYTES = 2_000_000
+
+/**
+ * Sanitize every richtext leaf reachable from `scope` (top-level fields + nested repeater entries), in
+ * place. Mirrors the WALK shape of crud.ts's `applyFieldTransforms`/`transformNested`, but not the
+ * mechanism: richtext's sanitizer is wired into the Zod validator (`z.string().transform(sanitizeRichtext)`
+ * in field-registry/index.ts), not the field-type's `transform` hook that walk calls — and running the
+ * collection's Zod schema here isn't an option anyway, see `sanitizePreviewValues` below. So this calls
+ * `sanitizeRichtext` directly wherever a `richtext` field is present, and only there; every other field
+ * passes through untouched.
+ */
+function sanitizeRichtextFields(fields: Record<string, FieldDef>, scope: Record<string, unknown>): void {
+  for (const [key, fieldDef] of Object.entries(fields)) {
+    const { jsKey } = resolveColumnName(key, fieldDef)
+    if (!Object.hasOwn(scope, jsKey)) continue
+    if (fieldIs(fieldDef, 'richtext')) {
+      if (typeof scope[jsKey] === 'string') scope[jsKey] = sanitizeRichtext(scope[jsKey] as string)
+    } else if (fieldIs(fieldDef, 'repeater')) {
+      const entries = scope[jsKey]
+      if (Array.isArray(entries)) {
+        for (const entry of entries) if (entry && typeof entry === 'object') sanitizeRichtextFields(fieldDef.options.fields, entry as Record<string, unknown>)
+      }
+    }
+  }
+}
+
+/** Same walk as `transformBlocks` in crud.ts: each block's props (by its registered field defs) + its
+ *  slots' nested blocks, recursively. An unregistered block type is left as-is (matches crud.ts). */
+function sanitizeRichtextInBlocks(blocks: unknown): void {
+  if (!Array.isArray(blocks)) return
+  for (const block of blocks) {
+    if (!block || typeof block !== 'object') continue
+    const b = block as { type?: string; props?: unknown; slots?: unknown }
+    const def = typeof b.type === 'string' ? getBlock(b.type) : undefined
+    if (def && b.props && typeof b.props === 'object') sanitizeRichtextFields(def.fields, b.props as Record<string, unknown>)
+    if (b.slots && typeof b.slots === 'object') for (const sub of Object.values(b.slots as Record<string, unknown>)) sanitizeRichtextInBlocks(sub)
+  }
+}
+
+/**
+ * Apply the richtext sanitizer to a preview ticket's `values` — the fix for the ticket bypassing it
+ * entirely (it normally runs as a Zod `.transform()` on WRITE, `create`/`update`/`putSingleton` in
+ * crud.ts; a ticket never reaches those). Deliberately NOT a schema parse: `values` is the editor's
+ * in-progress, possibly-invalid draft (a missing required field, an out-of-range number, …), and a preview
+ * exists precisely so a draft can be inspected BEFORE it would pass a save — a strict or even a `.partial()`
+ * parse would legitimately reject some of what it must accept. Sanitizing is not a validity constraint
+ * though (it only narrows stored bytes, the same way a save would), so a direct field-tree walk gets the
+ * safety without the rejection risk. Walks top-level fields, repeater entries, and (when the collection
+ * uses the block editor) block props + nested slots — everywhere a richtext leaf can live.
+ */
+function sanitizePreviewValues(collection: BuiltCollection, values: Record<string, unknown>): void {
+  sanitizeRichtextFields(collection.def.fields, values)
+  if (collection.def.blocks?.enabled && Object.hasOwn(values, 'content')) sanitizeRichtextInBlocks(values.content)
+}
+
+/**
+ * Mint a preview ticket for the editor's UNSAVED state (ADR-0008). The editor posts what it currently
+ * holds and opens the page at `?kestrel-preview-token=<token>` in a new tab; nothing is written to the DB,
+ * so previewing never doubles as an unasked-for save. Admin-only (default-deny API guard + the backstop),
+ * and the ticket is bound to this session.
+ *
+ *   body: { collection, id: number | null, locale?, values }
+ *   200:  { token, expiresAt }
+ */
+export default defineEventHandler(async (event) => {
+  requireAdmin(event) // write-authorization backstop (defense-in-depth; see require-admin.ts)
+  const body = (await readBody(event)) as Partial<PreviewPayload> | null
+
+  const name = typeof body?.collection === 'string' ? body.collection : ''
+  const collection = getCollection(name) as BuiltCollection | undefined
+  if (!collection) throw createError({ statusCode: 404, statusMessage: `Unknown collection: ${name}` })
+
+  const values = body?.values
+  if (!values || typeof values !== 'object' || Array.isArray(values)) {
+    throw createError({ statusCode: 400, statusMessage: 'preview requires a `values` object' })
+  }
+  if (JSON.stringify(values).length > MAX_PAYLOAD_BYTES) {
+    throw createError({ statusCode: 413, statusMessage: 'Preview payload too large' })
+  }
+  sanitizePreviewValues(collection, values as Record<string, unknown>)
+
+  const id = typeof body?.id === 'number' && Number.isInteger(body.id) ? body.id : null
+  const locale = typeof body?.locale === 'string' ? body.locale : undefined
+  return usePreviewStore().mint(previewOwner(event), { collection: name, id, locale, values })
+})

package/layers/public/server/api/publish-status.get.ts

@@ -2,6 +2,7 @@ import { eq, getTableColumns } from 'drizzle-orm'
 import type { AnySQLiteTable } from 'drizzle-orm/sqlite-core'
 import { publishStatus } from '../database/publish-status'
 import { routeForRecord } from '../utils/publish/route-for-record'
+import { hasPendingChanges } from '../utils/publish/pending'
 
 /**
  * Admin-only read of the LIVE publish state of a record's static page (`?collection=&id=`). Admin-only by
@@ -17,28 +18,41 @@ export default defineEventHandler((event) => {
   // (`driver`) and whether the runtime publisher actually produces files HERE (prod + `output.auto`). In dev
   // (or with auto off) nothing is ever generated, so the lamp shows a calm "Not built" instead of a stuck
   // "Generating". Read straight from runtimeConfig — no need to pull in the whole publisher module.
-  const output = (useRuntimeConfig().kestrel as { output?: { driver?: 'local' | 's3'; auto?: boolean } }).output
-  const env = { driver: (output?.driver ?? 'local') as 'local' | 's3', generates: !import.meta.dev && !!output?.auto }
+  const output = (useRuntimeConfig().kestrel as { output?: { driver?: 'local' | 's3'; auto?: boolean; publishOnSave?: boolean } }).output
+  // `publishOnSave` also tells the editor whether to offer a Publish button at all: with the split turned
+  // off there is nothing left for it to do.
+  const publishOnSave = !!output?.publishOnSave
+  const env = { driver: (output?.driver ?? 'local') as 'local' | 's3', generates: !import.meta.dev && !!output?.auto, publishOnSave }
 
   const q = getQuery(event)
   const name = typeof q.collection === 'string' ? q.collection : ''
   const id = Number(typeof q.id === 'string' ? q.id : NaN)
   const c = getCollection(name)
-  if (!c || !c.def.pageLike || !Number.isInteger(id) || id <= 0) return { route: null, status: null, ...env }
+  if (!c || !c.def.pageLike || !Number.isInteger(id) || id <= 0) return { route: null, status: null, pending: false, neverPublished: false, ...env }
 
   const db = useDb()
   const table = c.table as AnySQLiteTable
   const cols = getTableColumns(table) as Record<string, never>
-  const row = db.select().from(table).where(eq(cols.id, id)).get() as { path?: unknown; locale?: unknown } | undefined
+  const row = db.select().from(table).where(eq(cols.id, id)).get() as { path?: unknown; locale?: unknown; updatedAt?: unknown } | undefined
   const route = routeForRecord(row, true, primaryLocale(), prefixPrimaryLocale())
-  if (!route) return { route: null, status: null, ...env }
+  if (!route) return { route: null, status: null, pending: false, neverPublished: false, ...env }
 
+  // Saved after it was last published: with publishing deferred to an explicit action, that is the normal
+  // working state of a page being edited — the live file is the previous version until someone publishes.
+  const savedAt = row?.updatedAt instanceof Date ? row.updatedAt.getTime() : null
   try {
     const st = db.select().from(publishStatus).where(eq(publishStatus.route, route)).get()
-    if (!st) return { route, status: null, ...env }
-    return { route, status: st.status, error: st.error, updatedAt: st.updatedAt, target: st.target, ...env }
+    // A routable page with no row was never published. Before the split that was indistinguishable from
+    // "a publish is running" — a save always enqueued one — but now nothing is in flight and nothing will be
+    // until someone presses Publish, so the lamp must not claim progress that is not happening.
+    if (!st) return { route, status: null, pending: false, neverPublished: true, ...env }
+    // With the split off, a save republishes on its own, so a newer save means a republish is in flight —
+    // reporting that as "unpublished changes" would ask the user to act on something already happening.
+    const pending = !publishOnSave && hasPendingChanges(savedAt, st.updatedAt instanceof Date ? st.updatedAt.getTime() : null)
+    return { route, status: st.status, error: st.error, updatedAt: st.updatedAt, target: st.target, pending, neverPublished: false, ...env }
   } catch {
-    // publish_status not migrated yet → treat as "no status" rather than a 500.
-    return { route, status: null, ...env }
+    // publish_status not migrated yet → treat as "no status" rather than a 500. Not "never published"
+    // either: the table is unreadable, so the page's real state is unknown, not known to be absent.
+    return { route, status: null, pending: false, neverPublished: false, ...env }
   }
 })