@poodle64/librarian 2026.10.5 → 2026.10.7

package/README.md

@@ -179,7 +179,7 @@ on it fires once and never again.
 | Asking again             | `onregenerate`: re-send the last question as a NEW turn; the package exposes the action and never re-asks by itself                                                                         |
 | Choosing a collection    | `Composer`'s `collections` (`{ name, title?, description? }[]`, the ones the person may read) and `collection` (the chosen name; undefined is all of them), with `oncollection(name \| undefined)`. From two collections up it is ONE control naming the choice, opening a listbox (searchable from eight) where each shows by its title (the name made readable where there is none) over its description, never a retrieval summary |
 | The empty state          | `welcome` and up to three `examples`. With a composer, the opening and the composer sit together in the middle of the panel, the examples, the folded scope and `lead` under it; the first turn docks the composer at the foot |
-| Conversation controls    | `toolbar`: a snippet at the measure's trailing edge above the transcript, outside its scroll (the room page's Past questions and New question)                                               |
+| Conversation controls    | `toolbar`: a snippet at the measure's trailing edge above the transcript, outside its scroll (the chat page's Past questions and New question)                                               |
 | What this surface covers | `scope`: one statement per persona, in the host's own words. Rendered above the first turn and folded to a line once the conversation starts                                                   |
 | The words themselves     | `copy`: a partial of `ChatCopy`. Every component resolves it itself, so overriding one line does not mean restating the rest                                                           |
 | An answer its own way    | `turn`: a snippet given each turn's `AgentTranscriptProps` in place of `AgentTranscript`. Render your own from the parts, or `AgentTranscript` inside your own to add to it               |
@@ -405,7 +405,7 @@ end that way.
 | Documents it wrote     | `artefact` frames and a stored turn's `artefacts` (each with `title`, `kind`, `changes`, `pages`) become `turn.written`: the newest version of each is a card with Open and a download chip (Word where `formats` has it, else the source). The pane marks what a version changed since the one before: a "Changed since vN" line from `changes`, and a bar beside each changed block. `loadWritten(name, version)` and `writtenUrl(name, version, format)` (`Chat.loadArtefact` / `Chat.artefactUrl` over the transport) let the pane show a version: Markdown sanitised, HTML only in a `sandbox=""` frame |
 | The turn's steps       | One fold, "Read your attachment, searched the library and the web, and wrote a minute · 6 steps", composed from the steps (`stepsSummary`); it says what is happening now while the turn runs, and opens on one row per step (a search row counts what it found, a web search opens on the pages it found) |
 | Web sources            | Pages from the turn's supacrawl calls and the answer's Markdown links fold with the library's sources ("6 sources · 4 library · 2 web"), numbered on from the library's, and a link to one in the answer reads as that number's chip |
-| Drawing a fence        | `visuals` on `Conversation` is a registry keyed on a fence's language, `{ component, parse }` each; `defaultVisuals` (from `@poodle64/librarian/visuals`) draws `vega-lite` (one Vega-Lite v5 spec, in the app's tokens), `timeline` and `card`. An app passes `{ ...defaultVisuals, openui }`. A block whose closing fence has not arrived is "Drawing…", one that does not parse is its code |
+| Drawing a fence        | `visuals` on `Conversation` is a registry keyed on a fence's language, `{ component, parse }` each; `defaultVisuals` (from `@poodle64/librarian/visuals`) draws `chart` (`{title, type: bar | line | area, x, y: [fields], data}` on LayerChart, in the app's `--chart-1`…`--chart-5` tokens, loaded when an answer carries one), `timeline` and `card`. An app passes `{ ...defaultVisuals, openui }`. A block whose closing fence has not arrived is "Drawing…", one that does not parse is its code |
 | "Answered without a source" | `copy.notHeld: ''` for a persona that answers from no sources                                                                                                     |
 | Saying something mid-run | `Composer`'s `sendWhileRunning`: while the session works the box stays open and Send sits beside Stop. For a route that reads a message while the run works; a chat leaves it off and waits for its answer |
 

package/dist/chat.svelte.d.ts

