@michaelthielemann/kestrel 4.1.3 → 5.0.2

package/layers/admin/app/composables/useListFilterDraft.ts

@@ -1,129 +0,0 @@
-// The Filter panel's pending edits, and how they become committed clauses in the URL.
-//
-// `filter` (from the URL) is the committed state that drives the query; `draft` is what the panel shows
-// while the user is still typing. A value change debounces, an operator change commits at once.
-import { computed, onBeforeUnmount, reactive, watch, type ComputedRef } from 'vue'
-import { DEFAULT_OP, OPS_BY_KIND } from '@michaelthielemann/kestrel-core/client'
-import type { FilterKind, FilterOp } from '@michaelthielemann/kestrel-core/client'
-import type { Localized } from '@michaelthielemann/kestrel-core'
-import { resolveLocalized } from '../../../ui/app/utils/localized'
-import { columnLabel } from '../utils/list-cell'
-import type { ListColumn } from '../utils/list-columns'
-import type { FilterCell } from '../utils/list-query'
-
-const COMMIT_DEBOUNCE_MS = 250
-
-/** One active clause as the chip row renders it. */
-export interface ActiveFilter {
-  key: string
-  op: FilterOp
-  opLabel: string
-  label: string
-  display: string
-}
-
-/** The panel's whole controller — passed to the filter panel as one prop rather than a dozen. */
-export interface ListFilterDraft {
-  draft: Record<string, FilterCell>
-  activeFilters: ComputedRef<ActiveFilter[]>
-  opsFor: (c: ListColumn) => readonly FilterOp[]
-  opLabel: (kind: FilterKind, op: FilterOp) => string
-  enumOptions: (c: ListColumn) => { label: string; value: string }[]
-  setValue: (field: string, value: string) => void
-  setOp: (field: string, op: FilterOp) => void
-  clearFilter: (field: string) => void
-  clearAll: () => void
-}
-
-interface FilterDraftOptions {
-  available: ComputedRef<ListColumn[]>
-  filterableColumns: ComputedRef<ListColumn[]>
-  filter: ComputedRef<Record<string, FilterCell>>
-  setFilter: (next: Record<string, FilterCell>) => void
-}
-
-export function useListFilterDraft(opts: FilterDraftOptions): ListFilterDraft {
-  const { t, lang } = useT()
-  const draft = reactive<Record<string, FilterCell>>({})
-
-  // Overwrite each draft cell FROM the committed `filter` so deep-link / Back-Forward / chip-removal reflect
-  // back into the open panel; drop drafts for columns this collection no longer has. We key the watch on the
-  // committed filter's CONTENT (its JSON), not its object identity: `filter` recomputes to a fresh-but-EQUAL
-  // object on every `route.query` change (page/sort/perPage navigations too), and resyncing on those identity
-  // flips would wipe an in-progress panel edit. Clobber-safe on a real filter commit: a commit sends ALL
-  // drafts at once, so post-commit `filter` equals `draft` (a no-op overwrite) — the content only actually
-  // changes on external navigation (deep-link/Back-Forward/chip-removal), which is when the panel should resync.
-  watch([opts.filterableColumns, () => JSON.stringify(opts.filter.value)], () => {
-    const cols = opts.filterableColumns.value
-    for (const c of cols) {
-      const cm = opts.filter.value[c.key]
-      draft[c.key] = { op: cm?.op ?? DEFAULT_OP[c.filterKind ?? 'text'], value: cm?.value ?? '' }
-    }
-    for (const key of Object.keys(draft)) if (!cols.some((c) => c.key === key)) Reflect.deleteProperty(draft, key)
-  }, { immediate: true })
-
-  function opsFor(c: ListColumn): readonly FilterOp[] {
-    return OPS_BY_KIND[c.filterKind ?? 'text']
-  }
-  // Operator labels are kind-aware: a datetime comparison reads "before / on or before / …" instead of the
-  // generic "less than / less or equal / …".
-  function opLabel(kind: FilterKind, op: FilterOp): string {
-    if (kind === 'datetime' && (op === 'lt' || op === 'lte' || op === 'gt' || op === 'gte')) return t(`filter.opDate.${op}`)
-    return t(`filter.op.${op}`)
-  }
-  // Choices for an `enum` / `stringSet` value control: a fixed draft/published set for `status`, else the
-  // choice field's own (single- and multi-choice fields both carry `options.choices`).
-  function enumOptions(c: ListColumn): { label: string; value: string }[] {
-    if (c.key === 'status') return [
-      { value: 'draft', label: t('pageSettings.statusDraft') },
-      { value: 'published', label: t('pageSettings.statusPublished') },
-    ]
-    // A choice label is `Localized`, so resolve it here as the editor widget does — `{{ o.label }}` would
-    // stringify a `{ en, de }` map into the filter dropdown.
-    return ((c.field?.options?.choices ?? []) as { label: Localized; value: string }[])
-      .map((o) => ({ value: o.value, label: resolveLocalized(o.label, lang.value) ?? o.value }))
-  }
-  function displayValue(kind: FilterKind, value: string): string {
-    if (kind === 'boolean') return value === 'true' ? t('filter.bool.true') : value === 'false' ? t('filter.bool.false') : value
-    return value
-  }
-
-  // Builds a fresh clause map from the non-empty draft cells and navigates via `setFilter` (which also
-  // resets page → 1).
-  let timer: ReturnType<typeof setTimeout> | undefined
-  function commitDrafts() {
-    const next: Record<string, FilterCell> = {}
-    for (const [field, cell] of Object.entries(draft)) {
-      if (cell.value !== '' && cell.value != null) next[field] = { op: cell.op, value: cell.value }
-    }
-    opts.setFilter(next)
-  }
-  function setValue(field: string, value: string) {
-    if (draft[field]) draft[field].value = value
-    clearTimeout(timer)
-    timer = setTimeout(commitDrafts, COMMIT_DEBOUNCE_MS)
-  }
-  function setOp(field: string, op: FilterOp) {
-    if (draft[field]) draft[field].op = op
-    // An operator change is deliberate — re-query immediately (no debounce) if the field has a value.
-    clearTimeout(timer)
-    commitDrafts()
-  }
-  function clearFilter(field: string) {
-    if (draft[field]) draft[field].value = ''
-    commitDrafts() // re-commits the drafts with this one now empty → the clause is dropped (and page → 1)
-  }
-  function clearAll() {
-    for (const cell of Object.values(draft)) cell.value = ''
-    opts.setFilter({}) // clear the committed clauses (and page → 1); the draft-resync watch clears the panel
-  }
-  onBeforeUnmount(() => clearTimeout(timer))
-
-  const activeFilters = computed(() => Object.entries(opts.filter.value).map(([key, cell]) => {
-    const col = opts.available.value.find((c) => c.key === key)
-    const kind = col?.filterKind ?? 'text'
-    return { key, op: cell.op, opLabel: opLabel(kind, cell.op), label: col ? columnLabel(col, t) : key, display: displayValue(kind, cell.value) }
-  }))
-
-  return { draft, activeFilters, opsFor, opLabel, enumOptions, setValue, setOp, clearFilter, clearAll }
-}

