@poodle64/librarian 2026.10.0 → 2026.10.2

package/README.md

@@ -35,7 +35,7 @@ src/lib/
     document-pane/         the cited document, open at the cited passage
     artefact-card/         an artefact's card, in the host's words
     artefact-pane/         an artefact that is its answer's prose, in the column
-    composer/              the input box: attachments, collection picker, a note, send/stop
+    composer/              the input box: attachments, one collection control, a note, send/stop
     markdown/              sanitised, streaming-safe markdown + highlighting
     activity-group/        a whole investigation, as one quiet line
     tool-row/              one tool call
@@ -174,12 +174,13 @@ on it fires once and never again.
 | Attachments              | nothing: `ask()` posts multipart (`question`, `resume`, `collection`, `files[]`) whenever `files` is non-empty, and JSON when it is not. The route must accept both                      |
 | Reading a cited document | `loadDocument(document_id) => Promise<{title, sections: [{anchor, heading, text}]}>`, proxied through the app's own authenticated route (caspo: `GET /api/sources/documents/{id}/content`) |
 | 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, summary }[]`, the ones the person may read) and `collection` (the chosen name; undefined is all of them), with `oncollection(name \| undefined)`. It renders from two collections up, each by its summary, never its name |
-| The empty state          | `welcome` and up to three `examples`                                                                                                                                                        |
+| 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)                                               |
 | 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               |
-| What leads a conversation | `lead`: a snippet inside the scroll, under the opening and the scope, so a tall one scrolls with the conversation instead of taking its height                                            |
+| What leads a conversation | `lead`: a snippet inside the scroll, under the opening and the scope, so a tall one scrolls with the conversation instead of taking its height; under the centred composer before the first question |
 
 Nothing here fetches on its own behalf. The document read is
 authenticated, and a package that called it directly would be reaching past
@@ -319,8 +320,9 @@ the job may go on by itself; `sendWhileRunning` is true.
 | Sharing an answer        | `onshare(turn, share)` on `Conversation`, over `chat.share`: every settled answer offers Share, which copies the link `StoredTurn.shared` names; a shared one offers Copy link and Stop sharing. Nothing is shared unless the reader asks. A host's own `turn` places `AnswerShare` (`./answer-share`) with the `onshare` and `shared` it is handed |
 | A shared answer, read    | `Conversation` given `[storedTurn(id, 0, answer)]` from `./chat` and no handlers, no composer: the question, the answer and its sources, read-only, citations opening as in the chat |
 | Still answering          | `answering` on `Conversation`, from the controller                                                                                               |
+| Reopening                | `reopening` on `Conversation` while a reopened conversation has no turns yet (`chat.conversationId` set, `chat.turns` empty): docked and silent, never a new conversation's centred opening |
 | The allowance            | `FairUseNotice quota={…}` in the composer snippet: a count while there are questions left, a notice with `support_url` once there are none. Nothing for `exempt`, or a `limit` of 0 |
-| Past conversations       | `ConversationList`: newest first, `href` makes each row a link, and each act renders only when its handler is given; a delete asks first        |
+| Past conversations       | `ConversationList`: newest first, `href` makes each row a link, and each act renders only when its handler is given; a delete asks first. A host laying it over the page (a sheet) passes `onclose` for the header's close |
 
 ### Watching a session somebody else started
 
@@ -480,7 +482,7 @@ of them is composed from the persona's name:
 
 That one prop carries the working line ("Penny is looking…"), both composer
 placeholders, the uncited-answer note, both failure sentences, the scope
-label, the collection picker's label, the opening line, the name signed on every answer card and the
+label, the collection picker's label, the opening line, the name signed on every answer and the
 accessible name of the scroll region. A slug is fine: `penny` renders as
 "Penny", `chief-engineer` as "Chief Engineer", and a name the host already
 capitalised is left exactly as written.
@@ -511,8 +513,8 @@ settles, offering "Ask again".
 
 ### Timestamps
 
-`Turn.at` (epoch ms) renders as a clock time on the question and the answer
-card, which is a different fact from the duration badge beside the actions. A
+`Turn.at` (epoch ms) renders as a clock time on the question and the answer,
+which is a different fact from the duration badge beside the actions. A
 host that persists conversations sets it; a host that does not gets one
 stamped when the turn first appears, and a turn already on screen at mount —
 one read back out of a stored conversation — deliberately shows none rather than claiming
@@ -541,8 +543,9 @@ running from its own static build. The same script asserts what a screenshot
 cannot: that nothing scrolls sideways at any width, that the source pane
 opens and closes from the keyboard with focus returning to the chip and is
 really draggable, that the scope statement folds once there is a
-conversation over it and reopens from that line, that the collection picker
-starts on all of them and marks the one tapped by its summary, that the persona's
+conversation over it and reopens from that line, that the collection control
+starts on all of them, stays one control for 27 and takes a searched pick from
+the keyboard, that past questions come over the page and hand focus back, that the persona's
 between-tool narration is nowhere in the answer prose before the activity
 line is opened, that a job's artefact and the pages it read open in the
 host's own columns and never in a pane of the package's, and that the reading

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

@@ -1,16 +1,16 @@
 <!--
   One question and everything the persona did answering it.
 
-  Four things carry the shape. The question is a bubble against the trailing
-  edge, so a reader scanning back finds their own words without reading any of
-  the answer. The answer is a bounded card under it, signed with the persona's
-  name and the time, because a transcript of unbounded prose reads as a log
-  and the director's first words about the live screen were "it doesn't look
-  like a ChatGPT window". Everything the persona DID is one quiet line inside
-  that card, never a stack. And the measure is the package's own CSS, never a
-  utility class a consuming app's Tailwind has to discover in `dist` — the one
-  that got away compiled to `max-width: none` in production and left a
-  2302px-wide transcript.
+  Four things carry the shape, ChatGPT's and Claude's. The question is a quiet
+  bubble against the trailing edge, so a reader scanning back finds their own
+  words without reading any of the answer. The answer is prose under it, signed
+  with the persona's name and the time, in no box: space and type tell one turn
+  from the next (the operator's bar, 19/10/2026: "clean and elegant, like what
+  you get when you chat with ChatGPT or Claude"). Everything the persona DID is
+  one quiet line in the answer, never a stack. And the measure is the package's
+  own CSS, never a utility class a consuming app's Tailwind has to discover in
+  `dist` — the one that got away compiled to `max-width: none` in production
+  and left a 2302px-wide transcript.
 -->
 <script lang="ts">
 	import CheckIcon from '@lucide/svelte/icons/check';
@@ -364,7 +364,7 @@
 	.ds-lib-turn {
 		display: flex;
 		flex-direction: column;
-		gap: 0.5rem;
+		gap: 1rem;
 	}
 
 	.ds-lib-ask {
@@ -376,27 +376,19 @@
 		align-self: flex-end;
 	}
 
-	/* The reader's own words carry the consuming app's hue, the way every chat
-	   a person already uses colours THEIR side and leaves the other party
-	   neutral. It is an identity mark, not decoration: scanning back for "what
-	   did I ask" is a colour search, not a reading task.
-
-	   --ds-color-primary-solid, falling back to --ds-color-primary, because a
-	   dark-mode palette lightens its primary so the SAME token can serve as
-	   coloured text on a dark page. A fill behind light text and text on a dark
-	   ground want opposite lightness, and a brand asked to be both comes out
-	   washed — a deep red reads as salmon. An app with a fill-grade brand
-	   colour declares the solid pair; one that has not is unaffected.
-	   It stays on the SHORT side of the transcript on purpose — a question is
-	   a line or two, an answer is paragraphs, so filling the question is an
-	   accent and filling the answer would be a wall. */
+	/* A raised tone, not the brand: both references set the reader's words on
+	   a quiet surface at the trailing edge, and position and shape are what a
+	   reader scanning back finds them by. It stays on the SHORT side of the
+	   transcript on purpose — a question is a line or two, an answer is
+	   paragraphs, so the bubble is an accent and boxing the answer would be a
+	   wall. */
 	.ds-lib-bubble {
 		max-width: 85%;
 		border: 1px solid transparent;
 		border-radius: var(--ds-radius-xl);
-		background: var(--ds-color-primary-solid, var(--ds-color-primary));
+		background: var(--ds-color-surface-2);
 		padding: 0.625rem 1rem;
-		color: var(--ds-color-primary-solid-foreground, var(--ds-color-primary-foreground));
+		color: var(--ds-color-foreground);
 		font-size: 1rem;
 		line-height: 1.5rem;
 		overflow-wrap: break-word;
@@ -410,18 +402,10 @@
 		font-variant-numeric: tabular-nums;
 	}
 
-	/* The card. A turn a reader can see the edges of is the whole of what the
-	   director was asking for: one question and its answer, bounded, rather
-	   than prose running edge to edge under the last lot of prose. */
 	.ds-lib-answer {
 		display: flex;
 		flex-direction: column;
 		gap: 0.75rem;
-		border: 1px solid var(--ds-color-border);
-		border-inline-start: 3px solid var(--ds-color-primary);
-		border-radius: var(--ds-radius-xl);
-		background: var(--ds-color-surface-2);
-		padding: 0.875rem 1rem 0.75rem;
 	}
 
 	.ds-lib-answer-head {
@@ -502,7 +486,7 @@
 	}
 
 	.ds-lib-action:hover {
-		background: var(--ds-color-surface-1);
+		background: var(--ds-color-surface-2);
 		color: var(--ds-color-foreground);
 	}
 

package/dist/components/answer-mark/answer-mark.svelte

@@ -138,7 +138,7 @@
 	}
 
 	.ds-lib-mark:hover:not(:disabled) {
-		background: var(--ds-color-surface-1);
+		background: var(--ds-color-surface-2);
 	}
 
 	/* A verdict keeps its colour under the pointer that just gave it. */

package/dist/components/answer-share/answer-share.svelte

@@ -101,7 +101,7 @@
 	}
 
 	.ds-lib-share:hover:not(:disabled) {
-		background: var(--ds-color-surface-1);
+		background: var(--ds-color-surface-2);
 		color: var(--ds-color-foreground);
 	}
 

package/dist/components/composer/choices.d.ts

@@ -0,0 +1,12 @@
+/** A collection a person may read, as the app lists it: `name` is what a
+ *  question is narrowed to, `title` is what the picker shows (the name,
+ *  made readable, where there is none) and `description` is its one line
+ *  under the title. A retrieval summary is never a field here: it is filing
+ *  history. */
+export interface CollectionChoice {
+    name: string;
+    title?: string;
+    description?: string;
+}
+/** `defence-housing` as a reader would first read it: "Defence housing". */
+export declare function titleOf(choice: CollectionChoice): string;

package/dist/components/composer/choices.js

@@ -0,0 +1,8 @@
+/** `defence-housing` as a reader would first read it: "Defence housing". */
+export function titleOf(choice) {
+    const given = choice.title?.trim();
+    if (given)
+        return given;
+    const words = choice.name.replace(/[-_]+/g, ' ').trim();
+    return words ? words[0].toLocaleUpperCase() + words.slice(1) : choice.name;
+}

package/dist/components/composer/composer.svelte

@@ -1,10 +1,11 @@
 <!--
   The composer: one rounded box holding attachments, the input AND a footer row.
 
-  Two things carry it: the chips sit BELOW the input inside the same box rather
-  than beside it, and the trailing control is a circular filled accent button.
-  The empty→typing transition lives almost entirely in that control — the box
-  chrome grows with the text and nothing else moves.
+  Two things carry it: the quiet controls sit BELOW the input inside the same
+  box rather than beside it (attach, a briefing, and where the question looks
+  as one compact control), and the trailing control is a circular filled
+  accent button. The empty→typing transition lives almost entirely in that
+  control — the box chrome grows with the text and nothing else moves.
 
   While the persona is answering the box is disabled and the send button becomes a
   stop button: an ask route takes one question per request, and a box that
@@ -27,24 +28,23 @@
 		rejectionMessage
 	} from '../../attachments';
 	import { DEFAULT_PERSONA, resolveCopy, type ChatCopy } from '../../copy';
+	import type { CollectionChoice } from './choices';
+	import ScopePicker from './scope-picker.svelte';
 
 	/** Past this many turns, the long-conversation banner offers to start
 	 *  over: a follow-up re-reads the whole conversation, so each one costs
 	 *  more than the last (measured — the longest ran 2.05M cached tokens). */
 	const DEFAULT_TURN_LIMIT = 8;
 
-	/** A collection a person may read, as the app lists it: `name` is what a
-	 *  question is narrowed to, `summary` is what the picker shows. */
-	export interface CollectionChoice {
-		name: string;
-		summary: string;
-	}
+	/** px kept between a lifted box and the keyboard. */
+	const KEYBOARD_GAP = 12;
 
 	interface Props {
 		value: string;
 		running: boolean;
 		/** The collections this person may read. The picker renders when there
-		 *  are two or more: with one, or none, there is nothing to choose. */
+		 *  are two or more: with one, or none, there is nothing to choose. It
+		 *  is one control however many there are, searchable from eight. */
 		collections?: CollectionChoice[];
 		/** The collection the next question is narrowed to, by name; undefined
 		 *  asks across all of them. */
@@ -120,14 +120,11 @@
 
 	// 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
-	// the row renders nothing rather than a chip that only reselects itself.
-	// A collection is shown by its summary, the words a reader knows it by.
+	// nothing renders rather than a control that only reselects itself.
 	const hasChoice = $derived(collections.length > 1);
 
-	// Three chips in a narrow column clipped all three to fragments
-	// ("defence-s…", "All colle…"). Wrapping beats truncating: a chip a reader
-	// cannot finish reading is not a control, it is decoration.
-
+	let box = $state<HTMLElement | null>(null);
+	let wrapper = $state<HTMLElement | null>(null);
 	let textarea = $state<HTMLTextAreaElement | null>(null);
 	let picker = $state<HTMLInputElement | null>(null);
 	let rejected = $state('');
@@ -204,26 +201,45 @@
 
 	// The keyboard does not shrink the layout viewport on iOS, so a composer at
 	// the bottom of a full-height column sits UNDER it. The visual viewport is
-	// the one that moves; the overlap between the two is exactly how far the
-	// box must rise.
+	// the one that moves, and the box rises by however far its unlifted foot
+	// falls below it: the keyboard's height for a docked box, nothing for one
+	// centred above the keyboard on an empty conversation.
+	//
+	// The foot is read from layout, never from where the box is drawn: the
+	// transform's current value (mid-transition included) and the safe-area
+	// padding that lifting removes are both taken back out, so a second event
+	// inside the 150ms transition cannot read a half-lifted box and overshoot.
+	// Any scroll re-measures, since a scrolling stage moves the box too.
 	let lift = $state(0);
 	$effect(() => {
 		const viewport = globalThis.visualViewport;
 		if (!viewport) return;
 		const measure = () => {
-			lift = Math.max(0, window.innerHeight - viewport.height - viewport.offsetTop);
+			const shown = viewport.offsetTop + viewport.height;
+			if (!wrapper || shown >= window.innerHeight) {
+				lift = 0;
+				return;
+			}
+			const style = getComputedStyle(wrapper);
+			const drawn = style.transform === 'none' ? 0 : new DOMMatrixReadOnly(style.transform).m42;
+			const foot =
+				wrapper.getBoundingClientRect().bottom - drawn - (parseFloat(style.paddingBottom) || 0);
+			lift = Math.max(0, Math.round(foot + KEYBOARD_GAP - shown));
 		};
 		measure();
 		viewport.addEventListener('resize', measure);
 		viewport.addEventListener('scroll', measure);
+		document.addEventListener('scroll', measure, { capture: true, passive: true });
 		return () => {
 			viewport.removeEventListener('resize', measure);
 			viewport.removeEventListener('scroll', measure);
+			document.removeEventListener('scroll', measure, { capture: true });
 		};
 	});
 </script>
 
 <div
+	bind:this={wrapper}
 	class="ds-lib-composer-lift"
 	style="transform: translateY(-{lift}px); padding-bottom: {lift
 		? '0px'
@@ -239,7 +255,7 @@
 		</div>
 	{/if}
 
-	<div class="ds-lib-box">
+	<div class="ds-lib-box" bind:this={box}>
 		{#if files.length > 0}
 			<ul class="ds-lib-files">
 				{#each files as file, index (file.name + file.size)}
@@ -307,28 +323,16 @@
 			{/if}
 
 			{#if hasChoice}
-				<div role="group" aria-label={words.collectionsLabel} class="ds-lib-scopes">
-					<button
-						type="button"
-						class="ds-lib-scope-chip"
-						aria-pressed={collection === undefined}
-						class:is-chosen={collection === undefined}
-						onclick={() => oncollection?.(undefined)}
-					>
-						{words.allCollections}
-					</button>
-					{#each collections as choice (choice.name)}
-						<button
-							type="button"
-							class="ds-lib-scope-chip"
-							aria-pressed={collection === choice.name}
-							class:is-chosen={collection === choice.name}
-							onclick={() => oncollection?.(choice.name)}
-						>
-							{choice.summary || choice.name}
-						</button>
-					{/each}
-				</div>
+				<ScopePicker
+					{collections}
+					{collection}
+					{words}
+					anchor={box}
+					onchoose={(name) => {
+						oncollection?.(name);
+						textarea?.focus();
+					}}
+				/>
 			{:else if note}
 				<span class="ds-lib-note">{note}</span>
 			{/if}
@@ -362,7 +366,9 @@
 		transition: transform 150ms ease;
 	}
 
+	/* Positioned: the scope list is placed against it. */
 	.ds-lib-box {
+		position: relative;
 		border: 1px solid var(--ds-color-border);
 		border-radius: var(--ds-radius-xl);
 		background: var(--ds-color-surface-1);
@@ -500,7 +506,6 @@
 	.ds-lib-icon-button:focus-visible,
 	.ds-lib-stop:focus-visible,
 	.ds-lib-send:focus-visible,
-	.ds-lib-scope-chip:focus-visible,
 	.ds-lib-file-remove:focus-visible {
 		outline: 2px solid var(--ds-color-ring);
 		outline-offset: 2px;
@@ -521,45 +526,6 @@
 		opacity: 0.9;
 	}
 
-	/* Three chips in a narrow column clipped all three to fragments
-	   ("defence-s…", "All colle…"). Wrapping beats truncating: a chip a reader
-	   cannot finish reading is not a control, it is decoration. */
-	.ds-lib-scopes {
-		display: flex;
-		min-width: 0;
-		flex-wrap: wrap;
-		align-items: center;
-		gap: 0.25rem;
-	}
-
-	.ds-lib-scope-chip {
-		max-width: 100%;
-		overflow: hidden;
-		border: 1px solid transparent;
-		border-radius: var(--ds-radius-full);
-		background: none;
-		padding: 0.125rem 0.5rem;
-		color: var(--ds-color-muted-foreground);
-		font: inherit;
-		font-size: var(--ds-text-2xs);
-		text-overflow: ellipsis;
-		white-space: nowrap;
-		cursor: pointer;
-		transition:
-			color 150ms ease,
-			background-color 150ms ease;
-	}
-
-	.ds-lib-scope-chip:hover {
-		color: var(--ds-color-foreground);
-	}
-
-	.ds-lib-scope-chip.is-chosen {
-		border-color: color-mix(in oklab, var(--ds-color-primary) 40%, transparent);
-		background: color-mix(in oklab, var(--ds-color-primary) 15%, transparent);
-		color: var(--ds-color-foreground);
-	}
-
 	.ds-lib-spacer {
 		flex: 1;
 	}

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

@@ -1,15 +1,11 @@
 import { type ChatCopy } from '../../copy';
-/** A collection a person may read, as the app lists it: `name` is what a
- *  question is narrowed to, `summary` is what the picker shows. */
-export interface CollectionChoice {
-    name: string;
-    summary: string;
-}
+import type { CollectionChoice } from './choices';
 interface Props {
     value: string;
     running: boolean;
     /** The collections this person may read. The picker renders when there
-     *  are two or more: with one, or none, there is nothing to choose. */
+     *  are two or more: with one, or none, there is nothing to choose. It
+     *  is one control however many there are, searchable from eight. */
     collections?: CollectionChoice[];
     /** The collection the next question is narrowed to, by name; undefined
      *  asks across all of them. */

package/dist/components/composer/index.d.ts

@@ -1,3 +1,3 @@
 export { default as Composer } from './composer.svelte';
 export { default } from './composer.svelte';
-export type { CollectionChoice } from './composer.svelte';
+export type { CollectionChoice } from './choices';