@poodle64/librarian 2026.10.3 → 2026.10.5

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

@@ -2,8 +2,10 @@ import type { Snippet } from 'svelte';
 import type { DescribeTool, Turn } from '../../transcript.svelte';
 import type { Verdict } from '../../chat.svelte';
 import type { Citation, LoadDocument } from '../../citations';
+import { type LoadWritten, type WrittenUrl } from '../../written';
 import { type ChatCopy } from '../../copy';
 import { type AgentTranscriptProps } from '../agent-transcript/agent-transcript.svelte';
+import type { Visual } from '../../visuals';
 interface Props {
     turns: Turn[];
     running: boolean;
@@ -56,6 +58,19 @@ interface Props {
     showing?: string;
     /** The persona's own words for its tools, and what they read. */
     describeTool?: DescribeTool;
+    /** Replaces the question at `position` (its place among `turns`) with
+     *  `text` and asks it again from there (`Chat.edit`). Offered on every
+     *  plain question while no answer is being written; without it no turn
+     *  can be edited. */
+    onedit?: (position: number, text: string) => Promise<boolean>;
+    /** Reads one version of a document the persona wrote, to show it in the
+     *  column. Without it its cards link but do not open. */
+    loadWritten?: LoadWritten;
+    /** Where a version downloads. Without it no download links render. */
+    writtenUrl?: WrittenUrl;
+    /** Renderers by a fence's language (`defaultVisuals`, and the app's own):
+     *  a block of one is drawn by its component rather than as code. */
+    visuals?: Record<string, Visual>;
     /** Prices a turn's `outcome.costUsd` in the host's own currency and
      *  words ("about A$0.34"), for the footer's cost line beside a turn's
      *  duration. The package never converts currency itself; omitted, the

package/dist/components/markdown/markdown.d.ts

@@ -17,8 +17,13 @@
  */
 /** Close anything the stream has opened but not yet finished. */
 export declare function balance(markdown: string): string;
-export declare function render(markdown: string, { streaming }?: {
-    streaming?: boolean | undefined;
+/**
+ * `markdown` as sanitised HTML. With `previous`, the version before it, each
+ * block it changed is marked on the sanitised DOM, before its one serialisation.
+ */
+export declare function render(markdown: string, { streaming, previous }?: {
+    streaming?: boolean;
+    previous?: string;
 }): string;
 /**
  * Mark every inline `code` span that names a known collection.
@@ -42,6 +47,29 @@ export declare function markCollections(root: HTMLElement, collections: Set<stri
  * button ROLE and a tab stop, and the component delegates the events.
  */
 export declare function markCitations(root: HTMLElement, valid: Set<number>): void;
+/** A turn's prose and the fenced blocks of a registered language, in order. */
+export type Part = {
+    kind: 'md';
+    text: string;
+} | {
+    kind: 'visual';
+    lang: string;
+    source: string;
+    closed: boolean;
+};
+/**
+ * Cut `markdown` at each fenced block whose language `has` a renderer for.
+ * A fence of another language (or none) is ordinary code and stays in the
+ * prose, and so does anything inside one: an example of a visual's fence in a
+ * code block is text. A block still open at the end is `closed: false`.
+ */
+export declare function splitVisuals(markdown: string, has: (lang: string) => boolean): Part[];
+/**
+ * Turn each link to a numbered web page into its citation chip: the link's
+ * text stays, unlinked, and the chip after it carries the page's number and
+ * opens the page. Against the rendered DOM, for the reason `markCitations` is.
+ */
+export declare function markWebLinks(root: HTMLElement, numbers: Map<string, number>): void;
 /**
  * Replace every `<pre><code>` in a rendered fragment with a highlighted one.
  * Runs against the DOM node rather than the HTML string so it can be applied

package/dist/components/markdown/markdown.js

@@ -17,6 +17,8 @@
  */
 import DOMPurify from 'isomorphic-dompurify';
 import { marked } from 'marked';
+import { markChanges } from '../../diff';
+import { webKey } from '../../web-sources';
 marked.setOptions({ gfm: true, breaks: false });
 /** Close anything the stream has opened but not yet finished. */
 export function balance(markdown) {
@@ -35,14 +37,60 @@ export function balance(markdown) {
     }
     return text;
 }
-export function render(markdown, { streaming = false } = {}) {
-    const source = streaming ? balance(markdown) : markdown;
-    const html = marked.parse(source, { async: false });
-    return DOMPurify.sanitize(html, {
+const FETCHERS = 'img, picture, source, video, audio, track, iframe, object, embed, link, style, image, use';
+const URL_ATTRS = ['src', 'href', 'xlink:href', 'poster', 'data', 'srcset'];
+/** Only what cannot leave the origin: a data URL, a same-origin path, a fragment. */
+function stays(url) {
+    const u = url.trim();
+    return /^data:/i.test(u) || (u.startsWith('/') && !u.startsWith('//')) || u.startsWith('#');
+}
+/**
+ * A rendered answer must not fetch from anywhere: a remote image or url() in
+ * agent output is a beacon that carries the conversation out in its query.
+ * A remote image degrades to its alt text (or its address as a link).
+ */
+function dropFetchers(root) {
+    for (const el of root.querySelectorAll(FETCHERS)) {
+        const urls = URL_ATTRS.map((a) => el.getAttribute(a)).filter((v) => v !== null);
+        if (urls.every(stays))
+            continue;
+        if (el.tagName === 'IMG') {
+            const alt = el.getAttribute('alt')?.trim();
+            const src = el.getAttribute('src')?.trim() ?? '';
+            if (alt)
+                el.replaceWith(root.ownerDocument.createTextNode(alt));
+            else if (/^https?:\/\//i.test(src)) {
+                const a = root.ownerDocument.createElement('a');
+                a.setAttribute('href', src);
+                a.textContent = src;
+                el.replaceWith(a);
+            }
+            else
+                el.remove();
+        }
+        else
+            el.remove();
+    }
+}
+/**
+ * `markdown` as sanitised HTML. With `previous`, the version before it, each
+ * block it changed is marked on the sanitised DOM, before its one serialisation.
+ */
+export function render(markdown, { streaming = false, previous } = {}) {
+    const body = sanitised(streaming ? balance(markdown) : markdown);
+    if (previous !== undefined && !streaming)
+        markChanges(body, sanitised(previous));
+    return body.innerHTML;
+}
+function sanitised(source) {
+    const body = DOMPurify.sanitize(marked.parse(source, { async: false }), {
         ADD_ATTR: ['target', 'rel', 'data-cite', 'tabindex', 'role'],
         FORBID_TAGS: ['style', 'form', 'input', 'button'],
-        FORBID_ATTR: ['style', 'onerror', 'onload']
+        FORBID_ATTR: ['style', 'srcset', 'onerror', 'onload'],
+        RETURN_DOM: true
     });
+    dropFetchers(body);
+    return body;
 }
 let highlighterPromise = null;
 /** Loaded once, lazily — shiki's engine and grammars are not small. */
@@ -137,6 +185,95 @@ export function markCitations(root, valid) {
         text.replaceWith(fragment);
     }
 }
+const OPEN = /^ {0,3}(`{3,}|~{3,})[ \t]*([^\s`]*)[^`]*$/;
+const CLOSE = /^ {0,3}(`{3,}|~{3,})[ \t]*$/;
+/**
+ * Cut `markdown` at each fenced block whose language `has` a renderer for.
+ * A fence of another language (or none) is ordinary code and stays in the
+ * prose, and so does anything inside one: an example of a visual's fence in a
+ * code block is text. A block still open at the end is `closed: false`.
+ */
+export function splitVisuals(markdown, has) {
+    const parts = [];
+    let prose = [];
+    let code = null;
+    const flush = () => {
+        if (prose.join('').trim())
+            parts.push({ kind: 'md', text: prose.join('\n') });
+        prose = [];
+    };
+    for (const line of markdown.split('\n')) {
+        if (code) {
+            const close = CLOSE.exec(line);
+            if (close && close[1][0] === code.fence[0] && close[1].length >= code.fence.length) {
+                if (code.visual) {
+                    parts.push({
+                        kind: 'visual',
+                        lang: code.visual.lang,
+                        source: code.visual.lines.join('\n'),
+                        closed: true
+                    });
+                }
+                else
+                    prose.push(line);
+                code = null;
+            }
+            else if (code.visual)
+                code.visual.lines.push(line);
+            else
+                prose.push(line);
+            continue;
+        }
+        const open = OPEN.exec(line);
+        if (open) {
+            const lang = open[2];
+            if (lang && has(lang)) {
+                flush();
+                code = { fence: open[1], visual: { lang, lines: [] } };
+            }
+            else {
+                code = { fence: open[1] };
+                prose.push(line);
+            }
+            continue;
+        }
+        prose.push(line);
+    }
+    if (code?.visual)
+        parts.push({
+            kind: 'visual',
+            lang: code.visual.lang,
+            source: code.visual.lines.join('\n'),
+            closed: false
+        });
+    else
+        flush();
+    return parts;
+}
+/**
+ * Turn each link to a numbered web page into its citation chip: the link's
+ * text stays, unlinked, and the chip after it carries the page's number and
+ * opens the page. Against the rendered DOM, for the reason `markCitations` is.
+ */
+export function markWebLinks(root, numbers) {
+    if (numbers.size === 0)
+        return;
+    for (const link of root.querySelectorAll('a[href]')) {
+        const href = link.getAttribute('href') ?? '';
+        const n = numbers.get(webKey(href));
+        if (n === undefined)
+            continue;
+        const chip = document.createElement('sup');
+        chip.className = 'ds-cite';
+        chip.dataset.cite = String(n);
+        chip.dataset.web = href;
+        chip.setAttribute('role', 'button');
+        chip.setAttribute('tabindex', '0');
+        chip.setAttribute('aria-label', `Web page ${n}`);
+        chip.textContent = String(n);
+        link.replaceWith(...link.childNodes, chip);
+    }
+}
 /**
  * Replace every `<pre><code>` in a rendered fragment with a highlighted one.
  * Runs against the DOM node rather than the HTML string so it can be applied

package/dist/components/markdown/markdown.svelte

@@ -7,7 +7,17 @@
   consuming app.
 -->
 <script lang="ts">
-	import { highlight, markCitations, markCollections, render } from './markdown';
+	import { resolveCopy, type ChatCopy } from '../../copy';
+	import type { Visual } from '../../visuals';
+	import VisualBlock from '../visual-block/visual-block.svelte';
+	import {
+		highlight,
+		markCitations,
+		markCollections,
+		markWebLinks,
+		render,
+		splitVisuals
+	} from './markdown';
 
 	interface Props {
 		content: string;
@@ -16,10 +26,20 @@
 		collectionNames?: Set<string>;
 		/** `[n]` markers to turn into chips; omit and the markers stay as text. */
 		citationNumbers?: Set<number>;
+		/** Web pages by `webKey`, numbered after the library's: a link to one
+		 *  renders as its chip. */
+		webNumbers?: Map<string, number>;
 		oncite?: (n: number) => void;
 		/** A step down, for prose that is reference material beside an answer
 		 *  rather than the answer itself — the source pane's sections. */
 		dense?: boolean;
+		/** Renderers by a fence's language: a block of one is drawn by its
+		 *  component in place of the code. Absent, every fence is code. */
+		visuals?: Record<string, Visual>;
+		/** The same document's earlier version, as Markdown: what differs here
+		 *  is marked with a bar. */
+		previous?: string;
+		copy?: Partial<ChatCopy>;
 	}
 
 	let {
@@ -27,43 +47,68 @@
 		streaming = false,
 		collectionNames = new Set(),
 		citationNumbers = new Set(),
+		webNumbers = new Map(),
 		oncite,
-		dense = false
+		dense = false,
+		visuals,
+		previous,
+		copy
 	}: Props = $props();
 	let host = $state<HTMLElement | null>(null);
 
-	const html = $derived(render(content, { streaming }));
+	const words = $derived(resolveCopy(copy));
+
+	// A visual is its own component between chunks of prose, so a token that
+	// grows the last chunk leaves the charts above it standing.
+	const parts = $derived(
+		visuals
+			? splitVisuals(content, (lang) => Object.hasOwn(visuals, lang))
+			: [{ kind: 'md' as const, text: content }]
+	);
+	const chunked = $derived(parts.some((part) => part.kind === 'visual'));
+	const lastPart = $derived(parts.length - 1);
+
+	const prose = (text: string, last: boolean): string => render(text, { streaming: streaming && last, previous });
 
 	// Highlight only once the text has settled. Re-running per token would
 	// re-parse grammars for a block that changes again milliseconds later.
 	$effect(() => {
-		if (!host || !html) return;
+		void parts;
+		if (!host) return;
 		// Chips are cheap and wanted DURING streaming; highlighting is not.
 		markCollections(host, collectionNames);
 		markCitations(host, citationNumbers);
+		markWebLinks(host, webNumbers);
 		if (streaming) return;
 		void highlight(host);
 	});
 
 	// Delegated, because the chips are created by the sanitiser's output rather
 	// than by this template — there is no element here to put a handler on.
-	function citeFrom(target: EventTarget | null): number | null {
-		const chip = (target as HTMLElement | null)?.closest?.('[data-cite]');
-		const n = Number((chip as HTMLElement | undefined)?.dataset.cite);
-		return Number.isFinite(n) && n > 0 ? n : null;
+	function chipOf(target: EventTarget | null): HTMLElement | null {
+		return ((target as HTMLElement | null)?.closest?.('[data-cite]') as HTMLElement | null) ?? null;
+	}
+
+	function press(chip: HTMLElement) {
+		if (chip.dataset.web) {
+			window.open(chip.dataset.web, '_blank', 'noopener,noreferrer');
+			return;
+		}
+		const n = Number(chip.dataset.cite);
+		if (Number.isFinite(n) && n > 0) oncite?.(n);
 	}
 
 	function click(event: MouseEvent) {
-		const n = citeFrom(event.target);
-		if (n !== null) oncite?.(n);
+		const chip = chipOf(event.target);
+		if (chip) press(chip);
 	}
 
 	function keydown(event: KeyboardEvent) {
 		if (event.key !== 'Enter' && event.key !== ' ') return;
-		const n = citeFrom(event.target);
-		if (n === null) return;
+		const chip = chipOf(event.target);
+		if (!chip) return;
 		event.preventDefault();
-		oncite?.(n);
+		press(chip);
 	}
 </script>
 
@@ -77,9 +122,30 @@
 	class="agent-prose"
 	class:is-dense={dense}
 	class:is-streaming={streaming}
+	class:is-chunked={chunked}
 >
-	<!-- eslint-disable-next-line svelte/no-at-html-tags -- sanitised in render() -->
-	{@html html}
+	{#if !chunked}
+		<!-- eslint-disable-next-line svelte/no-at-html-tags -- sanitised in render() -->
+		{@html prose(content, true)}
+	{:else}
+		{#each parts as part, i (i)}
+			{#if part.kind === 'md'}
+				<div class="ds-lib-chunk">
+					<!-- eslint-disable-next-line svelte/no-at-html-tags -- sanitised in render() -->
+					{@html prose(part.text, i === lastPart)}
+				</div>
+			{:else if visuals}
+				<VisualBlock
+					lang={part.lang}
+					visual={visuals[part.lang]}
+					source={part.source}
+					closed={part.closed}
+					{streaming}
+					{words}
+				/>
+			{/if}
+		{/each}
+	{/if}
 </div>
 
 <style>
@@ -111,6 +177,31 @@
 		animation: ds-lib-caret 1.1s steps(1, end) infinite;
 	}
 
+	/* Chunked, the caret rides the last prose chunk's last block, not the chunk. */
+	.agent-prose.is-chunked.is-streaming :global(> .ds-lib-chunk:last-child::after) {
+		content: none;
+	}
+
+	.agent-prose.is-chunked.is-streaming :global(> .ds-lib-chunk:last-child > *:last-child::after) {
+		content: '';
+		display: inline-block;
+		width: 0.45em;
+		height: 1.05em;
+		margin-inline-start: 0.12em;
+		border-radius: 1px;
+		background: var(--ds-color-primary);
+		vertical-align: -0.15em;
+		animation: ds-lib-caret 1.1s steps(1, end) infinite;
+	}
+
+	.agent-prose :global(.ds-lib-chunk > *:first-child) {
+		margin-top: 0;
+	}
+
+	.agent-prose :global(.ds-lib-chunk > *:last-child) {
+		margin-bottom: 0;
+	}
+
 	@keyframes ds-lib-caret {
 		50% {
 			opacity: 0;
@@ -118,7 +209,8 @@
 	}
 
 	@media (prefers-reduced-motion: reduce) {
-		.agent-prose.is-streaming :global(> *:last-child::after) {
+		.agent-prose.is-streaming :global(> *:last-child::after),
+		.agent-prose.is-chunked.is-streaming :global(> .ds-lib-chunk:last-child > *:last-child::after) {
 			animation: none;
 		}
 	}
@@ -354,6 +446,28 @@
 		outline-offset: 2px;
 	}
 
+	/* What this version changed: a bar in the margin beside the block. */
+	.agent-prose :global([data-changed]) {
+		position: relative;
+	}
+
+	.agent-prose :global([data-changed]::before) {
+		content: '';
+		position: absolute;
+		inset-block: 0;
+		inset-inline-start: -0.75rem;
+		width: 2px;
+		background: var(--ds-color-foreground);
+	}
+
+	.agent-prose :global(tr[data-changed]::before) {
+		content: none;
+	}
+
+	.agent-prose :global(tr[data-changed] > td:first-child) {
+		box-shadow: inset 2px 0 0 var(--ds-color-foreground);
+	}
+
 	.agent-prose :global(hr) {
 		border: 0;
 		border-top: 1px solid var(--ds-color-border);

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

@@ -1,3 +1,5 @@
+import { type ChatCopy } from '../../copy';
+import type { Visual } from '../../visuals';
 interface Props {
     content: string;
     streaming?: boolean;
@@ -5,10 +7,20 @@ interface Props {
     collectionNames?: Set<string>;
     /** `[n]` markers to turn into chips; omit and the markers stay as text. */
     citationNumbers?: Set<number>;
+    /** Web pages by `webKey`, numbered after the library's: a link to one
+     *  renders as its chip. */
+    webNumbers?: Map<string, number>;
     oncite?: (n: number) => void;
     /** A step down, for prose that is reference material beside an answer
      *  rather than the answer itself — the source pane's sections. */
     dense?: boolean;
+    /** Renderers by a fence's language: a block of one is drawn by its
+     *  component in place of the code. Absent, every fence is code. */
+    visuals?: Record<string, Visual>;
+    /** The same document's earlier version, as Markdown: what differs here
+     *  is marked with a bar. */
+    previous?: string;
+    copy?: Partial<ChatCopy>;
 }
 declare const Markdown: import("svelte").Component<Props, {}, "">;
 type Markdown = ReturnType<typeof Markdown>;

package/dist/components/source-fold/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './source-fold.svelte';
+export { default as SourceFold } from './source-fold.svelte';

package/dist/components/source-fold/index.js

@@ -0,0 +1,2 @@
+export { default } from './source-fold.svelte';
+export { default as SourceFold } from './source-fold.svelte';