package/layers/admin/app/composables/useListRows.ts

@@ -1,75 +0,0 @@
-// The collection list's row fetch: request, out-of-range clamp, and the inline error state.
-import { computed, ref, type ComputedRef, type Ref } from 'vue'
-
-interface ListRowsOptions {
-  collection: ComputedRef<string>
-  /** The sanitized query derived from the URL (sort / page / perPage / filter). */
-  effectiveQuery: ComputedRef<Record<string, unknown>>
-  locale: () => string | undefined
-  page: ComputedRef<number>
-  perPage: ComputedRef<number>
-  /** Navigate back into range when the current page emptied out; REPLACE, never push. */
-  clampPage: (page: number) => void
-  /** Runs after a SUCCESSFUL fetch — the caller drops its page-scoped state here. A failed fetch keeps
-   *  the previously rendered rows, so anything scoped to them stays valid. */
-  onLoaded?: () => void
-}
-
-interface ListResponse {
-  data: Record<string, unknown>[]
-  total: number
-  page: number
-  perPage: number
-  /** Set by `validateOut` — count of rows in `data` replaced with the quarantine shape. */
-  quarantinedCount?: number
-}
-
-export function useListRows(opts: ListRowsOptions) {
-  const { t } = useT()
-  const rows = ref<Record<string, unknown>[]>([])
-  const total = ref(0)
-  const quarantinedCount = ref(0)
-  // Surfaced when a (re)fetch fails — an inline error + Retry, never a silent stale list or a thrown
-  // error boundary. Distinct from the empty state (which only shows when the fetch SUCCEEDED with no rows).
-  const error = ref<string | null>(null)
-  const totalPages = computed(() => Math.max(1, Math.ceil(total.value / opts.perPage.value)))
-
-  // Monotonic request id: a slow earlier response must not overwrite a newer one.
-  let seq = 0
-  async function fetchRows() {
-    const mine = ++seq
-    const locale = opts.locale()
-    try {
-      const res = await $fetch<ListResponse>(`/api/${opts.collection.value}/readMany`, {
-        query: { ...opts.effectiveQuery.value, ...(locale ? { locale } : {}) },
-      })
-      if (mine !== seq) return
-      rows.value = res.data
-      total.value = res.total
-      quarantinedCount.value = res.quarantinedCount ?? 0
-      error.value = null
-      // A page that emptied out from under us — e.g. bulk-deleting the last rows of the trailing page —
-      // would otherwise strand the user on an out-of-range page showing the "create your first" empty
-      // state. Clamp back to the last page that still has rows (REPLACE, so the dead page isn't left as a
-      // history entry that Back would bounce off; the query watch refetches).
-      if (res.data.length === 0 && res.total > 0 && opts.page.value > 1) {
-        opts.clampPage(Math.max(1, Math.ceil(res.total / opts.perPage.value)))
-      }
-      opts.onLoaded?.()
-    } catch (e) {
-      if (mine !== seq) return
-      // Keep any previously-rendered rows, but surface that this fetch failed (and don't show the
-      // "create your first" empty state — that would imply the collection is empty when it isn't).
-      error.value = (e as { statusMessage?: string })?.statusMessage ?? t('list.loadError')
-    }
-  }
-
-  return { rows, total, quarantinedCount, error, totalPages, fetchRows } as {
-    rows: Ref<Record<string, unknown>[]>
-    total: Ref<number>
-    quarantinedCount: Ref<number>
-    error: Ref<string | null>
-    totalPages: ComputedRef<number>
-    fetchRows: () => Promise<void>
-  }
-}

