@poodle64/librarian 2026.9.5 → 2026.9.7

package/dist/components/activity-group/activity-group.svelte

@@ -1,11 +1,12 @@
 <!--
-  A whole investigation, as one line the reader can open.
+  A whole investigation, as ONE line the reader can open.
 
-  Fifteen tool rows stood between the question and the first word of the
-  answer, so the answer had to be scrolled to. While the agent is working the
-  steps are worth watching, so they show live. The moment prose starts
-  arriving they fold to a single summary — the same move Claude makes with
-  "Researched for 49s".
+  Not a stack. Fifteen tool rows between the question and the first word of the
+  answer is the machine room on show, and a running commentary of "Let me
+  check…" is worse: it narrates a mechanism Milton is under instruction never
+  to mention. So there is exactly one row in every state — "Working…" while it
+  runs, a count of what was done once it settles — and the steps are behind a
+  disclosure for the reader who wants them.
 -->
 <script lang="ts">
 	import ChevronRightIcon from '@lucide/svelte/icons/chevron-right';
@@ -15,49 +16,40 @@
 
 	interface Props {
 		group: ActivityGroup;
-		/** True while this group is the live one — it stays open. */
+		/** True while this group is the live one. */
 		live: boolean;
 	}
 
 	let { group, live }: Props = $props();
 	let expanded = $state(false);
-	const open = $derived(live || expanded);
+
+	// A live group has nothing to count yet, so counting it reads as "0
+	// searches" flickering up to the real number.
+	const label = $derived(live ? 'Working…' : summariseActivity(group));
 </script>
 