@@ -205,11 +205,13 @@ export declare class Chat {
     new(): void;
     /**
      * Ask `question`, or what is in the box, as a `kind` of turn when it is not
-     * a plain question, narrowed to one `collection` by name when given. Resolves
-     * once the turn settles: true if it was asked, false if it was refused,
-     * here or by the server, in which case typed words go back into the box.
+     * a plain question, narrowed to one `collection` by name when given. A
+     * question handed in carries `files` with it, the box's own going with a
+     * typed one. Resolves once the turn settles: true if it was asked, false if
+     * it was refused, here or by the server, in which case the question and its
+     * files go back into the box, handed or typed.
      */
-    ask(question?: string, kind?: string, collection?: string): Promise<boolean>;
+    ask(question?: string, kind?: string, collection?: string, files?: File[]): Promise<boolean>;
     /** The last question again, as a new turn: the conversation is append-only,
      *  because the agent's transcript is. Same kind, same collection. */
     again(): Promise<boolean>;

package/dist/chat.svelte.js

@@ -144,25 +144,31 @@ export class Chat {
     }
     /**
      * Ask `question`, or what is in the box, as a `kind` of turn when it is not
-     * a plain question, narrowed to one `collection` by name when given. Resolves
-     * once the turn settles: true if it was asked, false if it was refused,
-     * here or by the server, in which case typed words go back into the box.
+     * a plain question, narrowed to one `collection` by name when given. A
+     * question handed in carries `files` with it, the box's own going with a
+     * typed one. Resolves once the turn settles: true if it was asked, false if
+     * it was refused, here or by the server, in which case the question and its
+     * files go back into the box, handed or typed.
      */
-    async ask(question, kind, collection) {
+    async ask(question, kind, collection, files = []) {
         const typed = question === undefined;
         const text = (question ?? this.draft).trim();
         if (!text)
             return false;
         if (this.#job)
             return this.#message(text, typed);
-        if (this.busy || this.quota?.reached)
+        if (this.busy || this.quota?.reached) {
+            // A handed question has no other home: the box takes it, as it takes a refused one.
+            if (!typed)
+                this.#restore(text, files);
             return false;
-        const files = typed ? this.files : [];
+        }
+        const sent = typed ? this.files : files;
         if (typed) {
             this.draft = '';
             this.files = [];
         }
-        return this.#ask(text, files, typed, kind, collection);
+        return this.#ask(text, sent, typed, kind, collection);
     }
     /** The last question again, as a new turn: the conversation is append-only,
      *  because the agent's transcript is. Same kind, same collection. */
@@ -419,10 +425,7 @@ export class Chat {
             const at = this.#turns.findIndex((t) => t.id === live.id);
             if (at >= 0)
                 this.#turns.splice(at, 1);
-            if (typed) {
-                this.draft = text;
-                this.files = files;
-            }
+            this.#restore(text, files);
             this.#finish();
             // Asked elsewhere and still being answered: show that instead.
             if (ending === 'answering' && id)
@@ -564,6 +567,11 @@ export class Chat {
                 return;
         }
     }
+    /** A question that was not asked goes back into the box with its files, ahead of anything typed since. */
+    #restore(text, files) {
+        this.draft = this.draft ? `${text}\n\n${this.draft}` : text;
+        this.files = [...files, ...this.files];
+    }
     async #message(text, typed) {
         const id = this.conversationId;
         if (!id)
@@ -576,6 +584,8 @@ export class Chat {
         catch {
             if (typed)
                 this.draft = text;
+            else
+                this.#restore(text, []);
             return false;
         }
         // A settled job takes it as a new run, already started when the

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

@@ -18,6 +18,7 @@
 	import PencilIcon from '@lucide/svelte/icons/pencil';
 	import FileTextIcon from '@lucide/svelte/icons/file-text';
 	import RefreshCwIcon from '@lucide/svelte/icons/refresh-cw';
+	import type { Snippet } from 'svelte';
 	import {
 		outcomeLine,
 		readerQuestion,
@@ -116,6 +117,9 @@
 		 *  ("about A$0.34"). The package never converts currency itself,
 		 *  and a zero-cost run (a local model) shows no cost regardless. */
 		formatCost?: (usd: number) => string;
+		/** Drawn in place of the package's own "working" line while the answer has
+		 *  shown nothing yet; given the line's `label` and `since`. */
+		working?: Snippet<[{ label?: string; since?: number }]>;
 	}
 
 	let {
@@ -145,7 +149,8 @@
 		onmark,
 		shared,
 		onshare,
-		formatCost
+		formatCost,
+		working
 	}: AgentTranscriptProps = $props();
 
 	// The prose IS the artefact: it reads in the column, and the transcript
@@ -390,11 +395,18 @@
 		</header>
 
 		{#if running && segments.length === 0}
-			<Working
-				copy={words}
-				label={answering !== undefined ? words.stillAnswering : undefined}
-				since={answering}
-			/>
+			{#if working}
+				{@render working({
+					label: answering !== undefined ? words.stillAnswering : undefined,
+					since: answering
+				})}
+			{:else}
+				<Working
+					copy={words}
+					label={answering !== undefined ? words.stillAnswering : undefined}
+					since={answering}
+				/>
+			{/if}
 		{/if}
 
 		{#each segments as seg (seg.index)}

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

@@ -1,3 +1,4 @@
+import type { Snippet } from 'svelte';
 import { type Artefact, type Block, type DescribeTool, type Outcome } from '../../transcript.svelte';
 import { type Citation } from '../../citations';
 import { type ChatCopy } from '../../copy';
@@ -71,6 +72,12 @@ export interface AgentTranscriptProps {
      *  ("about A$0.34"). The package never converts currency itself,
      *  and a zero-cost run (a local model) shows no cost regardless. */
     formatCost?: (usd: number) => string;
+    /** Drawn in place of the package's own "working" line while the answer has
+     *  shown nothing yet; given the line's `label` and `since`. */
+    working?: Snippet<[{
+        label?: string;
+        since?: number;
+    }]>;
 }
 declare const AgentTranscript: import("svelte").Component<AgentTranscriptProps, {}, "">;
 type AgentTranscript = ReturnType<typeof AgentTranscript>;

package/dist/components/composer/composer.svelte

@@ -120,8 +120,13 @@
 
 	// Who the question is put to: every collection the person may read, or one
 	// of them. A person with one collection (or none) has nothing to pick, so
-	// nothing renders rather than a control that only reselects itself.
-	const hasChoice = $derived(collections.length > 1);
+	// nothing renders rather than a control that only reselects itself, unless
+	// the question is already narrowed to the one held: a page that has not yet
+	// had the list shows the collection its address names, and the control stays
+	// put as the rest of the list arrives.
+	const hasChoice = $derived(
+		collections.length > 1 || (collection !== undefined && collections.length > 0)
+	);
 
 	let box = $state<HTMLElement | null>(null);
 	let wrapper = $state<HTMLElement | null>(null);
@@ -137,8 +142,10 @@
 		const el = textarea;
 		if (!el) return;
 		el.style.height = 'auto';
-		const line = parseFloat(getComputedStyle(el).lineHeight) || 24;
-		el.style.height = `${Math.min(el.scrollHeight, line * 6 + 20)}px`;
+		const style = getComputedStyle(el);
+		const line = parseFloat(style.lineHeight) || 27;
+		const padding = parseFloat(style.paddingTop) + parseFloat(style.paddingBottom);
+		el.style.height = `${Math.min(el.scrollHeight, line * 6 + padding)}px`;
 	}
 
 	$effect(() => {
@@ -280,7 +287,7 @@
 			bind:value
 			oninput={grow}
 			onkeydown={keydown}
-			rows="1"
+			rows="3"
 			disabled={waiting}
 			placeholder={waiting ? words.answeringPlaceholder : words.askPlaceholder}
 			class="ds-lib-input"
@@ -305,7 +312,7 @@
 					disabled={running || files.length >= MAX_FILES}
 					aria-label="Attach a file"
 				>
-					<PaperclipIcon size={16} />
+					<PaperclipIcon size={20} />
 				</button>
 			{/if}
 
@@ -318,7 +325,7 @@
 					aria-label="Ask for a briefing"
 					title="Ask for a briefing"
 				>
-					<FileTextIcon size={16} />
+					<FileTextIcon size={20} />
 				</button>
 			{/if}
 
@@ -339,7 +346,7 @@
 			<span class="ds-lib-spacer"></span>
 			{#if running}
 				<button type="button" class="ds-lib-stop" onclick={onstop} aria-label="Stop">
-					<SquareIcon size={14} fill="currentColor" />
+					<SquareIcon size={16} fill="currentColor" />
 				</button>
 			{/if}
 			{#if !waiting}
@@ -350,7 +357,7 @@
 					disabled={!value.trim()}
 					aria-label="Send"
 				>
-					<ArrowUpIcon size={16} />
+					<ArrowUpIcon size={20} />
 				</button>
 			{/if}
 		</div>
@@ -441,10 +448,14 @@
 		resize: none;
 		border: 0;
 		background: transparent;
-		padding: 0.75rem 1rem 0.5rem;
+		padding: var(--ds-spacing-md) var(--ds-spacing-md) var(--ds-spacing-sm);
 		color: var(--ds-color-foreground);
 		font: inherit;
-		font-size: 1rem;
+		/* No token carries a body size or a control size, so these are raw:
+		   a resting box that reads as a chat composer on every page (an app
+		   overriding them is a defect here). Three lines, 18px text. */
+		font-size: 1.125rem;
+		line-height: 1.5;
 		outline: none;
 	}
 
@@ -462,7 +473,7 @@
 		align-items: center;
 		gap: 0.5rem;
 		row-gap: 0.375rem;
-		padding: 0 0.75rem 0.625rem;
+		padding: 0 var(--ds-spacing-sm) var(--ds-spacing-sm);
 	}
 
 	.ds-lib-picker {
@@ -473,8 +484,8 @@
 	.ds-lib-stop,
 	.ds-lib-send {
 		display: flex;
-		width: 2rem;
-		height: 2rem;
+		width: 2.75rem;
+		height: 2.75rem;
 		flex: none;
 		align-items: center;
 		justify-content: center;

package/dist/components/composer/scope-picker.svelte

@@ -292,10 +292,11 @@
 		border: 1px solid transparent;
 		border-radius: var(--ds-radius-full);
 		background: none;
-		padding: 0.25rem 0.5rem 0.25rem 0.625rem;
+		min-height: 2.75rem;
+		padding: 0 var(--ds-spacing-sm) 0 0.75rem;
 		color: var(--ds-color-muted-foreground);
 		font: inherit;
-		font-size: var(--ds-text-2xs);
+		font-size: 0.875rem;
 		cursor: pointer;
 		transition:
 			color 150ms ease,

package/dist/components/conversation/conversation.svelte

@@ -137,6 +137,9 @@
 		 *  transcript. It stays put while the transcript scrolls and narrows
 		 *  with it when a pane opens. */
 		toolbar?: Snippet;
+		/** Drawn in place of each answer's "working" line before it shows anything
+		 *  (`AgentTranscriptProps.working`). */
+		working?: AgentTranscriptProps['working'];
 	}
 
 	let {
@@ -168,7 +171,8 @@
 		turn: presentTurn,
 		lead,
 		toolbar,
-		formatCost
+		formatCost,
+		working
 	}: Props = $props();
 
 	// Resolved ONCE, here, and handed down whole: every child takes `copy` and
@@ -392,6 +396,7 @@
 										? (text: string) => onedit(index, text)
 										: undefined,
 								formatCost,
+								working,
 								oncite: oncite || loadDocument ? cite : undefined,
 								onregenerate: last && !running ? onregenerate : undefined,
 								onmark:

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

@@ -96,6 +96,9 @@ interface Props {
      *  transcript. It stays put while the transcript scrolls and narrows
      *  with it when a pane opens. */
     toolbar?: Snippet;
+    /** Drawn in place of each answer's "working" line before it shows anything
+     *  (`AgentTranscriptProps.working`). */
+    working?: AgentTranscriptProps['working'];
 }
 declare const Conversation: import("svelte").Component<Props, {}, "">;
 type Conversation = ReturnType<typeof Conversation>;

package/dist/components/visual-block/chart-draw.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">
+	import { AreaChart, BarChart, LineChart } from 'layerchart';
+	import type { ChartValue } from '../../visuals';
+
+	let { value }: { value: ChartValue } = $props();
+
+	// `--chart-1` to `--chart-5` are the app's own series colours.
+	const series = $derived(
+		value.y.map((key, index) => ({ key, label: key, color: `var(--chart-${index + 1})` }))
+	);
+	const legend = $derived(series.length > 1);
+	// A line or area over ISO dates is a time axis; anything else is the label it says.
+	const data = $derived(
+		value.type !== 'bar' && value.data.every((row) => /^\d{4}-\d{2}(-\d{2})?$/.test(String(row[value.x])))
+			? value.data.map((row) => ({ ...row, [value.x]: new Date(String(row[value.x])) }))
+			: value.data
+	);
+</script>
+
+{#if value.type === 'bar'}
+	<BarChart {data} x={value.x} {series} {legend} seriesLayout="group" props={{ bars: { strokeWidth: 0, radius: 2 } }} />
+{:else if value.type === 'line'}
+	<LineChart {data} x={value.x} {series} {legend} />
+{:else}
+	<AreaChart {data} x={value.x} {series} {legend} />
+{/if}

package/dist/components/visual-block/chart-draw.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { ChartValue } from '../../visuals';
+type $$ComponentProps = {
+    value: ChartValue;
+};
+declare const ChartDraw: import("svelte").Component<$$ComponentProps, {}, "">;
+type ChartDraw = ReturnType<typeof ChartDraw>;
+export default ChartDraw;

package/dist/components/visual-block/chart.svelte

@@ -0,0 +1,73 @@
+<!--
+  One chart block, drawn with LayerChart in the app's chart tokens. The persona
+  writes the data and the kind; colour, type, axes and size come from here.
+  LayerChart is loaded when an answer carries a chart, never with the page.
+-->
+<script lang="ts">
+	import type { Component } from 'svelte';
+	import type { ChartValue } from '../../visuals';
+
+	interface Props {
+		value: unknown;
+		source: string;
+	}
+
+	let { value, source }: Props = $props();
+	const chart = $derived(value as ChartValue);
+	let Draw = $state<Component<{ value: ChartValue }> | null>(null);
+	let failed = $state(false);
+
+	$effect(() => {
+		if (Draw || failed) return;
+		import('./chart-draw.svelte').then(
+			(module) => (Draw = module.default),
+			() => (failed = true)
+		);
+	});
+</script>
+
+{#if failed}
+	<pre data-highlighted="true"><code>{source}</code></pre>
+{:else}
+	<figure class="ds-lib-chart">
+		{#if chart.title}<figcaption class="ds-lib-chart-title">{chart.title}</figcaption>{/if}
+		<div class="ds-lib-chart-host">
+			{#if Draw}<Draw value={chart} />{/if}
+		</div>
+	</figure>
+{/if}
+
+<style>
+	.ds-lib-chart {
+		margin: 0.75em 0;
+		border: 1px solid var(--ds-color-border);
+		border-radius: var(--ds-radius-lg);
+		background: var(--ds-color-surface-1);
+		padding: 0.75rem 0.875rem;
+	}
+
+	.ds-lib-chart-title {
+		margin-bottom: 0.5rem;
+		color: var(--ds-color-foreground);
+		font-size: 0.875rem;
+		font-weight: 600;
+	}
+
+	.ds-lib-chart-host {
+		width: 100%;
+		height: 16rem;
+	}
+
+	.ds-lib-chart-host :global(text) {
+		fill: var(--ds-color-muted-foreground);
+		stroke: none;
+		font-size: 12px;
+	}
+
+	.ds-lib-chart-host :global(.lc-rule),
+	.ds-lib-chart-host :global(.lc-axis-tick),
+	.ds-lib-chart-host :global(.lc-grid-x-line),
+	.ds-lib-chart-host :global(.lc-grid-y-line) {
+		stroke: var(--ds-color-border-strong);
+	}
+</style>

package/dist/components/visual-block/chart.svelte.d.ts

@@ -0,0 +1,8 @@
+import type { Component } from 'svelte';
+interface Props {
+    value: unknown;
+    source: string;
+}
+declare const Chart: Component<Props, {}, "">;
+type Chart = ReturnType<typeof Chart>;
+export default Chart;

package/dist/visuals.d.ts

@@ -17,6 +17,14 @@ export interface Visual {
     /** The block's text as the value its component draws; throws on a block that is invalid. */
     parse: (source: string) => unknown;
 }
+export interface ChartValue {
+    title: string;
+    type: 'bar' | 'line' | 'area';
+    /** The field on the x axis; each y is a field drawn as a series. */
+    x: string;
+    y: string[];
+    data: Array<Record<string, string | number>>;
+}
 export interface TimelineValue {
     title: string;
     events: Array<{
@@ -34,5 +42,5 @@ export interface CardValue {
         value: string;
     }>;
 }
-/** A chart, a timeline and an entity card. An app adds to these or replaces one through `ChatExtensions.visuals`. */
+/** A chart (LayerChart), a timeline and an entity card. An app adds to these or replaces one through `ChatExtensions.visuals`. */
 export declare const defaultVisuals: Record<string, Visual>;

package/dist/visuals.js

@@ -10,7 +10,7 @@
  */
 import EntityCard from './components/visual-block/entity-card.svelte';
 import Timeline from './components/visual-block/timeline.svelte';
-import VegaChart from './components/visual-block/vega-chart.svelte';
+import Chart from './components/visual-block/chart.svelte';
 const isRecord = (value) => typeof value === 'object' && value !== null && !Array.isArray(value);
 const text = (value) => typeof value === 'string' ? value : typeof value === 'number' ? String(value) : '';
 const object = (source) => {
@@ -19,32 +19,34 @@ const object = (source) => {
         throw new Error('not an object');
     return value;
 };
-/** Any string naming an address: a spec that carries one could fetch it, or link to it carrying the conversation out. */
-const ADDRESS = /^[a-z][a-z0-9+.-]*:|\/\//i;
-/**
- * A spec that names an address anywhere, by key or by value, or carries
- * `usermeta`, whose `embedOptions` vega-embed merges over the app's own
- * (`config` or `patch` as a URL is fetched, `actions` turns the export menu back on).
- */
-function addressed(value) {
-    if (typeof value === 'string')
-        return ADDRESS.test(value.trim());
-    if (Array.isArray(value))
-        return value.some(addressed);
-    if (!isRecord(value))
-        return false;
-    return Object.entries(value).some(
-    // `$schema` names the spec's own version and is never drawn or fetched (`vega-chart` drops it).
-    ([key, inner]) => key !== '$schema' && (key === 'url' || key === 'href' || key === 'usermeta' || addressed(inner)));
-}
-const VIEWS = ['mark', 'layer', 'hconcat', 'vconcat', 'concat', 'facet', 'repeat'];
-function parseVega(source) {
-    const spec = object(source);
-    if (!VIEWS.some((key) => key in spec))
-        throw new Error('not a view');
-    if (addressed(spec))
-        throw new Error('names an address');
-    return spec;
+const KINDS = ['bar', 'line', 'area'];
+const MAX_SERIES = 5;
+const MAX_ROWS = 500;
+function parseChart(source) {
+    const value = object(source);
+    const type = KINDS.find((kind) => kind === value.type);
+    if (!type)
+        throw new Error('not a bar, line or area');
+    const x = text(value.x);
+    const y = Array.isArray(value.y) ? value.y.map(text) : [];
+    if (!x || y.length === 0 || y.length > MAX_SERIES || y.some((key) => !key))
+        throw new Error('no x or y');
+    const rows = Array.isArray(value.data) ? value.data : [];
+    if (rows.length === 0 || rows.length > MAX_ROWS)
+        throw new Error('no data');
+    const data = rows.map((row) => {
+        if (!isRecord(row) || !text(row[x]))
+            throw new Error('a row with no x');
+        const point = { [x]: typeof row[x] === 'number' ? row[x] : text(row[x]) };
+        for (const key of y) {
+            const number = row[key];
+            if (typeof number !== 'number' || !Number.isFinite(number))
+                throw new Error('a y that is not a number');
+            point[key] = number;
+        }
+        return point;
+    });
+    return { title: text(value.title), type, x, y, data };
 }
 function parseTimeline(source) {
     const value = object(source);
@@ -74,9 +76,9 @@ function parseCard(source) {
             .filter((fact) => fact.label || fact.value)
     };
 }
-/** A chart, a timeline and an entity card. An app adds to these or replaces one through `ChatExtensions.visuals`. */
+/** A chart (LayerChart), a timeline and an entity card. An app adds to these or replaces one through `ChatExtensions.visuals`. */
 export const defaultVisuals = {
-    'vega-lite': { component: VegaChart, parse: parseVega },
+    chart: { component: Chart, parse: parseChart },
     timeline: { component: Timeline, parse: parseTimeline },
     card: { component: EntityCard, parse: parseCard }
 };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@poodle64/librarian",
-	"version": "2026.10.5",
+	"version": "2026.10.7",
 	"description": "An agent's conversation surface as a consumable Svelte 5 package: the stream client, transcript state and self-styling chat components (transcript, composer, markdown) every household app renders instead of rebuilding, speaking as whichever persona the app names.",
 	"type": "module",
 	"license": "MIT",
@@ -73,9 +73,7 @@
 		"shiki": "^4.4.3"
 	},
 	"dependencies": {
-		"vega": "6.4.0",
-		"vega-embed": "7.3.0",
-		"vega-lite": "6.4.3"
+		"layerchart": "2.6.0"
 	},
 	"devDependencies": {
 		"@lucide/svelte": "^1.7.0",

package/dist/components/visual-block/vega-chart.svelte

@@ -1,110 +0,0 @@
-<!--
-  One Vega-Lite v5 spec, drawn with the app's own tokens. The persona writes
-  the data and the marks; colour, type, axes and size come from here and
-  override whatever the spec says. Loaded on demand: vega is not small.
--->
-<script lang="ts">
-	import { onMount } from 'svelte';
-
-	interface Props {
-		value: unknown;
-		source: string;
-	}
-
-	let { value, source }: Props = $props();
-	let host = $state<HTMLDivElement | null>(null);
-	let failed = $state(false);
-
-	const css = (name: string): string =>
-		getComputedStyle(document.documentElement).getPropertyValue(name).trim();
-
-	function config() {
-		const ink = css('--ds-color-foreground') || '#231f20';
-		const muted = css('--ds-color-muted-foreground') || '#57595c';
-		const line = css('--ds-color-border-strong') || '#00000038';
-		const font = getComputedStyle(document.body).fontFamily;
-		const series = [1, 2, 3, 4, 5, 6, 7, 8, 9].map((i) => css(`--chart-${i}`)).filter(Boolean);
-		return {
-			background: null,
-			font,
-			...(series.length > 0 ? { range: { category: series } } : {}),
-			mark: { color: series[0] ?? ink },
-			bar: { cornerRadius: 1 },
-			view: { stroke: null },
-			axis: {
-				labelColor: muted,
-				titleColor: muted,
-				domainColor: line,
-				tickColor: line,
-				gridColor: line,
-				gridOpacity: 0.5,
-				labelFont: font,
-				titleFont: font,
-				labelFontSize: 12,
-				titleFontSize: 12,
-				titleFontWeight: 600
-			},
-			legend: { labelColor: ink, titleColor: muted, labelFont: font, titleFont: font },
-			title: { color: ink, font, fontSize: 14, fontWeight: 600, anchor: 'start' }
-		};
-	}
-
-	let latest = 0;
-	// The view drawn last, ended before the next is drawn and when the chart goes.
-	let drawn: { finalize: () => void } | undefined;
-	async function draw() {
-		if (!host) return;
-		const mine = ++latest;
-		try {
-			const { default: embed } = await import('vega-embed');
-			if (mine !== latest) return;
-			const { $schema: _schema, config: _config, usermeta: _usermeta, ...spec } = value as Record<string, unknown>;
-			drawn?.finalize();
-			drawn = await embed(
-				host,
-				{ ...spec, width: 'container', autosize: { type: 'fit', contains: 'padding' } } as never,
-				{ actions: false, renderer: 'svg', config: config() as never }
-			);
-			failed = false;
-		} catch {
-			if (mine === latest) failed = true;
-		}
-	}
-
-	onMount(() => {
-		// The palette follows the theme, and the theme is a class on the root.
-		const watch = new MutationObserver(() => void draw());
-		watch.observe(document.documentElement, { attributes: true, attributeFilter: ['class'] });
-		return () => {
-			watch.disconnect();
-			drawn?.finalize();
-		};
-	});
-
-	$effect(() => {
-		void value;
-		void host;
-		void draw();
-	});
-</script>
-
-{#if failed}
-	<pre data-highlighted="true"><code>{source}</code></pre>
-{:else}
-	<figure class="ds-lib-chart"><div bind:this={host} class="ds-lib-chart-host"></div></figure>
-{/if}
-
-<style>
-	.ds-lib-chart {
-		margin: 0.75em 0;
-		border: 1px solid var(--ds-color-border);
-		border-radius: var(--ds-radius-lg);
-		background: var(--ds-color-surface-1);
-		padding: 0.75rem 0.875rem;
-	}
-
-	.ds-lib-chart-host {
-		width: 100%;
-		min-height: 6rem;
-	}
-</style>

package/dist/components/visual-block/vega-chart.svelte.d.ts

@@ -1,7 +0,0 @@
-interface Props {
-    value: unknown;
-    source: string;
-}
-declare const VegaChart: import("svelte").Component<Props, {}, "">;
-type VegaChart = ReturnType<typeof VegaChart>;
-export default VegaChart;