package/layers/admin/app/composables/useListSelection.ts

@@ -1,28 +0,0 @@
-// Page-scoped row selection for the collection list.
-//
-// The Set is valid only for the rows currently on screen — every (re)fetch replaces them, so the caller
-// clears it from its fetch handler. A reactive Set (Vue tracks add/delete/has/size) keeps a single-row
-// toggle O(1): no full-Set copy and no whole-table re-diff per click, which mattered at the 500-row cap.
-import { computed, reactive, type Ref } from 'vue'
-
-export function useListSelection(rows: Ref<Record<string, unknown>[]>) {
-  const selected = reactive(new Set<number>())
-  const pageIds = computed(() => rows.value.map((r) => Number(r.id)))
-  const allSelected = computed(() => pageIds.value.length > 0 && pageIds.value.every((id) => selected.has(id)))
-  // Tri-state header checkbox: some rows selected, but not all of them.
-  const headerIndeterminate = computed(() => pageIds.value.some((id) => selected.has(id)) && !allSelected.value)
-
-  function toggleRow(id: number, on: boolean) {
-    if (on) selected.add(id)
-    else selected.delete(id)
-  }
-  function toggleAll(on: boolean) {
-    selected.clear()
-    if (on) for (const id of pageIds.value) selected.add(id)
-  }
-  function clear() {
-    selected.clear()
-  }
-
-  return { selected, allSelected, headerIndeterminate, toggleRow, toggleAll, clear }
-}

package/layers/admin/app/composables/useListUrlState.ts