-{#if live}
-	<div class="flex flex-col gap-1.5">
-		{#each group.steps as step (step.block.index)}
-			{#if step.block.kind === 'tool'}
-				<ToolRow block={step.block} repeats={step.repeats} running={true} />
-			{:else}
-				<ThinkingRow
-					block={step.block}
-					active={step.block.index === group.steps.at(-1)?.block.index}
-				/>
-			{/if}
-		{/each}
-	</div>
-{:else}
-	<div>
-		<button
-			type="button"
-			class="text-muted-foreground hover:text-foreground flex items-center gap-1.5 text-sm transition-colors"
-			onclick={() => (expanded = !expanded)}
-			aria-expanded={expanded}
-		>
-			<ChevronRightIcon class="size-3.5 transition-transform {expanded ? 'rotate-90' : ''}" />
-			<span>{summariseActivity(group)}</span>
-		</button>
-		{#if open}
-			<div class="border-border mt-2 ml-1.75 flex flex-col gap-1.5 border-l pl-3">
-				{#each group.steps as step (step.block.index)}
-					{#if step.block.kind === 'tool'}
-						<ToolRow block={step.block} repeats={step.repeats} running={false} />
-					{:else}
-						<ThinkingRow block={step.block} active={false} />
-					{/if}
-				{/each}
-			</div>
+<div>
+	<button
+		type="button"
+		class="text-muted-foreground hover:text-foreground flex items-center gap-1.5 text-sm transition-colors"
+		onclick={() => (expanded = !expanded)}
+		aria-expanded={expanded}
+	>
+		<ChevronRightIcon class="size-3.5 transition-transform {expanded ? 'rotate-90' : ''}" />
+		{#if live}
+			<span class="bg-status-info size-1.5 shrink-0 animate-pulse rounded-full"></span>
 		{/if}
-	</div>
-{/if}
+		<span>{label}</span>
+	</button>
+	{#if expanded}
+		<div class="border-border mt-2 ml-1.75 flex flex-col gap-1.5 border-l pl-3">
+			{#each group.steps as step (step.block.index)}
+				{#if step.block.kind === 'tool'}
+					<ToolRow block={step.block} repeats={step.repeats} running={live} />
+				{:else}
+					<ThinkingRow block={step.block} active={false} />
+				{/if}
+			{/each}
+		</div>
+	{/if}
+</div>

package/dist/components/activity-group/activity-group.svelte.d.ts

@@ -1,7 +1,7 @@
 import { type ActivityGroup } from '../../transcript.svelte';
 interface Props {
     group: ActivityGroup;
-    /** True while this group is the live one — it stays open. */
+    /** True while this group is the live one. */
     live: boolean;
 }
 declare const ActivityGroup: import("svelte").Component<Props, {}, "">;

package/dist/components/agent-transcript/agent-transcript.svelte

@@ -1,12 +1,28 @@
 <!--
-  One question and everything the agent did answering it.
+  One question and everything Milton did answering it.
 
-  User turn as a rounded bubble, assistant prose led by a status dot, tool
-  calls as rows in the flow, thinking as stacked phase labels that dim once
-  superseded.
+  Three things carry the shape. The question is a bubble against the edge, so a
+  reader scanning back finds their own words without reading any of the answer.
+  The answer is plain prose held to a reading measure, because a full-width
+  line at 1440 is the single clearest tell that a surface was never read on.
+  Everything Milton DID is one quiet line above it, never a stack.
 -->
 <script lang="ts">
-	import { segment, type Block, type Outcome } from '../../transcript.svelte';
+	import CheckIcon from '@lucide/svelte/icons/check';
+	import CopyIcon from '@lucide/svelte/icons/copy';
+	import RefreshCwIcon from '@lucide/svelte/icons/refresh-cw';
+	import {
+		readerQuestion,
+		segment,
+		type Block,
+		type Outcome
+	} from '../../transcript.svelte';
+	import {
+		citationMarkers,
+		resolveCitations,
+		splitSources,
+		type Citation
+	} from '../../citations';
 	import Working from '../working/working.svelte';
 	import ActivityGroup from '../activity-group/activity-group.svelte';
 	import Markdown from '../markdown/markdown.svelte';
@@ -16,16 +32,76 @@
 		blocks: Block[];
 		outcome: Outcome | null;
 		running: boolean;
+		/** Sources from the library's `citations` frame. Absent falls back to
+		 *  whatever a "## Sources" block in the prose says. */
+		citations?: Citation[];
 		/** Forwarded to Markdown; omit if the caller has no collections to chip. */
 		collectionNames?: Set<string>;
+		/** Opens the document pane. Omit and chips render but do not open. */
+		oncite?: (citation: Citation) => void;
+		/** Offered on the LAST answer only — re-asks the same question. */
+		onregenerate?: () => void;
 	}
 
-	let { question, blocks, outcome, running, collectionNames = new Set() }: Props = $props();
+	let {
+		question,
+		blocks,
+		outcome,
+		running,
+		citations = [],
+		collectionNames = new Set(),
+		oncite,
+		onregenerate
+	}: Props = $props();
 
-	// An activity group stays live — and therefore open — only while it is the
-	// last thing in the turn. As soon as prose arrives after it, it folds.
+	const asked = $derived(readerQuestion(question));
+
+	// An activity group stays live — and therefore labelled "Working…" — only
+	// while it is the last thing in the turn. As soon as prose arrives, it
+	// settles into its count.
 	const segments = $derived(segment(blocks));
 	const lastIndex = $derived(segments.at(-1)?.index ?? -1);
+
+	// The prose block a Sources list may be hiding at the end of is the last
+	// one; splitting every text segment would eat a "## Sources" heading a
+	// reader legitimately asked about mid-answer.
+	const answer = $derived(
+		segments
+			.filter((s) => s.kind === 'text')
+			.map((s) => s.text)
+			.join('\n\n')
+	);
+	const split = $derived(running ? { body: '', citations: [] } : splitSources(answer));
+	const sources = $derived(resolveCitations(citations, split.citations));
+	// Only a number the prose actually marks becomes a chip; a source list may
+	// legitimately carry an entry the answer never points at inline.
+	const numbers = $derived(
+		new Set(citationMarkers(answer).filter((n) => sources.some((c) => c.n === n)))
+	);
+
+	function prose(text: string, isLast: boolean): string {
+		// Only the last text segment can carry the trailing Sources block, and
+		// only once the answer has settled — mid-stream the heading may be all
+		// that has arrived.
+		return isLast && split.citations.length > 0 ? split.body : text;
+	}
+
+	const hasAnswer = $derived(segments.some((s) => s.kind === 'text'));
+	// A failed turn settles too, and "Ask again" is the one thing a reader wants
+	// from it — there is just nothing to copy.
+	const settled = $derived(!running && (hasAnswer || Boolean(outcome?.error)));
+
+	let copied = $state(false);
+	async function copy() {
+		try {
+			await navigator.clipboard.writeText(answer);
+			copied = true;
+			setTimeout(() => (copied = false), 1600);
+		} catch {
+			// A denied clipboard permission is not worth an error state on an
+			// answer the reader can still select by hand.
+		}
+	}
 </script>
 
 <article class="flex flex-col gap-3">
@@ -33,9 +109,9 @@
 	     panel: this surface is read by people who arrive with those two as
 	     their model of what a chat looks like. -->
 	<div
-		class="bg-surface-3 text-foreground border-border max-w-[85%] self-end rounded-2xl border px-4 py-2.5 text-base"
+		class="bg-surface-3 text-foreground border-border max-w-[85%] self-end rounded-2xl border px-4 py-2.5 text-base break-words whitespace-pre-wrap"
 	>
-		{question}
+		{asked}
 	</div>
 
 	{#if running && segments.length === 0}
@@ -46,26 +122,90 @@
 		{#if seg.kind === 'activity'}
 			<ActivityGroup group={seg} live={running && seg.index === lastIndex} />
 		{:else}
-			<div class="flex gap-2.5">
-				<span class="bg-muted-foreground/40 mt-2.5 size-1.5 shrink-0 rounded-full"></span>
-				<div class="min-w-0 flex-1">
-					<Markdown
-						content={seg.text}
-						streaming={running && seg.index === lastIndex}
-						{collectionNames}
-					/>
-				</div>
+			<div class="max-w-[72ch] min-w-0">
+				<Markdown
+					content={prose(seg.text, seg.index === lastIndex)}
+					streaming={running && seg.index === lastIndex}
+					{collectionNames}
+					citationNumbers={numbers}
+					oncite={(n) => {
+						const found = sources.find((c) => c.n === n);
+						if (found) oncite?.(found);
+					}}
+				/>
 			</div>
 		{/if}
 	{/each}
 
-	{#if outcome}
-		<p class="text-muted-foreground pl-4 font-mono text-xs tabular-nums">
-			{#if outcome.error}
-				{outcome.error}
-			{:else}
-				{outcome.turns} turns · {((outcome.durationMs ?? 0) / 1000).toFixed(1)}s
-			{/if}
+	{#if sources.length > 0}
+		<section class="max-w-[72ch]">
+			<h2 class="text-muted-foreground mb-1.5 text-xs font-medium tracking-wide uppercase">
+				Sources
+			</h2>
+			<ol class="flex flex-col gap-1">
+				{#each sources as source (source.n)}
+					<li>
+						<button
+							type="button"
+							onclick={() => oncite?.(source)}
+							disabled={!source.document_id || !oncite}
+							class="border-border hover:border-border-strong hover:bg-surface-2 focus-visible:ring-ring flex w-full items-baseline gap-2 rounded-lg border px-2.5 py-1.5 text-left text-sm transition-colors focus-visible:ring-2 focus-visible:outline-none disabled:cursor-default disabled:hover:bg-transparent"
+						>
+							<span
+								class="bg-primary/15 text-foreground shrink-0 rounded px-1.5 font-mono text-xs tabular-nums"
+								>{source.n}</span
+							>
+							<span class="min-w-0">
+								<span class="text-foreground">{source.title}</span>
+								{#if source.section}<span class="text-muted-foreground">
+										· {source.section}</span
+									>{/if}
+							</span>
+						</button>
+					</li>
+				{/each}
+			</ol>
+		</section>
+	{/if}
+
+	{#if outcome?.error}
+		<p
+			class="border-status-error/40 bg-status-error/10 text-foreground max-w-[72ch] rounded-lg border px-3 py-2 text-sm"
+			role="alert"
+		>
+			{outcome.error}
 		</p>
 	{/if}
+
+	{#if settled}
+		<div class="text-muted-foreground -ml-1.5 flex items-center gap-1">
+			{#if hasAnswer}
+				<button
+					type="button"
+					onclick={copy}
+					aria-label={copied ? 'Copied' : 'Copy answer'}
+					class="hover:text-foreground hover:bg-surface-2 focus-visible:ring-ring flex items-center gap-1.5 rounded-md px-1.5 py-1 text-xs transition-colors focus-visible:ring-2 focus-visible:outline-none"
+				>
+					{#if copied}<CheckIcon class="size-3.5" />{:else}<CopyIcon class="size-3.5" />{/if}
+					<span>{copied ? 'Copied' : 'Copy'}</span>
+				</button>
+			{/if}
+			{#if onregenerate}
+				<button
+					type="button"
+					onclick={onregenerate}
+					aria-label="Ask again"
+					class="hover:text-foreground hover:bg-surface-2 focus-visible:ring-ring flex items-center gap-1.5 rounded-md px-1.5 py-1 text-xs transition-colors focus-visible:ring-2 focus-visible:outline-none"
+				>
+					<RefreshCwIcon class="size-3.5" />
+					<span>Ask again</span>
+				</button>
+			{/if}
+			{#if outcome && !outcome.error}
+				<span class="pl-1 font-mono text-xs tabular-nums opacity-70">
+					{((outcome.durationMs ?? 0) / 1000).toFixed(1)}s
+				</span>
+			{/if}
+		</div>
+	{/if}
 </article>

package/dist/components/agent-transcript/agent-transcript.svelte.d.ts

@@ -1,11 +1,19 @@
 import { type Block, type Outcome } from '../../transcript.svelte';
+import { type Citation } from '../../citations';
 interface Props {
     question: string;
     blocks: Block[];
     outcome: Outcome | null;
     running: boolean;
+    /** Sources from the library's `citations` frame. Absent falls back to
+     *  whatever a "## Sources" block in the prose says. */
+    citations?: Citation[];
     /** Forwarded to Markdown; omit if the caller has no collections to chip. */
     collectionNames?: Set<string>;
+    /** Opens the document pane. Omit and chips render but do not open. */
+    oncite?: (citation: Citation) => void;
+    /** Offered on the LAST answer only — re-asks the same question. */
+    onregenerate?: () => void;
 }
 declare const AgentTranscript: import("svelte").Component<Props, {}, "">;
 type AgentTranscript = ReturnType<typeof AgentTranscript>;