@glw907/cairn-cms 0.59.0 → 0.60.1

package/dist/components/ConceptList.svelte

@@ -7,199 +7,119 @@ publish-state badge, and a delete action. A draft row de-emphasizes and carries
 tag by the title. A trailing New row at the foot of the card opens the same create dialog as the
 header button. Filtering, sorting, and paging run over the loaded entries in component state.
 -->
-<script lang="ts">
-  import { slugify } from '../content/ids.js';
-  import type { DeleteRefusal, EntrySummary, ListData } from '../sveltekit/content-routes.js';
-  import CsrfField from './CsrfField.svelte';
-  import DeleteDialog from './DeleteDialog.svelte';
-  import CairnLogo from './CairnLogo.svelte';
-  import { SearchIcon, ArrowUpIcon, ArrowDownIcon, ChevronsUpDownIcon, ChevronLeftIcon, ChevronRightIcon, PlusIcon, Trash2Icon } from './admin-icons.js';
-  import EyeOffIcon from '@lucide/svelte/icons/eye-off';
-
-  interface Props {
-    /** The list load's data: the concept, its entries, and any inline or form errors. */
-    data: ListData;
-    /** The `?/delete` action result. A blocked delete returns the `DeleteRefusal` payload (the
-     *  shared `error` summary, the refused entry id, and its inbound linkers), so the list names
-     *  the blockers and refuses (block-until-clean). */
-    form?: Partial<DeleteRefusal> | null;
-  }
-
-  let { data, form = null }: Props = $props();
-
-  // The entry a `?/delete` refused, and its inbound links, keyed by the posted id. Null when the
-  // last submit succeeded, refused nothing, or none ran.
-  const deleteRefused = $derived(
-    form?.inboundLinks?.length ? { id: form.id, inboundLinks: form.inboundLinks } : null,
-  );
-
-  type SortKey = 'title' | 'date';
-  // The triage runs on two independent axes. A pick-one publish-state partition (`all` passes
-  // everything, `pending` is new + edited, `published` is live-as-is) and a separate Hidden
-  // toggle that composes with it. They are orthogonal: a published-but-hidden entry is on main
-  // (so it counts as Published) and also hidden from the public site (so it counts as Hidden).
-  type Partition = 'all' | 'pending' | 'published';
-  let query = $state('');
-  let partition = $state<Partition>('all');
-  let hiddenOnly = $state(false);
-  let sortKey = $state<SortKey>('date');
-  // Newest first by default: a dated concept reads most-recent-on-top, the usual CMS convention.
-  let sortAsc = $state(false);
-  let pageSize = $state(10);
-  let page = $state(1);
-
-  const dateFmt = new Intl.DateTimeFormat(undefined, { year: 'numeric', month: 'short', day: 'numeric' });
-  function formatDate(iso: string | null): string {
-    if (!iso) return '';
-    const parsed = new Date(`${iso}T00:00:00`);
-    return Number.isNaN(parsed.getTime()) ? iso : dateFmt.format(parsed);
-  }
-
-  // Triage counts over the full loaded set, each axis counted independently. Pending is new +
-  // edited (status !== 'published'); Published is live-as-is (status === 'published'); Hidden is
-  // the draft rows. The axes overlap: a published-but-hidden entry counts in BOTH Published and
-  // Hidden. All is the unconditional total.
-  const counts = $derived({
-    all: data.entries.length,
-    pending: data.entries.filter((e) => e.status !== 'published').length,
-    published: data.entries.filter((e) => e.status === 'published').length,
-    hidden: data.entries.filter((e) => e.draft).length,
-  });
-
-  // The three publish-state segments, in display order. Each names its partition value, its label,
-  // and the count axis it shows; the markup loops this so the segments share one block.
-  const segments: { value: Partition; label: string; count: () => number }[] = [
-    { value: 'all', label: 'All', count: () => counts.all },
-    { value: 'pending', label: 'Pending edits', count: () => counts.pending },
-    { value: 'published', label: 'Published', count: () => counts.published },
-  ];
-
-  function matchesPartition(entry: EntrySummary): boolean {
-    switch (partition) {
-      case 'pending':
-        return entry.status !== 'published';
-      case 'published':
-        return entry.status === 'published';
-      default:
-        return true;
-    }
-  }
-
-  // Compose the partition and the Hidden axis with the search query; sort and paging run
-  // downstream. Hidden is orthogonal: when on, it narrows the partition to its draft rows.
-  const filtered = $derived(
-    data.entries.filter(
-      (e) =>
-        matchesPartition(e) &&
-        (!hiddenOnly || e.draft === true) &&
-        e.title.toLowerCase().includes(query.trim().toLowerCase()),
-    ),
-  );
-
-  function setPartition(next: Partition) {
-    partition = next;
-    page = 1;
-  }
-
-  function toggleHidden() {
-    hiddenOnly = !hiddenOnly;
-    page = 1;
+<script lang="ts">import { slugify } from "../content/ids.js";
+import CsrfField from "./CsrfField.svelte";
+import DeleteDialog from "./DeleteDialog.svelte";
+import CairnLogo from "./CairnLogo.svelte";
+import { SearchIcon, ArrowUpIcon, ArrowDownIcon, ChevronsUpDownIcon, ChevronLeftIcon, ChevronRightIcon, PlusIcon, Trash2Icon } from "./admin-icons.js";
+import EyeOffIcon from "@lucide/svelte/icons/eye-off";
+let { data, form = null } = $props();
+const deleteRefused = $derived(
+  form?.inboundLinks?.length ? { id: form.id, inboundLinks: form.inboundLinks } : null
+);
+let query = $state("");
+let partition = $state("all");
+let hiddenOnly = $state(false);
+let sortKey = $state("date");
+let sortAsc = $state(false);
+let pageSize = $state(10);
+let page = $state(1);
+const dateFmt = new Intl.DateTimeFormat(void 0, { year: "numeric", month: "short", day: "numeric" });
+function formatDate(iso) {
+  if (!iso) return "";
+  const parsed = /* @__PURE__ */ new Date(`${iso}T00:00:00`);
+  return Number.isNaN(parsed.getTime()) ? iso : dateFmt.format(parsed);
+}
+const counts = $derived({
+  all: data.entries.length,
+  pending: data.entries.filter((e) => e.status !== "published").length,
+  published: data.entries.filter((e) => e.status === "published").length,
+  hidden: data.entries.filter((e) => e.draft).length
+});
+const segments = [
+  { value: "all", label: "All", count: () => counts.all },
+  { value: "pending", label: "Pending edits", count: () => counts.pending },
+  { value: "published", label: "Published", count: () => counts.published }
+];
+function matchesPartition(entry) {
+  switch (partition) {
+    case "pending":
+      return entry.status !== "published";
+    case "published":
+      return entry.status === "published";
+    default:
+      return true;
   }
-
-  function clearSearch() {
-    query = '';
-    page = 1;
-  }
-
-  // The triage controls dress to the established footer grammar (the design system's segmented /
-  // check-and-tint recipe). Each helper returns a verbatim Tailwind string so the admin CSS
-  // build's @source scan reads the utilities whole. The scoped button reset (cairn-admin.css)
-  // already strips UA chrome from these bare buttons.
-  //
-  // A segment of the bordered publish-state control: the shared group border carries the pick-one
-  // semantics, so a segment stays borderless; the active one tints and bolds.
-  function segButtonClass(pressed: boolean): string {
-    return `inline-flex items-center gap-1.5 px-3 py-1 text-[0.8125rem] font-normal ${pressed ? 'bg-primary/10 text-primary font-medium' : 'text-[var(--color-muted)]'}`;
-  }
-  // The standalone Hidden toggle: rounded, transparent until hover, check-and-tint when pressed.
-  function hiddenToggleClass(pressed: boolean): string {
-    return `inline-flex items-center gap-1.5 rounded-lg px-3 py-1 text-[0.8125rem] font-normal hover:bg-base-content/[0.06] ${pressed ? 'bg-primary/10 text-primary font-medium' : 'text-[var(--color-muted)]'}`;
-  }
-  // Hidden is a row treatment: a draft row de-emphasizes its TITLE by opacity (the title is
-  // high-contrast base-content, so it stays above the AA text floor when dimmed). The already-muted
-  // summary line is left at full strength: stacking opacity on muted text drops it below 4.5:1 in
-  // the light theme, so the dimmed title plus the eye-off tag carry the "hidden" read instead.
-  const draftDim = 'opacity-[0.62]';
-
-  // Sort key for one entry: the lowercased title, or the ISO date string (lexical order is
-  // chronological). A null date sorts as the empty string.
-  function sortValue(entry: EntrySummary): string {
-    if (sortKey === 'title') return entry.title.toLowerCase();
-    return entry.date ?? '';
-  }
-
-  // Codepoint compare, matching the prior `<`/`>` ordering exactly. Avoids localeCompare so the
-  // order stays identical to before this refactor.
-  function compareStrings(a: string, b: string): number {
-    if (a < b) return -1;
-    if (a > b) return 1;
-    return 0;
+}
+const filtered = $derived(
+  data.entries.filter(
+    (e) => matchesPartition(e) && (!hiddenOnly || e.draft === true) && e.title.toLowerCase().includes(query.trim().toLowerCase())
+  )
+);
+function setPartition(next) {
+  partition = next;
+  page = 1;
+}
+function toggleHidden() {
+  hiddenOnly = !hiddenOnly;
+  page = 1;
+}
+function clearSearch() {
+  query = "";
+  page = 1;
+}
+function segButtonClass(pressed) {
+  return `inline-flex items-center gap-1.5 px-3 py-1 text-[0.8125rem] font-normal ${pressed ? "bg-primary/10 text-primary font-medium" : "text-[var(--color-muted)]"}`;
+}
+function hiddenToggleClass(pressed) {
+  return `inline-flex items-center gap-1.5 rounded-lg px-3 py-1 text-[0.8125rem] font-normal hover:bg-base-content/[0.06] ${pressed ? "bg-primary/10 text-primary font-medium" : "text-[var(--color-muted)]"}`;
+}
+const draftDim = "opacity-[0.62]";
+function sortValue(entry) {
+  if (sortKey === "title") return entry.title.toLowerCase();
+  return entry.date ?? "";
+}
+function compareStrings(a, b) {
+  if (a < b) return -1;
+  if (a > b) return 1;
+  return 0;
+}
+const sorted = $derived(
+  [...filtered].sort((a, b) => {
+    const cmp = compareStrings(sortValue(a), sortValue(b));
+    return sortAsc ? cmp : -cmp;
+  })
+);
+const pageCount = $derived(Math.max(1, Math.ceil(sorted.length / pageSize)));
+$effect(() => {
+  if (page > pageCount) page = pageCount;
+});
+const pageRows = $derived(sorted.slice((page - 1) * pageSize, page * pageSize));
+function toggleSort(key) {
+  if (sortKey === key) sortAsc = !sortAsc;
+  else {
+    sortKey = key;
+    sortAsc = true;
   }
-
-  const sorted = $derived(
-    [...filtered].sort((a, b) => {
-      const cmp = compareStrings(sortValue(a), sortValue(b));
-      return sortAsc ? cmp : -cmp;
-    }),
-  );
-
-  const pageCount = $derived(Math.max(1, Math.ceil(sorted.length / pageSize)));
-  // Clamp the page when filtering shrinks the result set below the current page.
-  $effect(() => {
-    if (page > pageCount) page = pageCount;
-  });
-  const pageRows = $derived(sorted.slice((page - 1) * pageSize, page * pageSize));
-
-  function toggleSort(key: SortKey) {
-    if (sortKey === key) sortAsc = !sortAsc;
-    else {
-      sortKey = key;
-      sortAsc = true;
-    }
-    page = 1;
-  }
-
-  // --- create form state, shown in a header-triggered dialog ---
-  let createDialog = $state<HTMLDialogElement>();
-  // Pending from submit until the create navigation lands, so the button shows a calm working state.
-  let creating = $state(false);
-  let title = $state('');
-  let slug = $state('');
-  let slugEdited = $state(false);
-  // Default the date client-side so the SSR pass and hydration agree across UTC midnight.
-  let dateDefault = $state('');
-  $effect(() => {
-    dateDefault = new Date().toISOString().slice(0, 10);
-  });
-  const derivedSlug = $derived(slugEdited ? slug : slugify(title));
-  const slugPlaceholder = $derived(data.dated ? 'my-entry' : 'about-us');
-  // The create affordances name one new item, so they read in the singular ("New post"). The
-  // descriptor resolves `singular` (defaulting it to the label), so the fallback here only guards an
-  // older caller that ships no `singular` on its ListData.
-  const createNoun = $derived(data.singular ?? data.label);
-
-  // Shared column-header typography: small uppercase muted labels. The sort buttons add their own
-  // flex layout and a hover affordance on top of this.
-  const headerLabel = 'text-[0.6875rem] font-semibold uppercase tracking-[0.08em] text-[var(--color-muted)]';
-  const sortButton = `inline-flex items-center gap-1 ${headerLabel} hover:text-base-content`;
-
-  // The publish-all flash. A racing second admin can publish first, leaving this redirect
-  // counting zero; say nothing then.
-  const publishedAllMessage = $derived(
-    data.publishedAll !== null && data.publishedAll > 0
-      ? `Published ${data.publishedAll} ${data.publishedAll === 1 ? 'entry' : 'entries'}.`
-      : '',
-  );
+  page = 1;
+}
+let createDialog = $state();
+let creating = $state(false);
+let title = $state("");
+let slug = $state("");
+let slugEdited = $state(false);
+let dateDefault = $state("");
+$effect(() => {
+  dateDefault = (/* @__PURE__ */ new Date()).toISOString().slice(0, 10);
+});
+const derivedSlug = $derived(slugEdited ? slug : slugify(title));
+const slugPlaceholder = $derived(data.dated ? "my-entry" : "about-us");
+const createNoun = $derived(data.singular ?? data.label);
+const headerLabel = "text-[0.6875rem] font-semibold uppercase tracking-[0.08em] text-[var(--color-muted)]";
+const sortButton = `inline-flex items-center gap-1 ${headerLabel} hover:text-base-content`;
+const publishedAllMessage = $derived(
+  data.publishedAll !== null && data.publishedAll > 0 ? `Published ${data.publishedAll} ${data.publishedAll === 1 ? "entry" : "entries"}.` : ""
+);
 </script>
 
 <!-- The non-color selected cue for the triage controls (WCAG 1.4.1): a small check glyph that

package/dist/components/ConfirmPage.svelte

@@ -3,18 +3,11 @@
 The scanner-safe confirm page. A GET renders this static "Confirm sign-in" button with the token
 in a hidden field and consumes nothing; only the explicit POST verifies (spec §7.1). JS-free.
 -->
-<script lang="ts">
-  import './cairn-admin.css';
-  import CairnLogo from './CairnLogo.svelte';
-  import CsrfField from './CsrfField.svelte';
-  import { cairnFaviconHref } from './cairn-favicon.js';
-
-  interface Props {
-    /** The confirm load's data: the token to submit, the site name, an optional error, the CSRF token. */
-    data: { token: string; siteName: string; error: string | null; csrf: string };
-  }
-
-  let { data }: Props = $props();
+<script lang="ts">import "./cairn-admin.css";
+import CairnLogo from "./CairnLogo.svelte";
+import CsrfField from "./CsrfField.svelte";
+import { cairnFaviconHref } from "./cairn-favicon.js";
+let { data } = $props();
 </script>
 
 <svelte:head>

package/dist/components/CsrfField.svelte

@@ -4,17 +4,11 @@ A hidden CSRF double-submit field for an admin form. Pass `token` directly (the
 or omit it inside the authed shell, where AdminLayout provides the token through context. A form that
 omits this field fails the guard's token check, which is the intended fail-closed signal.
 -->
-<script lang="ts">
-  import { getContext } from 'svelte';
-  import { CSRF_CONTEXT_KEY } from './csrf-context.js';
-
-  interface Props {
-    /** The CSRF token. Falls back to the admin context when omitted. */
-    token?: string;
-  }
-  let { token }: Props = $props();
-  const fromContext = getContext<(() => string) | undefined>(CSRF_CONTEXT_KEY);
-  const value = $derived(token ?? fromContext?.() ?? '');
+<script lang="ts">import { getContext } from "svelte";
+import { CSRF_CONTEXT_KEY } from "./csrf-context.js";
+let { token } = $props();
+const fromContext = getContext(CSRF_CONTEXT_KEY);
+const value = $derived(token ?? fromContext?.() ?? "");
 </script>
 
 <input type="hidden" name="csrf" value={value} />

package/dist/components/DeleteDialog.svelte

@@ -5,48 +5,21 @@ The Delete control and its modal. With no inbound links it is a plain confirm th
 each linking to its edit page, so the author repoints or removes those links first. Built on a native
 <dialog>, following the LinkPicker a11y conventions.
 -->
-<script lang="ts">
-  import CsrfField from './CsrfField.svelte';
-  import type { InboundLink } from '../content/manifest.js';
-
-  interface Props {
-    /** The concept this entry belongs to, e.g. "posts". Posted with the confirm. */
-    conceptId: string;
-    /** The entry id within its concept. Posted with the confirm. */
-    id: string;
-    /** A human label for the concept, e.g. "Post", used in the prompts. */
-    label: string;
-    /** The entries that link to this one; non-empty blocks the delete. */
-    inboundLinks: InboundLink[];
-    /** True when the entry has unpublished edits, which the delete discards along with it. */
-    pending?: boolean;
-    /** Render the built-in Delete trigger. False mounts only the dialog, for a host that supplies
-     *  its own trigger and opens the dialog through the exported open(). */
-    trigger?: boolean;
-    /** Called when the delete confirm submits, before the document navigates. The edit page uses
-     *  it to stand down its leave guard while the POST is in flight. */
-    onsubmitting?: () => void;
-  }
-
-  let { conceptId, id, label, inboundLinks, pending = false, trigger = true, onsubmitting }: Props = $props();
-
-  let dialog = $state<HTMLDialogElement | null>(null);
-  const blocked = $derived(inboundLinks.length > 0);
-  const noun = $derived(label.toLowerCase());
-  // One inbound link reads "1 post links here ... repoint it"; many reads "2 posts link here ...
-  // repoint them". The subject-verb agreement inverts the usual plural-s, so derive each form once.
-  const single = $derived(inboundLinks.length === 1);
-  const nouns = $derived(single ? noun : `${noun}s`);
-  const verb = $derived(single ? 'links' : 'link');
-  const pronoun = $derived(single ? 'it' : 'them');
-
-  /** Open the confirm. Exported so a trigger={false} host can drive the dialog itself. */
-  export function open() {
-    dialog?.showModal();
-  }
-  function close() {
-    dialog?.close();
-  }
+<script lang="ts">import CsrfField from "./CsrfField.svelte";
+let { conceptId, id, label, inboundLinks, pending = false, trigger = true, onsubmitting } = $props();
+let dialog = $state(null);
+const blocked = $derived(inboundLinks.length > 0);
+const noun = $derived(label.toLowerCase());
+const single = $derived(inboundLinks.length === 1);
+const nouns = $derived(single ? noun : `${noun}s`);
+const verb = $derived(single ? "links" : "link");
+const pronoun = $derived(single ? "it" : "them");
+export function open() {
+  dialog?.showModal();
+}
+function close() {
+  dialog?.close();
+}
 </script>
 
 {#if trigger}