@@ -1,53 +0,0 @@
-import type { Ref } from 'vue'
-import type { ListColumn } from '../utils/list-columns'
-import { toQuery, toggleSort, parseListQuery, type FilterCell, type ListState } from '../utils/list-query'
-import { clampPerPage, DEFAULT_PER_PAGE } from '@michaelthielemann/kestrel-core/client'
-
-/**
- * The URL is the SINGLE SOURCE OF TRUTH for a collection list's committed state (sort · page · perPage ·
- * filter). This composable derives that state from `route.query` (sanitized via `parseListQuery`, so a
- * hostile/partial URL degrades to defaults rather than reaching the server), and turns each mutation into a
- * router navigation: `page` uses `push` (Back walks pages), everything else uses `replace` (typing / toggling
- * must not spam history). Every non-page action also resets `page → 1`, so a page-only transition is the only
- * one that ever differs by page alone — the push/replace split is exact.
- *
- * The per-page cookie is a DEFAULT, never state: when the URL carries no `perPage`, the initial value is
- * seeded from the cookie (clamped); when perPage changes we write the cookie so a chosen density survives
- * navigation. The URL always wins.
- */
-export function useListUrlState(columns: Ref<ListColumn[]>) {
-  const route = useRoute()
-  const router = useRouter()
-  const perPageCookie = useCookie<number>('kestrel-list-per-page', { default: () => DEFAULT_PER_PAGE })
-
-  const parsed = computed(() => parseListQuery(route.query, columns.value))
-  const sort = computed(() => parsed.value.sort ?? '-createdAt')
-  const page = computed(() => parsed.value.page ?? 1)
-  const perPage = computed(() => parsed.value.perPage ?? clampPerPage(perPageCookie.value)) // URL wins, else cookie
-  const filter = computed(() => parsed.value.filter ?? {})
-  // The exact `$fetch` query the list endpoint expects — always the SANITIZED computeds, never the raw URL.
-  const effectiveQuery = computed(() => toQuery({ sort: sort.value, page: page.value, perPage: perPage.value, filter: filter.value }))
-
-  // We replace the WHOLE query on every navigation, so re-merge `locale` from the RAW URL (it lives outside
-  // the list-state keys and must survive a sort/page/filter change). Reading `route.query.locale` — NOT a
-  // resolved prop — keeps a locale-LESS URL locale-less after a list mutation: for a translatable collection
-  // the prop is the PRIMARY locale even when the URL carries no `?locale`, so merging it would inject
-  // `locale=<primary>`, flip the host page's `${collection}::${locale}` key and needlessly REMOUNT the list
-  // mid-edit. The locale switcher still navigates with an explicit `?locale`, which is preserved here (and
-  // correctly re-keys → remounts on a real locale switch).
-  function go(patch: Partial<ListState>, mode: 'push' | 'replace') {
-    const next: ListState = { sort: sort.value, page: page.value, perPage: perPage.value, filter: filter.value, ...patch }
-    const locale = route.query.locale
-    return router[mode]({ query: { ...toQuery(next), ...(typeof locale === 'string' ? { locale } : {}) } })
-  }
-
-  const setSort = (f: string) => go({ sort: toggleSort(sort.value, f), page: 1 }, 'replace')
-  const setPage = (p: number) => go({ page: p }, 'push')
-  // Corrective clamp (a page that emptied out from under us) — REPLACE, not push, so the now-invalid page
-  // doesn't stay a reachable history entry that Back bounces the user forward from on every press.
-  const clampPage = (p: number) => go({ page: p }, 'replace')
-  const setPerPage = (n: number) => { perPageCookie.value = clampPerPage(n); return go({ perPage: clampPerPage(n), page: 1 }, 'replace') }
-  const setFilter = (f: Record<string, FilterCell>) => go({ filter: f, page: 1 }, 'replace')
-
-  return { sort, page, perPage, filter, effectiveQuery, setSort, setPage, clampPage, setPerPage, setFilter }
-}

package/layers/admin/app/composables/usePendingPublishPoll.ts

@@ -1,15 +0,0 @@
-import { ref } from 'vue'
-
-// A create saves, then the host navigates the editor to the new record's own URL (`/new` → `/<id>`), which
-// tears down the editor that issued the save and remounts a fresh one at the real id. The republish it
-// kicked off is still in flight, so the ARRIVING editor must POLL the live status (not do a single refresh)
-// to catch the "Generating…" → "Live" transition. This module-scoped flag carries that intent across the
-// remount: the departing instance sets it on save, the arriving instance reads-and-clears it on mount.
-// Client-only ephemeral signal (set in a user save handler, read on mount) — a plain ref is enough; it never
-// runs during SSR, so there is no cross-request leakage.
-const pending = ref(false)
-
-/** Shared "the next editor mount should poll the live status" flag — see the note above. */
-export function usePendingPublishPoll() {
-  return pending
-}

