@glw907/cairn-cms 0.60.0 → 0.62.1

package/dist/components/HelpHome.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { HelpData } from '../sveltekit/content-routes.js';
+type $$ComponentProps = {
+    data: HelpData;
+};
+/**
+ * The Help home admin screen, the standing place an author comes to get their bearings and look up
+ * how things work. It renders inside `AdminLayout` (the office shell), so it carries no `data-theme`
+ * wrapper and imports no CSS: the layout owns the theme and `cairn-admin.css`, and this component
+ * consumes the Warm Stone tokens through its scoped `<style>` block.
+ *
+ * The content is one calm column: a masthead, then three co-equal eyebrow-plus-display sections.
+ *
+ * - Getting started reads `data.gettingStarted`, the count derived from the committed manifest and
+ *   the open edit branches (never a stored count). At 3 of 3 the whole section is omitted, never
+ *   shown as a done checklist. A per-device localStorage flag hides it on request.
+ * - Formatting renders `data.reference` (the everyday text and links rows) as a real semantic table.
+ * - Get help reads the optional `data.supportContact`. Unset is the canonical self-serve default,
+ *   with no control; set renders the hand-off shaped by the contact (email, URL, or a note).
+ */
+declare const HelpHome: import("svelte").Component<$$ComponentProps, {}, "">;
+type HelpHome = ReturnType<typeof HelpHome>;
+export default HelpHome;

package/dist/components/IconPicker.svelte

@@ -6,60 +6,30 @@ field is optional, a None radio clears the value. A roving tabindex keeps a sing
 keys move the selection, the standard radiogroup keyboard model. The glyph renders inline from the
 IconSet path data, matching the renderer's 256-unit viewBox.
 -->
-<script lang="ts">
-  import { tick } from 'svelte';
-  import type { IconSet } from '../render/glyph.js';
-
-  interface Props {
-    /** The site's glyph name to SVG path-data map. */
-    icons: IconSet;
-    /** The currently selected glyph name, or '' for none. */
-    value: string;
-    /** When false, a None choice is offered. */
-    required: boolean;
-    /** Called with the new glyph name (or '' for none). */
-    onChange: (name: string) => void;
-    /** The group's accessible name, threaded from the field label. Defaults to Icon. */
-    label?: string;
-  }
-
-  let { icons, value, required, onChange, label = 'Icon' }: Props = $props();
-
-  // The radiogroup container, used to move focus with the selection per the ARIA radiogroup pattern.
-  let group: HTMLDivElement;
-
-  const names = $derived(Object.keys(icons));
-  // The selectable keys in DOM order: the optional None choice ('') first, then each glyph name.
-  // Arrow-key navigation walks this list, and the roving tabindex marks the selected key (or the
-  // first key when nothing is selected) as the single tab stop.
-  const choices = $derived(required ? names : ['', ...names]);
-  const tabStop = $derived(choices.includes(value) ? value : choices[0]);
-
-  function move(delta: number): void {
-    // Navigate relative to the focused element (the current tab stop), not the bound value. In a
-    // required group with no value, tabStop is the first radio while value is '', so a value-based
-    // origin would skip the first step.
-    const from = Math.max(0, choices.indexOf(tabStop));
-    const next = (from + delta + choices.length) % choices.length;
-    onChange(choices[next]);
-    // The roving tabindex updates reactively, so wait for the DOM then move focus onto the new tab
-    // stop. The keydown handler runs only when focus is already inside the group, so this never
-    // steals focus on mount.
-    void tick().then(() => {
-      const target = group?.querySelector<HTMLElement>('[tabindex="0"]');
-      target?.focus();
-    });
-  }
-
-  function onKeydown(e: KeyboardEvent): void {
-    if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {
-      e.preventDefault();
-      move(1);
-    } else if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {
-      e.preventDefault();
-      move(-1);
-    }
+<script lang="ts">import { tick } from "svelte";
+let { icons, value, required, onChange, label = "Icon" } = $props();
+let group;
+const names = $derived(Object.keys(icons));
+const choices = $derived(required ? names : ["", ...names]);
+const tabStop = $derived(choices.includes(value) ? value : choices[0]);
+function move(delta) {
+  const from = Math.max(0, choices.indexOf(tabStop));
+  const next = (from + delta + choices.length) % choices.length;
+  onChange(choices[next]);
+  void tick().then(() => {
+    const target = group?.querySelector('[tabindex="0"]');
+    target?.focus();
+  });
+}
+function onKeydown(e) {
+  if (e.key === "ArrowRight" || e.key === "ArrowDown") {
+    e.preventDefault();
+    move(1);
+  } else if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
+    e.preventDefault();
+    move(-1);
   }
+}
 </script>
 
 <div class="flex flex-wrap gap-2" role="radiogroup" aria-label={label} bind:this={group}>