package/layers/admin/app/composables/usePreviewViewport.ts

@@ -1,30 +0,0 @@
-import { computed } from 'vue'
-import type { Dim } from '../utils/preview-viewport'
-
-/**
- * Persisted page-builder preview viewport: the target width/height as `Dim`s (a fixed px, or `'auto'`
- * which fills the pane). Cookie-backed so the choice survives reloads and stays SSR-safe (server + client
- * read the same value — no hydration mismatch), the same pattern as `useRailCollapsed`. Defaults to the
- * config-driven desktop width with an `'auto'` height (fills the pane, no container scroll).
- *
- * Each setter reassigns the whole object (rather than mutating a field) so Nuxt's cookie watcher always
- * re-serialises. Note: the seeded default only applies when the cookie is absent — if a project later
- * changes `preview.desktopWidth`, an existing cookie keeps its `w` until the Desktop preset is clicked. A
- * stale cookie from before Auto height (a numeric `h`, plus a now-ignored `fit`) is tolerated: it just
- * reads as a fixed custom height until Desktop is re-selected.
- */
-export interface PreviewViewport {
-  w: Dim
-  h: Dim
-}
-
-export function usePreviewViewport(desktopWidth: number) {
-  const state = useCookie<PreviewViewport>('kestrel-preview-viewport', {
-    default: () => ({ w: desktopWidth, h: 'auto' }),
-  })
-
-  const width = computed({ get: () => state.value.w, set: (v: Dim) => { state.value = { ...state.value, w: v } } })
-  const height = computed({ get: () => state.value.h, set: (v: Dim) => { state.value = { ...state.value, h: v } } })
-
-  return { width, height }
-}

package/layers/admin/app/composables/usePublishStatus.ts

@@ -1,107 +0,0 @@
-import { ref, toValue } from 'vue'
-import type { MaybeRefOrGetter } from 'vue'
-
-/** The live publish state of a record's static page, as returned by `GET /api/publishStatus`. */
-export interface PublishStatusData {
-  route: string | null
-  status: 'success' | 'error' | null
-  error?: string | null
-  updatedAt?: string | null
-  /** Which output the last attempt wrote to — `'local'` dir or `'s3'` bucket; null when no row yet. */
-  target?: 'local' | 's3' | null
-  /** The record was saved after its page was last published — the live file is an older version of it.
-   *  The normal working state while editing, since a save no longer republishes (ADR-0008). */
-  pending?: boolean
-  /** The consumer opted out of the save/publish split (`output.publishOnSave`): a save republishes on its
-   *  own, so the editor offers no Publish button and never reports unpublished changes. */
-  publishOnSave?: boolean
-  /** The page has no publish row at all. Distinct from "a publish is in flight": with the split on, a save
-   *  enqueues nothing, so this state only ends when someone presses Publish. */
-  neverPublished?: boolean
-  /** Whether the runtime publisher actually produces files in THIS environment (prod + `output.auto`).
-   *  `false` in dev / with static output off → a page can never turn "Live" here, so don't poll for it. */
-  generates?: boolean
-  /** The configured output destination (where the NEXT publish would go), independent of any row. */
-  driver?: 'local' | 's3'
-}
-
-const EMPTY: PublishStatusData = { route: null, status: null }
-
-/**
- * Fetch (and refetch) the LIVE / generated publish state of the record the editor is on, for the right
- * dot of the editor Ampel. Explicit `refresh()` (no auto-fetch) so it is testable in isolation and the
- * caller controls timing: the editor refreshes on mount and again after each save (a save may (re)publish
- * the page). Skips the request entirely when disabled (non-pageLike collection) or the record is unsaved
- * (`id === 'new'` has no server row, hence no route yet). A failed fetch degrades to an empty status
- * rather than surfacing an error — the ampel is a non-critical signal.
- */
-export function usePublishStatus(args: {
-  collection: MaybeRefOrGetter<string>
-  id: MaybeRefOrGetter<string | number>
-  locale?: MaybeRefOrGetter<string | undefined>
-  enabled?: MaybeRefOrGetter<boolean>
-}) {
-  const data = ref<PublishStatusData>({ ...EMPTY })
-  // Bumped by every `refresh()` / `refreshUntilSettled()` start; an in-flight poll compares the token it
-  // captured and bails the moment a newer call supersedes it (navigation, another save), so stale loops
-  // can't keep writing to `data`.
-  let pollToken = 0
-
-  async function fetchOnce(): Promise<void> {
-    // Guard every write by the token captured at call time: if a newer refresh/poll supersedes this one
-    // while its request is in flight, its (possibly stale) response must NOT overwrite the fresher data —
-    // two overlapping fetches (a rapid re-save superseding a poll) can otherwise resolve out of order.
-    const token = pollToken
-    const enabled = args.enabled === undefined ? true : toValue(args.enabled)
-    const id = toValue(args.id)
-    if (!enabled || id === 'new' || id == null) {
-      if (token === pollToken) data.value = { ...EMPTY }
-      return
-    }
-    try {
-      const res = await $fetch<PublishStatusData>('/api/publishStatus', {
-        query: { collection: toValue(args.collection), id, locale: toValue(args.locale) },
-      })
-      if (token === pollToken) data.value = res
-    } catch {
-      if (token === pollToken) data.value = { ...EMPTY }
-    }
-  }
-
-  /** One-shot fetch. Also cancels any running poll (this is the fresh source of truth). */
-  async function refresh(): Promise<void> {
-    pollToken++
-    await fetchOnce()
-  }
-
-  /**
-   * Poll the live status until it SETTLES, for the right lamp after a save: in prod a save enqueues an
-   * async (debounced) republish that finishes a moment later, so a single refresh would only ever catch the
-   * pre-republish row. Stops when the record has no route, the environment doesn't generate (`generates ===
-   * false` — dev / static output off: nothing will ever be produced, so polling is pointless), or a terminal
-   * outcome (`success`/`error`) from the NEW republish lands.
-   *
-   * `since` is the row's `updatedAt` BEFORE this save. `publish_status` is a latest-state upsert that is NOT
-   * cleared first, so a re-saved page keeps its prior success/error row until the fresh render rewrites it —
-   * without this baseline the very first poll would read that stale row and settle instantly (e.g. staying
-   * green "Live" for a re-save that actually failed to republish). So a terminal outcome only counts as
-   * settled once its `updatedAt` differs from `since`. Bounded by `attempts`; superseded-safe via `pollToken`.
-   */
-  async function refreshUntilSettled(opts?: { attempts?: number; delayMs?: number; since?: string | null }): Promise<void> {
-    const token = ++pollToken
-    const attempts = opts?.attempts ?? 12
-    const delayMs = opts?.delayMs ?? 2000
-    const since = opts?.since ?? null
-    for (let i = 0; i < attempts; i++) {
-      if (token !== pollToken) return
-      await fetchOnce()
-      if (token !== pollToken) return
-      const d = data.value
-      const settled = (d.status === 'success' || d.status === 'error') && (d.updatedAt ?? null) !== since
-      if (!d.route || d.generates === false || settled) return
-      if (i < attempts - 1) await new Promise((resolve) => setTimeout(resolve, delayMs))
-    }
-  }
-
-  return { data, refresh, refreshUntilSettled }
-}

package/layers/admin/app/composables/useRailCollapsed.ts

@@ -1,14 +0,0 @@
-/**
- * Collapsed/expanded state for the admin navigation rail.
- * Backed by a cookie so the choice persists across reloads and stays SSR-safe
- * (no hydration mismatch — server and client read the same value).
- */
-export function useRailCollapsed() {
-  const collapsed = useCookie<boolean>('kestrel-rail-collapsed', { default: () => false })
-
-  function toggle() {
-    collapsed.value = !collapsed.value
-  }
-
-  return { collapsed, toggle }
-}

package/layers/admin/app/composables/useTheme.ts