package/dist/components/LinkPicker.svelte

@@ -6,65 +6,41 @@ showing its date and each draft marked. Picking a target inserts a cairn: intern
 editor's registerInsertLink seam. Built on a native <dialog>, following the component dialog's a11y
 conventions. The plain-URL link is the toolbar's Web link dialog; this is for an internal target.
 -->
-<script lang="ts">
-  import type { LinkTarget } from '../content/manifest.js';
-  import { formatCairnToken } from '../content/links.js';
-
-  interface Props {
-    /** The site's link targets, from the committed manifest (editLoad ships them). */
-    linkTargets: LinkTarget[];
-    /** Insert an inline cairn link at the editor cursor. */
-    insert: (href: string, title: string) => void;
-    /** Disable the trigger; the host sets it while Preview shows. */
-    disabled?: boolean;
-    /** Render the built-in Link to page trigger. False mounts only the dialog, for a host that
-     *  supplies its own trigger and opens the dialog through the exported open(). */
-    trigger?: boolean;
-  }
-
-  let { linkTargets, insert, disabled = false, trigger = true }: Props = $props();
-
-  let dialog = $state<HTMLDialogElement | null>(null);
-  let query = $state('');
-
-  // Group filtered targets by concept, Pages first then Posts then any other concept, so the list
-  // reads in a stable order. The filter is a case-insensitive title substring.
-  const ORDER: Record<string, number> = { pages: 0, posts: 1 };
-  function rank(concept: string): number {
-    return ORDER[concept] ?? 2;
-  }
-  function heading(concept: string): string {
-    if (concept === 'pages') return 'Pages';
-    if (concept === 'posts') return 'Posts';
-    return concept.charAt(0).toUpperCase() + concept.slice(1);
-  }
-
-  const groups = $derived.by(() => {
-    const q = query.trim().toLowerCase();
-    const matched = q ? linkTargets.filter((t) => t.title.toLowerCase().includes(q)) : linkTargets;
-    const byConcept = new Map<string, LinkTarget[]>();
-    for (const t of matched) {
-      const list = byConcept.get(t.concept) ?? [];
-      list.push(t);
-      byConcept.set(t.concept, list);
-    }
-    return [...byConcept.entries()]
-      .map(([concept, items]) => ({ concept, heading: heading(concept), items }))
-      .sort((a, b) => rank(a.concept) - rank(b.concept) || a.heading.localeCompare(b.heading));
-  });
-
-  /** Open the picker programmatically, for a host that drives it without the trigger. */
-  export function open() {
-    query = '';
-    dialog?.showModal();
-  }
-  function close() {
-    dialog?.close();
-  }
-  function choose(target: LinkTarget) {
-    insert(formatCairnToken(target), target.title);
-    close();
+<script lang="ts">import { formatCairnToken } from "../content/links.js";
+let { linkTargets, insert, disabled = false, trigger = true } = $props();
+let dialog = $state(null);
+let query = $state("");
+const ORDER = { pages: 0, posts: 1 };
+function rank(concept) {
+  return ORDER[concept] ?? 2;
+}
+function heading(concept) {
+  if (concept === "pages") return "Pages";
+  if (concept === "posts") return "Posts";
+  return concept.charAt(0).toUpperCase() + concept.slice(1);
+}
+const groups = $derived.by(() => {
+  const q = query.trim().toLowerCase();
+  const matched = q ? linkTargets.filter((t) => t.title.toLowerCase().includes(q)) : linkTargets;
+  const byConcept = /* @__PURE__ */ new Map();
+  for (const t of matched) {
+    const list = byConcept.get(t.concept) ?? [];
+    list.push(t);
+    byConcept.set(t.concept, list);
   }
+  return [...byConcept.entries()].map(([concept, items]) => ({ concept, heading: heading(concept), items })).sort((a, b) => rank(a.concept) - rank(b.concept) || a.heading.localeCompare(b.heading));
+});
+export function open() {
+  query = "";
+  dialog?.showModal();
+}
+function close() {
+  dialog?.close();
+}
+function choose(target) {
+  insert(formatCairnToken(target), target.title);
+  close();
+}
 </script>
 
 {#if trigger}

package/dist/components/LoginPage.svelte

@@ -4,33 +4,20 @@ The magic-link sign-in page. A plain form POST to the named `?/request` action (
 `requestAction`); no client SDK. The success message is identical whether or not the email is on
 the allowlist, so the page never leaks membership (spec §7.1).
 -->
-<script lang="ts">
-  import './cairn-admin.css';
-  import { onMount } from 'svelte';
-  import MailCheckIcon from '@lucide/svelte/icons/mail-check';
-  import InfoIcon from '@lucide/svelte/icons/info';
-  import CairnLogo from './CairnLogo.svelte';
-  import CsrfField from './CsrfField.svelte';
-  import { cairnFaviconHref } from './cairn-favicon.js';
-  import { warnIfChromeWrapped } from './chrome-guard.js';
-
-  interface Props {
-    /** The login load's data: the site name, an optional error, and the CSRF token. */
-    data: { siteName: string; error: string | null; csrf: string };
-    /** The action result. `sent` is true once a request was accepted; `status` discriminates the
-     * neutral, send-error, and throttled outcomes. */
-    form: { sent?: boolean; status?: 'sent' | 'send_error' | 'throttled' } | null;
-  }
-
-  let { data, form }: Props = $props();
-
-  let rootEl = $state<HTMLElement>();
-  // Lets a mistyped address go back to the form without a reload, even though the server still
-  // reports `sent`. The success copy never reveals whether the email was on the allowlist.
-  let dismissed = $state(false);
-  onMount(() => {
-    if (rootEl) warnIfChromeWrapped(rootEl);
-  });
+<script lang="ts">import "./cairn-admin.css";
+import { onMount } from "svelte";
+import MailCheckIcon from "@lucide/svelte/icons/mail-check";
+import InfoIcon from "@lucide/svelte/icons/info";
+import CairnLogo from "./CairnLogo.svelte";
+import CsrfField from "./CsrfField.svelte";
+import { cairnFaviconHref } from "./cairn-favicon.js";
+import { warnIfChromeWrapped } from "./chrome-guard.js";
+let { data, form } = $props();
+let rootEl = $state();
+let dismissed = $state(false);
+onMount(() => {
+  if (rootEl) warnIfChromeWrapped(rootEl);
+});
 </script>
 
 <svelte:head>

package/dist/components/ManageEditors.svelte

@@ -6,21 +6,9 @@ last-owner anti-lockout rule itself is enforced server-side (editors-routes). Ac
 named `?/setRole`, `?/removeEditor`, and `?/addEditor` actions, the names the single-mount
 dispatcher defines.
 -->
-<script lang="ts">
-  import CsrfField from './CsrfField.svelte';
-  import type { Editor } from '../auth/types.js';
-
-  interface Props {
-    /** The editors load's data: the allowlist and the acting owner's email. */
-    data: { editors: Editor[]; self: string };
-    /** The last action's result (an error message when it failed). */
-    form: { error?: string; ok?: boolean } | null;
-  }
-
-  let { data, form }: Props = $props();
-
-  // Eyebrow styling for the table column headers, matching the concept list.
-  const col = 'text-[0.6875rem] font-semibold uppercase tracking-[0.08em] text-[var(--color-muted)]';
+<script lang="ts">import CsrfField from "./CsrfField.svelte";
+let { data, form } = $props();
+const col = "text-[0.6875rem] font-semibold uppercase tracking-[0.08em] text-[var(--color-muted)]";
 </script>
 
 <header class="mb-6">