@@ -1,36 +0,0 @@
-export type ThemeName = 'light' | 'dark'
-
-/**
- * The initial admin theme: an explicit stored choice wins; otherwise follow the OS
- * `prefers-color-scheme`; default to light. Pure so it can be unit-tested without a DOM.
- */
-export function resolveInitialTheme(opts: { stored?: string | null; prefersDark?: boolean }): ThemeName {
-  if (opts.stored === 'light' || opts.stored === 'dark') return opts.stored
-  return opts.prefersDark ? 'dark' : 'light'
-}
-
-/**
- * Admin colour theme (light/dark). The explicit choice is cookie-backed so it persists and is
- * SSR-safe (server and client read the same value — no hydration mismatch). Until a choice is made
- * the theme follows the OS preference, picked up client-side. The admin layout binds `theme` onto
- * `<html data-theme>`; `_tokens.scss` keys the palette off that attribute.
- */
-export function useTheme() {
-  const stored = useCookie<ThemeName | null>('kestrel-admin-theme', { default: () => null })
-  const prefersDark = ref(false)
-  let mq: MediaQueryList | null = null
-  const onChange = (e: MediaQueryListEvent) => { prefersDark.value = e.matches }
-
-  onMounted(() => {
-    mq = window.matchMedia('(prefers-color-scheme: dark)')
-    prefersDark.value = mq.matches
-    mq.addEventListener('change', onChange)
-  })
-  onUnmounted(() => mq?.removeEventListener('change', onChange))
-
-  const theme = computed<ThemeName>(() => resolveInitialTheme({ stored: stored.value, prefersDark: prefersDark.value }))
-  const setTheme = (t: ThemeName) => { stored.value = t }
-  const toggle = () => setTheme(theme.value === 'dark' ? 'light' : 'dark')
-
-  return { theme, toggle, setTheme }
-}

package/layers/admin/app/composables/useToolbarPanel.ts

@@ -1,38 +0,0 @@
-// Toolbar disclosure panels (filter / columns). Plain inline panels, not teleported, so they stay
-// testable and keep their scoped styles; a document listener closes them on an outside click.
-import { onBeforeUnmount, onMounted, ref } from 'vue'
-
-export function useToolbarPanel<T extends string>() {
-  const container = ref<HTMLElement | null>(null)
-  const open = ref<T | null>(null)
-  // The element that opened the current panel — Escape restores focus to it (otherwise closing the panel
-  // from inside drops keyboard focus onto <body>, stranding the keyboard user at the top of the document).
-  let trigger: HTMLElement | null = null
-
-  function toggle(which: T, e: MouseEvent) {
-    if (open.value === which) { open.value = null; return }
-    trigger = e.currentTarget as HTMLElement
-    open.value = which
-  }
-  function onDocPointer(e: PointerEvent) {
-    // Outside click: close but do NOT steal focus — it belongs wherever the user just clicked.
-    if (container.value && !container.value.contains(e.target as Node)) open.value = null
-  }
-  function onDocKeydown(e: KeyboardEvent) {
-    if (e.key === 'Escape' && open.value) {
-      open.value = null
-      trigger?.focus() // return focus to the trigger, per the disclosure/APG pattern
-    }
-  }
-
-  onMounted(() => {
-    document.addEventListener('pointerdown', onDocPointer)
-    document.addEventListener('keydown', onDocKeydown)
-  })
-  onBeforeUnmount(() => {
-    document.removeEventListener('pointerdown', onDocPointer)
-    document.removeEventListener('keydown', onDocKeydown)
-  })
-
-  return { container, open, toggle }
-}

package/layers/admin/app/composables/useUnsavedGuard.ts

@@ -1,22 +0,0 @@
-import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router'
-
-/**
- * Confirm before navigating away from unsaved editor changes. Registers BOTH route guards on purpose:
- * `onBeforeRouteLeave` fires when the matched route record is dropped (editor → list, rail nav), but
- * Vue Router fires `onBeforeRouteUpdate` instead when a param/query-only change reuses the SAME record —
- * which is exactly what the LocaleBar does (edit a sibling translation `/admin/{coll}/{id}`,
- * create-and-link `/admin/{coll}/new?…`, switch a singleton's `?locale`). Without the update guard those
- * same-record transitions silently discard in-progress edits (the `key: route.fullPath` remount only
- * happens AFTER the router has already committed the navigation, so it can't veto it).
- *
- * `isDirty` / `skip` / `message` are read lazily on each navigation so the guard always sees current
- * state. Returning `false` from a guard cancels the navigation; `skip()` lets a post-save / delete
- * redirect pass straight through.
- */
-export function useUnsavedGuard(isDirty: () => boolean, message: () => string, skip: () => boolean = () => false): void {
-  const guard = () => {
-    if (!skip() && isDirty() && !confirm(message())) return false
-  }
-  onBeforeRouteLeave(guard)
-  onBeforeRouteUpdate(guard)
-}