From c89afc2b3820dad7a8b566868454d9c9033898a9 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 11:42:31 -0400
Subject: [PATCH 01/28] docs(plans): conversation export design

Design for #55: an opt-in header menu that copies the conversation as
Markdown or downloads it as Markdown or JSON, entirely in the browser.

Records the decisions that depart from or go beyond the issue text:
opt-in rather than on by default (embeds load the floating @1 CDN tag),
a new optional ChatMessage.createdAt so timestamps exist to export, and
the protections that stop one message damaging the rest of a rendered
transcript (unclosed code fences, single-newline line breaks, HTML block
openers).

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 .../2026-09-19-conversation-export-design.md  | 433 ++++++++++++++++++
 1 file changed, 433 insertions(+)
 create mode 100644 docs/plans/2026-09-19-conversation-export-design.md

diff --git a/docs/plans/2026-09-19-conversation-export-design.md b/docs/plans/2026-09-19-conversation-export-design.md
new file mode 100644
index 0000000..9f73cd2
--- /dev/null
+++ b/docs/plans/2026-09-19-conversation-export-design.md
@@ -0,0 +1,433 @@
+# Conversation export: design
+
+Issue: [#55](https://github.com/PMDevSolutions/Claudius/issues/55)
+Date: 2026-09-19
+Status: approved, implemented in the same PR as this document
+
+## Summary
+
+Add an opt-in `conversationExport` option to the widget. It puts an overflow
+menu in the chat header with three actions: copy the conversation to the
+clipboard as Markdown, download it as a Markdown file, and download it as a
+JSON file. Everything happens in the browser. Nothing is sent to the worker.
+
+Exporting timestamps requires recording them, so `ChatMessage` gains an
+optional `createdAt`. That is the only change outside the new feature. There
+is no worker, API, or wire-format change.
+
+## Facts that constrain the design
+
+These were checked against the code, MDN, and a local Node 24 (ICU 78.3) on
+2026-09-19. Several shaped the design more than the issue text did.
+
+1. **Messages carry no timestamp.** `ChatMessage` has `id`, `role`, `content`,
+   `sources`, `attachments`, and `toolUses`. The issue requires timestamps in
+   the Markdown export, so they have to be recorded first.
+2. **The worker ignores unknown message fields, and always has.** Today
+   `validateMessages` returns `{ role, content, attachments? }`. The very
+   first version of `worker/src/chat.ts` (b53d64a) already mapped each message
+   to `{ role, content }`. The widget has always sent `id`, and later
+   `sources` and `toolUses`, which every deployed worker discards. A new
+   optional field is therefore safe even for a worker that is never
+   redeployed.
+3. **Embeds load a floating tag.** The quick start documents
+   `cdn.jsdelivr.net/gh/PMDevSolutions/Claudius@1/cdn/claudius.iife.js`. A
+   minor release reaches every live site with no action by its owner, so a
+   feature that is on by default appears everywhere at once.
+4. **The widget renders very little Markdown.** `ChatMessage` handles bold,
+   italic, and URLs, and turns every newline into a `<br>`. Everything else,
+   code fences included, is shown as literal text. So "preserves code blocks"
+   cannot mean converting anything: it means not damaging text that is
+   already Markdown. It also means a single newline is a visible line break
+   on screen, while CommonMark treats it as a space. The default system
+   prompt tells the bot to "ALWAYS use line breaks between sentences", so
+   this is the normal case, not an edge case.
+5. **Partial replies are kept.** When a visitor stops a stream, or a stream
+   breaks after text has rendered, `useChat` keeps the partial reply as a
+   settled message. A reply cut off inside a code block leaves an unclosed
+   fence in the history.
+6. **Escape closes the chat from a document-level listener**
+   (`ChatWindow`), and the focus trap treats every enabled `button` as
+   focusable, whatever its `tabindex`.
+7. **Inline attachment bytes exist only in memory.** A `ChatAttachment` holds
+   base64 `data` until the worker stores the file. `stripAttachmentData`
+   removes it before anything is persisted.
+8. **Clipboard writes are restricted.** MDN: writing "can only be done in a
+   secure context"; in Firefox and Safari "writing requires transient
+   activation"; and `clipboard-write` "must be allowed for `<iframe>` elements
+   that access the clipboard". A refused write rejects with `NotAllowedError`.
+9. **`Intl.DateTimeFormat` has two traps.** `dateStyle` and `timeStyle` cannot
+   be combined with `timeZoneName` (it throws a `TypeError`). And the
+   separator before AM/PM depends on the engine and ICU version: some emit
+   U+202F (narrow no-break space), which looks identical but breaks string
+   comparison and some plain-text tools. ICU 78.3 emits a plain space, so the
+   behaviour cannot be reproduced locally and tests must not depend on it.
+
+## Approaches considered
+
+**A. A pure serializer, a small generic menu component, and thin wiring, with
+no dependencies (chosen).** The logic worth unit testing lives in one pure
+module. The menu knows nothing about export and can host later items.
+
+**B. A menu library** (Radix, Headless UI). Rejected. Either costs more gzip
+than the whole voice feature did (3.9 KB). Both render through a portal by
+default, which moves the popup outside `.claudius-root` and
+`[data-claudius-dark]`, losing theme tokens and dark mode, and outside the
+dialog's focus trap.
+
+**C. The native `popover` attribute.** Light dismiss and the top layer come
+free, but it supplies no menu keyboard behaviour, so roving focus still has
+to be written. Positioning it against the trigger needs CSS anchor
+positioning, which is not yet available everywhere, and jsdom implements
+none of it, so it could not be unit tested. Rejected.
+
+For timestamps, the alternative to a field on the message was a separate
+`id -> time` map inside `useChat`. It would keep the public type untouched,
+but the times would not persist with the history and would be missing from
+the JSON export, which the issue defines as the message array itself.
+Rejected.
+
+## Public API
+
+```ts
+// ChatWidgetProps / window.ClaudiusConfig
+conversationExport?: boolean; // Default false
+
+// ChatMessage
+createdAt?: string; // ISO 8601
+```
+
+- **Off by default. This departs from the issue**, whose wording ("can be
+  disabled per widget") implies on by default. Because of fact 3, on by
+  default would add a header button to every live embed the moment the
+  release is tagged, including any privacy-sensitive client, until that
+  client's snippet was changed. Opt-in matches `attachments` and `voice`,
+  keeps the new code unrendered for embeds that did not ask for it, and can
+  be flipped later without breaking anyone. The reverse change could not.
+- **Fails closed**, like `voice`. Only the literal `true` enables it. The
+  string `"false"` from a CMS template is truthy and must not switch it on.
+- **A boolean, not an options object.** One switch satisfies the issue.
+  Widening to `boolean | ConversationExportOptions` later is not a breaking
+  change.
+- Not named `export`: a reserved word cannot be destructured from props.
+- `<claudius-chat>` gains `conversation-export`. Present, or any value other
+  than `"false"`, enables it, the same rule as `attachments`.
+- `clients/_schema.json`, CLI validation, and both snippet generators accept
+  `widget.conversationExport`. Snippets emit it only when it is `true`.
+
+### `createdAt`
+
+- Set when `useChat` first adds a message to the conversation: on send for a
+  visitor message, on the first streamed token or tool call for a streamed
+  reply, on arrival for a blocking reply, and for replies synthesized by a
+  plugin (`respondWith` in `onBeforeSend` or `onError`).
+- Carried from the streaming placeholder to the settled message, so the time
+  does not jump when the reply completes.
+- Restored when a plugin returns a replacement message without it. A plugin
+  that builds a fresh object should not silently erase the time.
+- **Always recorded, whether or not export is enabled.** The message shape
+  should not depend on a display option, and a client that enables export
+  later gets timestamps for the conversations already in progress.
+- Optional. Messages persisted by an earlier version have none, and export
+  without a time.
+- It travels in the request body like `id` does, and the worker discards it
+  (fact 2).
+
+## Architecture
+
+```
+useChat      stamps createdAt on every message it creates
+ChatWidget   conversationExport === true
+             resolveSpeechLang(locale ?? detectLocale())  -> date locale
+  ChatWindow   useConversationExport(...)     menu items + status text
+    ChatHeader   actions={<HeaderMenu />}     nothing when the option is off
+    status pill  role="status", over the message list
+```
+
+| Unit | Responsibility |
+|------|----------------|
+| `utils/exportConversation.ts` | `conversationToMarkdown`, `conversationToJson`, `exportFilename`. Pure: no DOM, no clock unless one is passed in. |
+| `utils/saveText.ts` | `copyText` and `downloadTextFile`. The only code that touches the clipboard, `Blob`, and object URLs. No React. |
+| `hooks/useConversationExport.ts` | Turns messages, labels, and locale into the three menu items and a transient status message. |
+| `components/HeaderMenu.tsx` | Generic menu button: trigger, popup, roving focus, dismissal. Knows nothing about export. |
+| `components/ChatHeader.tsx` | Gains an optional `actions` slot, rendered before the close button. |
+
+The date locale reuses `resolveSpeechLang` from the voice feature. It already
+answers the same question, "which regional variant of the widget language
+does this visitor use", from `<html lang>` and `navigator.language`, so a UK
+visitor to an English widget gets `19 Sept 2026, 15:03` with no
+configuration.
+
+## Behavior
+
+### Markdown format
+
+````markdown
+# Chat transcript
+
+Exported Sep 19, 2026, 3:32 PM (GMT+01:00)
+
+## User · Sep 19, 2026, 3:03 PM
+
+What does the error in this screenshot mean?
+
+Attachments:
+
+- `error_v2.png` (image/png, 48 KB)
+
+## Assistant · Sep 19, 2026, 3:03 PM
+
+The response body is not valid JSON. Guard the parse:
+
+```js
+const data = JSON.parse(text);
+```
+
+Used tool: `get_current_time`
+
+Sources:
+
+1. [Parsing JSON \[guide\]](https://example.com/json_%28format%29)
+````
+
+- **Roles are "User" and "Assistant", not "You".** Every use case in the
+  issue is about handing the transcript to someone else, and "You" is wrong
+  for the person reading it.
+- **One heading per message** (`##`), role first, then the time when there is
+  one. Headings make a long transcript navigable and give a correct outline
+  under the `#` title.
+- **Dates** use `Intl.DateTimeFormat(locale, { dateStyle: "medium",
+  timeStyle: "short" })` in the visitor's time zone. No-break spaces (U+00A0,
+  U+202F) in the result are replaced with plain spaces (fact 9). An invalid
+  locale tag falls back to the browser default instead of throwing.
+- **The time zone appears once**, on the "Exported" line, as a UTC offset
+  from a second formatter using `timeZoneName: "longOffset"`, because the two
+  option styles cannot be combined (fact 9). An offset is enough for a reader
+  in another zone. An IANA name such as `America/Chicago` would disclose
+  coarse location for no extra benefit. Where `longOffset` is unsupported the
+  offset is omitted.
+- **Tool calls** appear as one line per tool, by name only, reusing the
+  existing `toolUsed` string. Inputs and results stay out of the Markdown:
+  the UI keeps them behind a disclosure, and they are in the JSON.
+- **Attachments** are listed by name, media type, and size. No bytes and no
+  signed URL: the URL expires, and a transcript is meant to be forwarded.
+- The welcome message is not exported. It is not part of `messages`, and the
+  window stops showing it once the conversation starts.
+
+### Message text
+
+Text is exported as written, with four protections. All of them exist to
+keep one message from damaging the rest of the transcript, or to make the
+rendered file match what the visitor saw.
+
+1. **An unclosed code fence is closed** (fact 5). Without this, a reply that
+   was stopped inside a code block swallows every later message into the
+   block when the file is rendered. The scanner follows CommonMark: a fence is
+   three or more backticks or tildes; it is closed only by the same character,
+   at least as long, with nothing after it; a backtick fence's info string
+   cannot contain a backtick. So a four-backtick block that contains
+   three-backtick lines survives intact. Unlike CommonMark, any amount of
+   leading whitespace is accepted, because models routinely indent fences
+   inside list items and almost never write indented code blocks. The closing
+   fence that gets added copies the opener's indentation so it stays inside
+   the same list item.
+2. **Single newlines become hard line breaks** (fact 4). Outside fenced code,
+   a non-blank line followed by another non-blank line has its trailing
+   whitespace replaced with two spaces. That is invisible in the raw file,
+   is ignored by viewers that already break on newlines, and makes strict
+   viewers show the sentence-per-line layout the visitor saw. Lines that
+   start with four or more spaces or a tab, or that end in a backslash, are
+   left alone: the first may be indented code and the second is already a
+   hard break. Two trailing spaces were chosen over a trailing backslash
+   because a viewer that does not understand the backslash prints it.
+3. **A `<` that could open an HTML block is escaped.** Outside fenced code, a
+   line that starts with `<` followed by a letter, `!`, `?`, or `/` gets a
+   backslash in front. In CommonMark a `<!--`, `<script`, `<pre`, `<style`,
+   or `<textarea` block runs until its terminator, across blank lines, so an
+   unterminated one hides the rest of the transcript, and GitHub drops
+   comments entirely. The widget shows such text literally, so the escaped
+   form is also the more faithful one. Inline HTML later in a line is left
+   alone: it cannot extend past its own paragraph.
+4. **Line endings are normalized** to `\n`, and trailing blank lines dropped.
+
+Code inside a fence is never modified: no hard breaks, no escaping, no
+trimming. That is what makes "long code blocks" safe.
+
+### Citations, filenames, and tool names
+
+- Source titles have `\`, `[`, and `]` escaped and whitespace collapsed to
+  single spaces, so a title cannot close the link text or span lines.
+- Source URLs go through the existing `sanitizeUrl`, which allows only
+  `http:` and `https:`. A source that fails is written as its title with no
+  link. In a passing URL the characters `(`, `)`, `<`, `>`, and whitespace are
+  percent-encoded so they cannot end the link destination.
+- Filenames and tool names go in a code span whose delimiter is one backtick
+  longer than the longest backtick run in the name, padded with a space when
+  the name starts or ends with a backtick. Nothing inside a code span needs
+  escaping, so `_draft_*final*.png` comes out intact, and so does a name that
+  itself contains backticks.
+
+### JSON format
+
+`JSON.stringify(stripAttachmentData(messages), null, 2)` plus a final
+newline: a bare `ChatMessage[]`, as the issue asks, with no envelope. Running
+it through `stripAttachmentData` makes the export exactly what the widget
+persists, and guarantees it never contains base64 (fact 7). `JSON.stringify`
+handles every special character.
+
+### The menu
+
+- A vertical-ellipsis button, 40 px like the close button beside it, labelled
+  "More options". It is rendered only when the option is on.
+- The trigger always works. **The items are disabled, not the trigger**, while
+  the conversation is empty or a reply is in flight. A menu that opens onto
+  three greyed-out actions explains what it is for, and a generic menu should
+  not be disabled as a whole once it holds items that are not about export.
+  Items use `aria-disabled` rather than `disabled`, so a focused control never
+  disappears from under the focus trap (fact 6).
+- Export waits for the reply instead of including it. A transcript whose last
+  message is silently cut short is worse than a control that is unavailable
+  for a few seconds.
+- Choosing an item closes the menu, returns focus to the trigger, and runs
+  the action.
+
+### Actions
+
+- **Copy** builds the Markdown synchronously and calls
+  `navigator.clipboard.writeText` inside the click handler, so the transient
+  activation Firefox and Safari require is still present (fact 8). If the API
+  is missing or rejects, as it does on an insecure origin or in an iframe
+  without `clipboard-write`, it falls back to a hidden `textarea` and
+  `document.execCommand("copy")`.
+- **Download** creates a `Blob` (`text/markdown;charset=utf-8` or
+  `application/json`), clicks a temporary `<a download>`, and revokes the
+  object URL afterwards. No byte-order mark: it is invalid in JSON and breaks
+  some Markdown tools.
+- Files are named `chat-transcript-YYYY-MM-DD.md` and `.json`, using the
+  visitor's local date assembled from `formatToParts`. The UTC date would be
+  a day off for part of the world, and assembling the parts avoids depending
+  on one locale's date pattern staying put.
+- **Status.** A copy reports "Copied to clipboard" or "Could not copy. Try
+  downloading instead." in a pill over the top of the message list, cleared
+  after four seconds or when the menu is next opened. Downloads show nothing:
+  the browser's own download UI is the confirmation.
+
+## Errors
+
+| Failure | Result |
+|---------|--------|
+| `clipboard.writeText` missing or rejected | Falls back to `execCommand("copy")` |
+| The fallback also fails | "Could not copy. Try downloading instead." |
+| Invalid locale tag | Dates use the browser's default locale |
+| `longOffset` unsupported | The "Exported" line omits the offset |
+| A source URL that is not http(s) | Title exported without a link |
+| A message with no `createdAt` | Heading shows the role alone |
+| Download blocked, as some in-app browsers do | Nothing the page can detect. Documented; copy still works |
+
+Serialization never throws on message content.
+
+## Accessibility
+
+- The WAI-ARIA menu button pattern. The trigger has `aria-haspopup="menu"`,
+  `aria-expanded`, and `aria-controls`. The popup is `role="menu"` labelled by
+  the trigger, and items are `role="menuitem"` buttons with `tabindex="-1"`.
+- Keys on the trigger: Enter, Space, and ArrowDown open the menu on its first
+  item; ArrowUp opens it on its last. In the menu: ArrowDown and ArrowUp wrap,
+  Home and End jump, Enter and Space activate, Escape closes and returns focus
+  to the trigger, Tab closes and lets focus move on. A pointer press outside
+  closes it.
+- **Escape closes only the menu.** The menu's handler calls `preventDefault()`
+  and `stopPropagation()`, and the chat's document-level listener (fact 6)
+  now also ignores events that are already `defaultPrevented`. With React 18
+  and 19, the supported range, the first alone would do, because React
+  listens on the root container, below `document`. The second makes the
+  behaviour independent of where a listener happens to be attached.
+- The focus trap needs no change. It counts the items as focusable, but they
+  are never the first or last control in the dialog, which is all it checks.
+- The status pill sits in a container that is always mounted with
+  `role="status"`, so the text is announced when it changes rather than when
+  the element appears, which screen readers handle unreliably.
+- Menu items are 40 px tall, above the WCAG 2.5.8 minimum. Nothing animates,
+  so there is nothing to reduce. Colours come from theme tokens, so the dark,
+  high-contrast, and custom themes apply without extra work.
+
+## Strings
+
+Twelve keys, translated in en, es, fr, and de (the parity test enforces it):
+`moreOptions`, `copyAsMarkdown`, `downloadAsMarkdown`, `downloadAsJson`,
+`copiedToClipboard`, `copyFailed`, `transcriptTitle`, `transcriptExported`
+(takes `{date}`), `transcriptUser`, `transcriptAssistant`,
+`transcriptAttachments`, `transcriptSources`.
+
+The transcript is written in the widget's language, because the visitor is
+the one who reads it first.
+
+## Testing
+
+Test-first.
+
+- `utils/exportConversation`: roles and headings; timestamps present and
+  absent; per-locale dates with a fixed `timeZone`; no-break space
+  normalization through an injected formatter, since the local ICU does not
+  emit one; a 5,000-line code block byte for byte; unclosed fences with
+  backticks and tildes, nested longer fences, info strings, and fences
+  indented inside list items; hard breaks only outside code, and none on
+  indented or backslash-terminated lines; `<!--` and `<script` at line start;
+  CRLF; source titles with brackets, backslashes, and newlines; URLs with
+  parentheses, spaces, and angle brackets; `javascript:` URLs; filenames with
+  backticks, underscores, and asterisks; emoji and right-to-left text; a
+  message with attachments and no text; an empty conversation; no base64 in
+  either format; the JSON parses back to the stripped messages; filenames use
+  the local date.
+- `HeaderMenu`: ARIA wiring, every key above, outside press, focus return,
+  disabled items do not fire, and Escape closing the menu while the chat
+  stays open.
+- `useChat`: `createdAt` on visitor, streamed, blocking, canned, and recovered
+  messages; unchanged from placeholder to settled reply; persisted; restored
+  after a plugin replaces the message. Fake timers keep it deterministic.
+- `ChatWindow` and `ChatWidget`: no menu by default; items disabled when empty
+  or loading; copy success, fallback, and failure; download type and filename;
+  non-`true` values do not enable the option.
+- Embed attribute and `ClaudiusConfig`, client-config validation, both
+  snippet generators.
+- One Playwright spec: a real download (`page.waitForEvent("download")`), the
+  clipboard in Chromium, where the permission can be granted, and Escape.
+
+## Documentation
+
+New `configuration/conversation-export.md`: enabling it in each embed style,
+what each format contains with an example, and a privacy section. That
+section says plainly that export runs entirely in the browser; that a
+transcript contains whatever the conversation contains, including anything
+the PII plugin did not redact; that the JSON can include attachment storage
+keys and signed URLs when R2 storage is on; and that a transcript is an
+editable text file, so it is not proof of what the assistant said. Updates to
+the widget options table, the localization string table, the clients page,
+the FAQ, and `CLAUDE.md`.
+
+## Bundle budget
+
+Everything ships in the main bundle: the IIFE build cannot code-split.
+Budgets are raised to measured size plus 5%, in their own commit with the
+deltas against `main`, per CONTRIBUTING.
+
+## Acceptance criteria
+
+| Criterion | How it is met |
+|-----------|---------------|
+| Header overflow menu with Copy as Markdown, Download as Markdown, Download as JSON | A generic `HeaderMenu` in the chat header with those three items |
+| Markdown preserves roles, timestamps, code blocks, and citations | Met. Timestamps needed a new `createdAt`, so messages persisted before the upgrade export without one |
+| JSON is the raw `Message[]` shape the widget stores | Met: a bare `ChatMessage[]`, as persisted, which means without inline attachment bytes |
+| Can be disabled per widget for privacy-sensitive deployments | Met across all four configuration surfaces, **as an opt-in**. See Public API for why this departs from the issue |
+| Unit tests for serialization edge cases | Met. See Testing |
+
+## Out of scope, possible follow-ups
+
+- Flipping the default to on, once the feature has run in production.
+- A "Clear conversation" menu item. `useChat` already exposes
+  `clearMessages`, and the menu is now there to hold it.
+- Importing a JSON export to restore a conversation.
+- Per-format switches, PDF or HTML export, emailing a transcript.
+- Escaping inline HTML, which needs a code-span-aware scanner. A Markdown
+  viewer is responsible for sanitizing what it renders, as with any file.
+- Exporting the welcome message.

From 43de4ecdebc0750e4f3258ad36b6b465aae6b2c9 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 12:09:59 -0400
Subject: [PATCH 02/28] docs(plans): conversation export implementation plan

Fourteen test-first tasks for #55, each with its own code, commands,
and expected results. The code for the four self-contained units (text
protections, serializers, clipboard and download helpers, header menu)
was extracted from the plan and run before committing: 53 tests, ESLint,
and Prettier, which turned up a missing focus() in the copy fallback and
two jsx-a11y violations that CI would otherwise have caught later.

The design follows one refinement made along the way: Tab is left to
the browser and the menu closes as focus leaves it, instead of closing
on the keystroke and unmounting the focused item under it.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 .../2026-09-19-conversation-export-design.md  |   13 +-
 ...9-19-conversation-export-implementation.md | 3541 +++++++++++++++++
 2 files changed, 3550 insertions(+), 4 deletions(-)
 create mode 100644 docs/plans/2026-09-19-conversation-export-implementation.md

diff --git a/docs/plans/2026-09-19-conversation-export-design.md b/docs/plans/2026-09-19-conversation-export-design.md
index 9f73cd2..106fbb6 100644
--- a/docs/plans/2026-09-19-conversation-export-design.md
+++ b/docs/plans/2026-09-19-conversation-export-design.md
@@ -333,9 +333,13 @@ Serialization never throws on message content.
   the trigger, and items are `role="menuitem"` buttons with `tabindex="-1"`.
 - Keys on the trigger: Enter, Space, and ArrowDown open the menu on its first
   item; ArrowUp opens it on its last. In the menu: ArrowDown and ArrowUp wrap,
-  Home and End jump, Enter and Space activate, Escape closes and returns focus
-  to the trigger, Tab closes and lets focus move on. A pointer press outside
-  closes it.
+  Home and End jump, Enter and Space activate, and Escape closes and returns
+  focus to the trigger. Tab is left to the browser, and the menu closes as
+  focus leaves it; closing on the keystroke instead would unmount the focused
+  item before the browser had moved on from it. Shift+Tab closes the menu and
+  returns to the trigger, where it would land anyway. A pointer press outside
+  closes it too, which a blur handler alone would miss in Safari, since Safari
+  does not focus a button when it is clicked.
 - **Escape closes only the menu.** The menu's handler calls `preventDefault()`
   and `stopPropagation()`, and the chat's document-level listener (fact 6)
   now also ignores events that are already `defaultPrevented`. With React 18
@@ -360,7 +364,8 @@ Twelve keys, translated in en, es, fr, and de (the parity test enforces it):
 `transcriptAttachments`, `transcriptSources`.
 
 The transcript is written in the widget's language, because the visitor is
-the one who reads it first.
+the one who reads it first. The two list labels carry their own colon, as the
+existing `toolUsed` string does, because French puts a space before it.
 
 ## Testing
 
diff --git a/docs/plans/2026-09-19-conversation-export-implementation.md b/docs/plans/2026-09-19-conversation-export-implementation.md
new file mode 100644
index 0000000..98009a0
--- /dev/null
+++ b/docs/plans/2026-09-19-conversation-export-implementation.md
@@ -0,0 +1,3541 @@
+# Conversation Export Implementation Plan (issue #55)
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** An opt-in header menu that copies the conversation as Markdown, or downloads it as Markdown or JSON, entirely in the browser.
+
+**Architecture:** A pure serializer module holds all transcript logic. A generic accessible `HeaderMenu` component knows nothing about export. A `useConversationExport` hook turns messages into menu items plus a transient status. `useChat` starts stamping `createdAt` on every message so there are timestamps to export.
+
+**Tech Stack:** React 18/19, TypeScript strict, Tailwind 3.4 theme tokens, Vitest 4 + React Testing Library + user-event 14, Playwright, `Intl.DateTimeFormat`. No new dependencies.
+
+**Spec:** `docs/plans/2026-09-19-conversation-export-design.md`. Read it first. This plan argues from it.
+
+## Global Constraints
+
+- **No new runtime or dev dependencies.**
+- **Off by default, fails closed.** Only the literal `true` enables the feature. The string `"false"`, `"true"`, `1`, or an object must not.
+- **Renders nothing when off.** No menu, no status region. An existing test does `screen.getByRole("status")` for the typing indicator; a second always-present status region would break it.
+- **The option is named `conversationExport`** (prop, `ClaudiusConfig` key, client JSON key) and `conversation-export` (HTML attribute). Never `export`.
+- **The timestamp field is `createdAt`**, an ISO 8601 string, optional.
+- **Code inside a fenced block is never modified.**
+- **Serialization never throws on message content.**
+- **No em dashes** in code comments, strings, or docs. The repo avoids them.
+- **Every new key in `ClaudiusTranslations`, the new prop, and `createdAt` need a TSDoc comment.** CI runs `typedoc --emit none`, which fails on undocumented public API.
+- **Run tools directly on the maintainer's machine.** pnpm 11 breaks `pnpm test` / `pnpm build` in `widget/`. From `widget/` use `./node_modules/.bin/vitest`, `./node_modules/.bin/tsc`, `./node_modules/.bin/eslint`, `./node_modules/.bin/prettier`, `./node_modules/.bin/vite`. CI uses the pnpm scripts and is unaffected.
+- **Stage explicit paths only.** Never `git add -A` or `git add .`. The working tree holds unrelated local changes (`.mcp.json`, `.claude/`, `signup-state.png`) and untracked `pnpm-workspace.yaml` scaffolds that must never be committed.
+- **Format before every commit.** From `widget/`, run `./node_modules/.bin/prettier --write` on each `src/` file the task created or changed, then `./node_modules/.bin/eslint` on the same files. Code blocks in this plan are not all wrapped the way Prettier wants, and CI's `format:check` fails on the difference. The pre-commit hook also runs `eslint --fix` and `prettier --write` on staged `widget/src/**/*.{ts,tsx}`, but do not rely on it alone. The widget has no `eslint-disable` comments; do not add one.
+- **CI runs widget tests on Node 20**, whose ICU puts U+202F before "PM". Local Node 24 does not. Never assert on raw `Intl` output. Assert on serializer output, which normalizes it, and pin `timeZone: "Asia/Kolkata"` (fixed +05:30, no DST) wherever an exact date string is compared.
+- End every commit message with `Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>`.
+
+## File Structure
+
+Create:
+
+| File | Responsibility |
+|------|----------------|
+| `widget/src/utils/exportConversation.ts` | `protectMessageText`, `conversationToMarkdown`, `conversationToJson`, `exportFilename`. Pure. |
+| `widget/src/utils/saveText.ts` | `copyText`, `downloadTextFile`. The only DOM side effects. |
+| `widget/src/components/HeaderMenu.tsx` | Generic menu button. |
+| `widget/src/hooks/useConversationExport.ts` | Messages to menu items plus status. |
+| `widget/src/utils/__tests__/exportConversation.test.ts` | |
+| `widget/src/utils/__tests__/saveText.test.ts` | |
+| `widget/src/components/__tests__/HeaderMenu.test.tsx` | |
+| `widget/src/hooks/__tests__/useConversationExport.test.ts` | |
+| `widget/src/hooks/__tests__/useChat.timestamps.test.ts` | |
+| `widget/src/components/__tests__/ChatWindow.export.test.tsx` | |
+| `widget/src/components/__tests__/ChatWidget.export.test.tsx` | |
+| `widget/e2e/export.spec.ts` | |
+| `scripts/lib/__tests__/conversation-export-config.test.ts` | |
+| `docs/src/content/docs/configuration/conversation-export.md` | |
+
+Modify: `widget/src/api/types.ts`, `widget/src/hooks/useChat.ts`, `widget/src/i18n.ts`, `widget/src/locales/{en,es,fr,de}.ts`, `widget/src/components/ChatHeader.tsx`, `widget/src/components/ChatHeader.stories.tsx`, `widget/src/components/ChatWindow.tsx`, `widget/src/components/ChatWidget.tsx`, `widget/src/embed.tsx`, `widget/src/main.tsx`, `widget/src/__tests__/embed.test.tsx`, `scripts/lib/config.ts`, `scripts/lib/snippet.ts`, `clients/_schema.json`, four docs pages, `CLAUDE.md`, `widget/.size-limit.json`.
+
+---
+
+### Task 1: Record `createdAt` on every message
+
+**Files:**
+- Modify: `widget/src/api/types.ts` (the `ChatMessage` interface)
+- Modify: `widget/src/hooks/useChat.ts`
+- Test: `widget/src/hooks/__tests__/useChat.timestamps.test.ts` (create)
+
+**Interfaces:**
+- Produces: `ChatMessage.createdAt?: string` (ISO 8601). Tasks 3 and 7 read it.
+
+- [ ] **Step 1: Write the failing tests**
+
+Create `widget/src/hooks/__tests__/useChat.timestamps.test.ts`. Only `Date` is faked: faking timers too would stall `waitFor`.
+
+```ts
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { useChat } from "../useChat";
+import type { ClaudiusPlugin } from "../../plugins/types";
+
+const API_URL = "https://test.workers.dev";
+const STORAGE_KEY = "claudius:messages:test.workers.dev";
+const T1 = "2026-09-19T14:03:00.000Z";
+const T2 = "2026-09-19T14:03:05.000Z";
+const T3 = "2026-09-19T14:03:09.000Z";
+
+const mockFetch = vi.fn();
+globalThis.fetch = mockFetch;
+
+const encoder = new TextEncoder();
+
+function sseStream() {
+  let controller!: ReadableStreamDefaultController<Uint8Array>;
+  const body = new ReadableStream<Uint8Array>({
+    start(c) {
+      controller = c;
+    },
+  });
+  return {
+    response: {
+      ok: true,
+      status: 200,
+      headers: new Headers({ "Content-Type": "text/event-stream" }),
+      body,
+    },
+    emit(event: string, data: unknown) {
+      controller.enqueue(
+        encoder.encode(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`),
+      );
+    },
+    close() {
+      controller.close();
+    },
+  };
+}
+
+/** Resolve a blocking reply, moving the clock to `at` as it arrives. */
+function mockReplyAt(reply: string, at: string) {
+  mockFetch.mockImplementationOnce(async () => {
+    vi.setSystemTime(new Date(at));
+    return {
+      ok: true,
+      status: 200,
+      headers: new Headers(),
+      json: () => Promise.resolve({ reply }),
+    };
+  });
+}
+
+describe("useChat timestamps", () => {
+  beforeEach(() => {
+    mockFetch.mockReset();
+    sessionStorage.clear();
+    vi.useFakeTimers({ toFake: ["Date"] });
+    vi.setSystemTime(new Date(T1));
+  });
+  afterEach(() => vi.useRealTimers());
+
+  it("stamps the visitor message on send and the reply on arrival", async () => {
+    mockReplyAt("Hello!", T2);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    await act(async () => {
+      await result.current.sendMessage("Hi");
+    });
+
+    expect(result.current.messages[0].createdAt).toBe(T1);
+    expect(result.current.messages[1].createdAt).toBe(T2);
+  });
+
+  it("keeps a streamed reply's time from its first token", async () => {
+    const stream = sseStream();
+    mockFetch.mockResolvedValueOnce(stream.response);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    let sendPromise!: Promise<void>;
+    act(() => {
+      sendPromise = result.current.sendMessage("Hi");
+    });
+    await waitFor(() => expect(mockFetch).toHaveBeenCalledTimes(1));
+
+    vi.setSystemTime(new Date(T2));
+    act(() => stream.emit("chunk", { text: "Hel" }));
+    await waitFor(() => expect(result.current.messages).toHaveLength(2));
+    expect(result.current.messages[1].createdAt).toBe(T2);
+
+    vi.setSystemTime(new Date(T3));
+    act(() => {
+      stream.emit("done", { reply: "Hello!" });
+      stream.close();
+    });
+    await act(async () => {
+      await sendPromise;
+    });
+
+    expect(result.current.messages[1].content).toBe("Hello!");
+    expect(result.current.messages[1].createdAt).toBe(T2);
+  });
+
+  it("persists the timestamps with the history", async () => {
+    mockReplyAt("Hello!", T2);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    await act(async () => {
+      await result.current.sendMessage("Hi");
+    });
+
+    const stored = JSON.parse(sessionStorage.getItem(STORAGE_KEY) ?? "[]");
+    expect(stored.map((m: { createdAt?: string }) => m.createdAt)).toEqual([
+      T1,
+      T2,
+    ]);
+  });
+
+  it("leaves messages restored from an older version without a time", () => {
+    sessionStorage.setItem(
+      STORAGE_KEY,
+      JSON.stringify([{ id: "msg-1", role: "user", content: "old" }]),
+    );
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    expect(result.current.messages[0].createdAt).toBeUndefined();
+  });
+
+  it("restores the time when a plugin returns a fresh message object", async () => {
+    mockReplyAt("hello", T2);
+    const rebuild: ClaudiusPlugin = {
+      name: "rebuild",
+      onBeforeSend: (m) => ({ id: m.id, role: m.role, content: m.content }),
+      onAfterReceive: (m) => ({
+        id: m.id,
+        role: m.role,
+        content: m.content.toUpperCase(),
+      }),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [rebuild] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hi");
+    });
+
+    expect(result.current.messages[0].createdAt).toBe(T1);
+    expect(result.current.messages[1]).toMatchObject({
+      content: "HELLO",
+      createdAt: T2,
+    });
+  });
+
+  it("stamps both sides of a reply a plugin answered locally", async () => {
+    const canned: ClaudiusPlugin = {
+      name: "canned",
+      onBeforeSend: (_m, ctx) => ctx.respondWith("We open at 9."),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [canned] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hours?");
+    });
+
+    expect(mockFetch).not.toHaveBeenCalled();
+    expect(result.current.messages.map((m) => m.createdAt)).toEqual([T1, T1]);
+  });
+
+  it("stamps a fallback reply a plugin supplied after an error", async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: false,
+      status: 500,
+      headers: new Headers(),
+      json: () => Promise.resolve({ error: "boom", code: "UNKNOWN_ERROR" }),
+    });
+    const recover: ClaudiusPlugin = {
+      name: "recover",
+      onError: (_e, ctx) => ctx.respondWith("We're offline."),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [recover] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hi");
+    });
+
+    expect(result.current.messages.at(-1)).toMatchObject({
+      role: "assistant",
+      createdAt: T1,
+    });
+  });
+});
+```
+
+- [ ] **Step 2: Run the tests and confirm they fail**
+
+Run from `widget/`: `./node_modules/.bin/vitest run src/hooks/__tests__/useChat.timestamps.test.ts`
+Expected: FAIL. TypeScript-level: `createdAt` does not exist on `ChatMessage`. Runtime: `expected undefined to be '2026-09-19T14:03:00.000Z'`. The "older version" test passes already; that is fine.
+
+- [ ] **Step 3: Add the field to the type**
+
+In `widget/src/api/types.ts`, inside `interface ChatMessage`, after the `toolUses` member:
+
+```ts
+  /**
+   * ISO 8601 time the message was added to the conversation. Absent on
+   * messages persisted by widget versions that predate conversation export.
+   */
+  createdAt?: string;
+```
+
+- [ ] **Step 4: Stamp it in `useChat`**
+
+All edits are in `widget/src/hooks/useChat.ts`.
+
+After the `DEFAULT_STORAGE_KEY_PREFIX` constant add:
+
+```ts
+/** Timestamp for a message entering the conversation. */
+const timestamp = () => new Date().toISOString();
+```
+
+In `upsertPlaceholder`, replace the placeholder literal:
+
+```ts
+            {
+              id: placeholderId,
+              role: "assistant",
+              content: "",
+              createdAt: timestamp(),
+              ...patch,
+            },
+```
+
+Replace the block that builds the settled reply and runs `runAfterReceive`:
+
+```ts
+        // A streamed reply keeps the time its first token arrived.
+        const createdAt =
+          messagesRef.current.find((m) => m.id === placeholderId)?.createdAt ??
+          timestamp();
+        let assistantMessage: ChatMessage = {
+          id: placeholderId ?? nextId(),
+          role: "assistant",
+          content: reply,
+          createdAt,
+          sources,
+          toolUses,
+        };
+        // A cancelled reply is intentionally partial; don't hand it to
+        // afterReceive plugins as if it were a complete answer.
+        if (pluginsRef.current.length > 0 && !aborted) {
+          assistantMessage = await runAfterReceive(
+            pluginsRef.current,
+            assistantMessage,
+            { messages: msgsToSend, apiUrl },
+          );
+          // A plugin that returns a fresh object should not erase the time.
+          if (!assistantMessage.createdAt) {
+            assistantMessage = { ...assistantMessage, createdAt };
+          }
+        }
+```
+
+In the `runError` recovery branch, add `createdAt: timestamp(),` to the `assistantMessage` literal, after `content`.
+
+In `sendMessage`, add `createdAt: timestamp(),` to the `userMessage` literal, after `content`. Then, inside `if (pluginsRef.current.length > 0) {`, directly after the `runBeforeSend` call and the `abort` check, add:
+
+```ts
+        // A plugin that returns a fresh object should not erase the time.
+        const keepTime = (m: ChatMessage): ChatMessage =>
+          m.createdAt ? m : { ...m, createdAt: userMessage.createdAt };
+```
+
+In the `respond` branch, add `createdAt: timestamp(),` to its `assistantMessage` literal, and change the `next` array to use `keepTime(outcome.message)` in place of `outcome.message`. Change the final assignment to `outgoing = keepTime(outcome.message);`.
+
+- [ ] **Step 5: Run the new tests, then the whole suite**
+
+Run: `./node_modules/.bin/vitest run src/hooks/__tests__/useChat.timestamps.test.ts`
+Expected: 7 passed.
+
+Run: `./node_modules/.bin/vitest run`
+Expected: all files pass (46 existing files plus this one). No existing test should change: they use `toMatchObject`, and the only exact-shape assertions are on messages loaded from storage, which are not stamped.
+
+Run: `./node_modules/.bin/tsc --noEmit && ./node_modules/.bin/typedoc --emit none`
+Expected: both exit 0.
+
+- [ ] **Step 6: Commit**
+
+```bash
+git add widget/src/api/types.ts widget/src/hooks/useChat.ts widget/src/hooks/__tests__/useChat.timestamps.test.ts
+git commit -m "feat(widget): record createdAt on chat messages" -m "Conversation export (#55) needs timestamps, and messages had none. Stamped where useChat creates a message, kept from the streaming placeholder to the settled reply, and restored when a plugin returns a fresh object. Workers discard unknown message fields, so nothing changes on the wire that matters." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 2: Message text protections
+
+**Files:**
+- Create: `widget/src/utils/exportConversation.ts`
+- Test: `widget/src/utils/__tests__/exportConversation.test.ts` (create)
+
+**Interfaces:**
+- Produces: `protectMessageText(text: string): string`. Task 3 calls it once per message.
+
+- [ ] **Step 1: Write the failing tests**
+
+Create `widget/src/utils/__tests__/exportConversation.test.ts`:
+
+```ts
+import { describe, it, expect } from "vitest";
+import { protectMessageText } from "../exportConversation";
+
+describe("protectMessageText", () => {
+  describe("code fences", () => {
+    it("keeps a long code block byte for byte", () => {
+      const code = Array.from(
+        { length: 5000 },
+        (_, i) => `  line ${i}   `,
+      ).join("\n");
+      const text = "Here:\n\n```txt\n" + code + "\n```";
+      expect(protectMessageText(text)).toBe(text);
+    });
+
+    it("closes a fence left open by a stopped reply", () => {
+      expect(protectMessageText("Try:\n\n```js\nconst a = 1;")).toBe(
+        "Try:\n\n```js\nconst a = 1;\n```",
+      );
+    });
+
+    it("closes with the opener's character, length, and indentation", () => {
+      expect(protectMessageText("1. Run:\n\n   ~~~~bash\n   npm i")).toBe(
+        "1. Run:\n\n   ~~~~bash\n   npm i\n   ~~~~",
+      );
+    });
+
+    it("does not end a longer fence at a shorter one inside it", () => {
+      const text = "````md\n```js\ncode\n```\n````";
+      expect(protectMessageText(text)).toBe(text);
+    });
+
+    it("does not end a fence at a line that carries an info string", () => {
+      expect(protectMessageText("```\n```js\nx")).toBe("```\n```js\nx\n```");
+    });
+
+    it("does not end a backtick fence with tildes", () => {
+      expect(protectMessageText("```\n~~~\nx")).toBe("```\n~~~\nx\n```");
+    });
+
+    it("treats three backticks followed by more backticks as inline code", () => {
+      expect(protectMessageText("```not a fence``` here\nnext")).toBe(
+        "```not a fence``` here  \nnext",
+      );
+    });
+  });
+
+  describe("hard line breaks", () => {
+    it("turns a single newline into a hard break, and leaves blank lines", () => {
+      expect(protectMessageText("One.\nTwo.\n\nThree.")).toBe(
+        "One.  \nTwo.\n\nThree.",
+      );
+    });
+
+    it("adds none inside code, on indented lines, or after a backslash", () => {
+      expect(protectMessageText("```\na\nb\n```")).toBe("```\na\nb\n```");
+      expect(protectMessageText("    a\n    b")).toBe("    a\n    b");
+      expect(protectMessageText("\ta\n\tb")).toBe("\ta\n\tb");
+      expect(protectMessageText("a\\\nb")).toBe("a\\\nb");
+    });
+
+    it("replaces existing trailing whitespace instead of stacking on it", () => {
+      expect(protectMessageText("One. \t\nTwo.")).toBe("One.  \nTwo.");
+    });
+  });
+
+  describe("HTML blocks", () => {
+    it("escapes a line-leading < that could open an unterminated block", () => {
+      expect(protectMessageText("<!-- note")).toBe("\\<!-- note");
+      expect(protectMessageText("<script>alert(1)")).toBe("\\<script>alert(1)");
+      expect(protectMessageText("</div>")).toBe("\\</div>");
+      expect(protectMessageText("  <?php")).toBe("  \\<?php");
+    });
+
+    it("leaves < alone inside code, mid-line, and when it is not a tag", () => {
+      expect(protectMessageText("```html\n<script>\n```")).toBe(
+        "```html\n<script>\n```",
+      );
+      expect(protectMessageText("a < b and <b>bold</b>")).toBe(
+        "a < b and <b>bold</b>",
+      );
+      expect(protectMessageText("< 5 items")).toBe("< 5 items");
+    });
+  });
+
+  it("normalizes CRLF and drops trailing blank lines", () => {
+    expect(protectMessageText("One.\r\nTwo.\r\n\r\n")).toBe("One.  \nTwo.");
+  });
+
+  it("passes emoji and right-to-left text through untouched", () => {
+    const text = "שלום 👋 مرحبا";
+    expect(protectMessageText(text)).toBe(text);
+  });
+
+  it("returns an empty string for empty or whitespace-only text", () => {
+    expect(protectMessageText("")).toBe("");
+    expect(protectMessageText("  \n\n")).toBe("");
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
+Expected: FAIL, cannot resolve `../exportConversation`.
+
+- [ ] **Step 3: Implement**
+
+Create `widget/src/utils/exportConversation.ts`:
+
+```ts
+interface OpenFence {
+  indent: string;
+  char: string;
+  length: number;
+}
+
+const FENCE_OPEN = /^([ \t]*)(`{3,}|~{3,})(.*)$/;
+// A line-leading "<" that CommonMark could read as the start of an HTML block.
+const HTML_BLOCK_START = /^( {0,3})<(?=[A-Za-z!?/])/;
+const INDENTED = /^(?: {4}|\t)/;
+
+/**
+ * CommonMark fences, except that any indentation is accepted: models indent
+ * fences inside list items all the time and almost never write indented code.
+ */
+function parseFenceOpen(line: string): OpenFence | null {
+  const match = FENCE_OPEN.exec(line);
+  if (!match) return null;
+  const [, indent, run, info] = match;
+  // A backtick fence's info string cannot contain a backtick. Such a line is
+  // inline code that happens to start the line.
+  if (run[0] === "`" && info.includes("`")) return null;
+  return { indent, char: run[0], length: run.length };
+}
+
+/** A closer is the opener's character alone, at least as many times. */
+function closesFence(line: string, fence: OpenFence): boolean {
+  const trimmed = line.trim();
+  if (trimmed.length < fence.length) return false;
+  for (const ch of trimmed) {
+    if (ch !== fence.char) return false;
+  }
+  return true;
+}
+
+/**
+ * Prepare one message's text for a Markdown transcript. The text is kept as
+ * written, with protections that stop it damaging the rest of the file or
+ * rendering differently from how the widget showed it:
+ *
+ * - an unclosed code fence is closed, so a reply stopped inside a code block
+ *   does not swallow every later message;
+ * - a single newline becomes a hard line break, because the widget shows
+ *   every newline as a line break while Markdown treats it as a space;
+ * - a line-leading `<` is escaped, so an unterminated HTML block or comment
+ *   cannot hide what follows it;
+ * - line endings are normalized and trailing blank lines dropped.
+ *
+ * Text inside a fenced block is never modified.
+ */
+export function protectMessageText(text: string): string {
+  const lines = text.replace(/\r\n?/g, "\n").replace(/\s+$/, "").split("\n");
+  const out: string[] = [];
+  let fence: OpenFence | null = null;
+
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+
+    if (fence) {
+      out.push(line);
+      if (closesFence(line, fence)) fence = null;
+      continue;
+    }
+
+    const opened = parseFenceOpen(line);
+    if (opened) {
+      fence = opened;
+      out.push(line);
+      continue;
+    }
+
+    let result = line.replace(HTML_BLOCK_START, "$1\\<");
+    const next = lines[i + 1];
+    const breakable =
+      line.trim() !== "" &&
+      next !== undefined &&
+      next.trim() !== "" &&
+      // Possibly indented code, where trailing spaces would be content.
+      !INDENTED.test(line) &&
+      // Already a hard break.
+      !line.endsWith("\\");
+    if (breakable) result = result.replace(/[ \t]+$/, "") + "  ";
+    out.push(result);
+  }
+
+  if (fence) out.push(fence.indent + fence.char.repeat(fence.length));
+  return out.join("\n");
+}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
+Expected: 15 passed.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/utils/exportConversation.ts widget/src/utils/__tests__/exportConversation.test.ts
+git commit -m "feat(widget): message text protections for Markdown export" -m "Closes unclosed code fences, turns single newlines into hard breaks outside code, and escapes a line-leading < so an unterminated HTML block cannot hide later messages. Code inside a fence is never touched." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 3: Markdown and JSON serializers
+
+**Files:**
+- Modify: `widget/src/utils/exportConversation.ts`
+- Test: `widget/src/utils/__tests__/exportConversation.test.ts`
+
+**Interfaces:**
+- Consumes: `protectMessageText` (Task 2); `ChatMessage.createdAt` (Task 1); existing `formatBytes` and `stripAttachmentData` from `./attachments`, `interpolate` from `./interpolate`, `sanitizeUrl` from `./sanitize`.
+- Produces:
+  ```ts
+  interface TranscriptLabels {
+    title: string; exported: string; user: string; assistant: string;
+    attachments: string; sources: string; toolUsed: string;
+  }
+  interface MarkdownExportOptions {
+    labels: TranscriptLabels; locale?: string; timeZone?: string;
+    now?: Date; formatDate?: (date: Date) => string;
+  }
+  conversationToMarkdown(messages: readonly ChatMessage[], options: MarkdownExportOptions): string
+  conversationToJson(messages: readonly ChatMessage[]): string
+  exportFilename(extension: "md" | "json", options?: { now?: Date; timeZone?: string }): string
+  ```
+  `labels.attachments`, `labels.sources`, and `labels.toolUsed` **include their own colon** (`"Sources:"`), like the existing `toolUsed` string, because French puts a space before it.
+
+- [ ] **Step 1: Write the failing tests**
+
+Change the imports at the top of `exportConversation.test.ts` to:
+
+```ts
+import { describe, it, expect, vi } from "vitest";
+import {
+  conversationToJson,
+  conversationToMarkdown,
+  exportFilename,
+  protectMessageText,
+  type TranscriptLabels,
+} from "../exportConversation";
+import type { ChatMessage } from "../../api/types";
+```
+
+Append to the file:
+
+```ts
+const labels: TranscriptLabels = {
+  title: "Chat transcript",
+  exported: "Exported {date}",
+  user: "User",
+  assistant: "Assistant",
+  attachments: "Attachments:",
+  sources: "Sources:",
+  toolUsed: "Used tool:",
+};
+
+// Asia/Kolkata is a fixed +05:30 with no DST, so exact strings are stable
+// across ICU versions. 14:32 UTC is 8:02 PM there.
+const base = {
+  labels,
+  locale: "en-US",
+  timeZone: "Asia/Kolkata",
+  now: new Date("2026-09-19T14:32:00.000Z"),
+};
+const T = "2026-09-19T14:03:00.000Z";
+
+describe("conversationToMarkdown", () => {
+  it("writes a title, the export time, and one heading per message", () => {
+    const messages: ChatMessage[] = [
+      { id: "msg-1", role: "user", content: "Hi", createdAt: T },
+      { id: "msg-2", role: "assistant", content: "Hello!", createdAt: T },
+    ];
+    expect(conversationToMarkdown(messages, base)).toBe(
+      [
+        "# Chat transcript",
+        "",
+        "Exported Sep 19, 2026, 8:02 PM (GMT+05:30)",
+        "",
+        "## User · Sep 19, 2026, 7:33 PM",
+        "",
+        "Hi",
+        "",
+        "## Assistant · Sep 19, 2026, 7:33 PM",
+        "",
+        "Hello!",
+        "",
+      ].join("\n"),
+    );
+  });
+
+  it("formats dates in the given locale", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: "Hallo", createdAt: T }],
+      { ...base, locale: "de-DE" },
+    );
+    expect(md).toContain("## User · 19.09.2026, 19:33");
+  });
+
+  it("falls back to the default locale when the tag is invalid", () => {
+    expect(() =>
+      conversationToMarkdown(
+        [{ id: "1", role: "user", content: "Hi", createdAt: T }],
+        { ...base, locale: "not a locale!" },
+      ),
+    ).not.toThrow();
+  });
+
+  it("replaces the no-break spaces some engines put in dates", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: "Hi", createdAt: T }],
+      { ...base, formatDate: () => "2:03\u202fPM\u00a0IST" },
+    );
+    expect(md).toContain("## User · 2:03 PM IST");
+    expect(md).not.toMatch(/[\u00a0\u202f]/);
+  });
+
+  it("omits the offset where longOffset is unsupported", () => {
+    const Real = Intl.DateTimeFormat;
+    // A regular function, not an arrow: it is called with `new`.
+    const spy = vi.spyOn(Intl, "DateTimeFormat").mockImplementation(function (
+      locale?: string | string[],
+      options?: Intl.DateTimeFormatOptions,
+    ) {
+      if (options?.timeZoneName) throw new RangeError("unsupported");
+      return new Real(locale, options);
+    } as unknown as typeof Intl.DateTimeFormat);
+
+    const md = conversationToMarkdown([], base);
+    spy.mockRestore();
+
+    expect(md).toBe("# Chat transcript\n\nExported Sep 19, 2026, 8:02 PM\n");
+  });
+
+  it("shows the role alone when a message has no usable time", () => {
+    const md = conversationToMarkdown(
+      [
+        { id: "1", role: "user", content: "old" },
+        { id: "2", role: "assistant", content: "bad", createdAt: "nonsense" },
+      ],
+      base,
+    );
+    expect(md).toContain("## User\n\nold");
+    expect(md).toContain("## Assistant\n\nbad");
+  });
+
+  it("applies the text protections to each message", () => {
+    const md = conversationToMarkdown(
+      [
+        { id: "1", role: "assistant", content: "```js\nconst a = 1;" },
+        { id: "2", role: "user", content: "Thanks.\nBye." },
+      ],
+      base,
+    );
+    expect(md).toContain("```js\nconst a = 1;\n```\n\n## User");
+    expect(md).toContain("Thanks.  \nBye.");
+  });
+
+  it("lists attachments by name, type, and size, and never their bytes", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "user",
+          content: "",
+          attachments: [
+            {
+              id: "att-1",
+              name: "_draft_*final*.png",
+              mediaType: "image/png",
+              size: 49152,
+              data: "QUJDREVGRw==",
+              url: "https://files.example.com/att/1?sig=secret",
+            },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "## User\n\nAttachments:\n\n- `_draft_*final*.png` (image/png, 48 KB)",
+    );
+    expect(md).not.toContain("QUJDREVGRw==");
+    expect(md).not.toContain("sig=secret");
+  });
+
+  it("sizes a code span to the backticks inside the name", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "user",
+          content: "",
+          attachments: [
+            { id: "a", name: "we`ird``.pdf", mediaType: "application/pdf", size: 10 },
+            { id: "b", name: "`edge`", mediaType: "application/pdf", size: 10 },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("- ```we`ird``.pdf``` (application/pdf, 10 B)");
+    expect(md).toContain("- `` `edge` `` (application/pdf, 10 B)");
+  });
+
+  it("names the tools a reply used, without their inputs or results", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "It is noon.",
+          toolUses: [
+            { name: "get_current_time", input: { tz: "UTC" }, result: "12:00" },
+            { name: "search_knowledge_base" },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "Used tool: `get_current_time`  \nUsed tool: `search_knowledge_base`",
+    );
+    expect(md).not.toContain("12:00");
+  });
+
+  it("writes citations as a numbered list of escaped links", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "See these.",
+          sources: [
+            {
+              title: "Parsing [JSON]\nguide \\ notes",
+              url: "https://example.com/json_(format)?q=a b&x=<y>",
+              type: "page",
+            },
+            { title: "MDN", url: "https://developer.mozilla.org/", type: "external" },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "Sources:\n\n" +
+        "1. [Parsing \\[JSON\\] guide \\\\ notes](https://example.com/json_%28format%29?q=a%20b&x=%3Cy%3E)\n" +
+        "2. [MDN](https://developer.mozilla.org/)",
+    );
+  });
+
+  it("drops the link, not the citation, when a URL is not http(s)", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "x",
+          sources: [{ title: "Click me", url: "javascript:alert(1)", type: "external" }],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("1. Click me");
+    expect(md).not.toContain("javascript:");
+  });
+
+  it("exports an empty conversation as the header alone", () => {
+    expect(conversationToMarkdown([], base)).toBe(
+      "# Chat transcript\n\nExported Sep 19, 2026, 8:02 PM (GMT+05:30)\n",
+    );
+  });
+});
+
+describe("conversationToJson", () => {
+  const messages: ChatMessage[] = [
+    {
+      id: "msg-1",
+      role: "user",
+      content: 'Quote " slash \\ emoji 👋 separator \u2028 end',
+      createdAt: T,
+      attachments: [
+        { id: "att-1", name: "a.png", mediaType: "image/png", size: 3, data: "QUJD" },
+      ],
+    },
+    {
+      id: "msg-2",
+      role: "assistant",
+      content: "Hello!",
+      createdAt: T,
+      sources: [{ title: "Docs", url: "https://example.com", type: "page" }],
+    },
+  ];
+
+  it("is the message array itself, pretty-printed, ending in a newline", () => {
+    const json = conversationToJson(messages);
+    expect(json.endsWith("\n")).toBe(true);
+    expect(json).toContain('\n  {\n    "id": "msg-1"');
+    const parsed = JSON.parse(json);
+    expect(Array.isArray(parsed)).toBe(true);
+    expect(parsed[0].content).toBe(messages[0].content);
+    expect(parsed[1]).toEqual(messages[1]);
+  });
+
+  it("never includes inline attachment bytes", () => {
+    const json = conversationToJson(messages);
+    expect(json).not.toContain("QUJD");
+    expect(JSON.parse(json)[0].attachments[0]).toEqual({
+      id: "att-1",
+      name: "a.png",
+      mediaType: "image/png",
+      size: 3,
+    });
+  });
+
+  it("does not modify the messages it was given", () => {
+    conversationToJson(messages);
+    expect(messages[0].attachments?.[0].data).toBe("QUJD");
+  });
+});
+
+describe("exportFilename", () => {
+  it("uses the visitor's local date, not the UTC date", () => {
+    const now = new Date("2026-09-19T14:03:00.000Z");
+    expect(exportFilename("md", { now, timeZone: "Pacific/Auckland" })).toBe(
+      "chat-transcript-2026-09-20.md",
+    );
+    expect(exportFilename("json", { now, timeZone: "America/Los_Angeles" })).toBe(
+      "chat-transcript-2026-09-19.json",
+    );
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
+Expected: FAIL. `conversationToMarkdown` is not exported. The 15 `protectMessageText` tests still pass.
+
+- [ ] **Step 3: Implement**
+
+At the top of `widget/src/utils/exportConversation.ts` add:
+
+```ts
+import type { ChatAttachment, ChatMessage, Source } from "../api/types";
+import { formatBytes, stripAttachmentData } from "./attachments";
+import { interpolate } from "./interpolate";
+import { sanitizeUrl } from "./sanitize";
+
+/**
+ * The strings a transcript is written with. `attachments`, `sources`, and
+ * `toolUsed` carry their own colon, because French puts a space before it.
+ */
+export interface TranscriptLabels {
+  title: string;
+  /** Takes `{date}`. */
+  exported: string;
+  user: string;
+  assistant: string;
+  attachments: string;
+  sources: string;
+  toolUsed: string;
+}
+
+export interface MarkdownExportOptions {
+  labels: TranscriptLabels;
+  /** BCP-47 tag for dates. An invalid tag falls back to the browser default. */
+  locale?: string;
+  /** IANA zone. Defaults to the visitor's. */
+  timeZone?: string;
+  /** The export time. Defaults to now. */
+  now?: Date;
+  /** Replaces the built-in date formatting. The result is still normalized. */
+  formatDate?: (date: Date) => string;
+}
+```
+
+At the bottom of the file add:
+
+```ts
+// Some engines separate the time from AM/PM with U+202F. It looks like a
+// space but breaks string comparison and some plain-text tools.
+const NO_BREAK_SPACES = /[\u00a0\u202f]/g;
+
+function makeDateFormatter(
+  options: MarkdownExportOptions,
+): (date: Date) => string {
+  const custom = options.formatDate;
+  if (custom) return (date) => custom(date).replace(NO_BREAK_SPACES, " ");
+
+  const build = (locale?: string) =>
+    new Intl.DateTimeFormat(locale, {
+      dateStyle: "medium",
+      timeStyle: "short",
+      timeZone: options.timeZone,
+    });
+  let formatter: Intl.DateTimeFormat;
+  try {
+    formatter = build(options.locale);
+  } catch {
+    formatter = build(undefined);
+  }
+  return (date) => formatter.format(date).replace(NO_BREAK_SPACES, " ");
+}
+
+/**
+ * "GMT+01:00" for the zone at that moment. A second formatter is needed
+ * because `timeZoneName` cannot be combined with `dateStyle`/`timeStyle`. An
+ * offset tells a reader in another zone what they need; an IANA name would
+ * also disclose roughly where the visitor is.
+ */
+function utcOffset(date: Date, timeZone?: string): string {
+  try {
+    const parts = new Intl.DateTimeFormat("en", {
+      timeZone,
+      timeZoneName: "longOffset",
+    }).formatToParts(date);
+    return parts.find((part) => part.type === "timeZoneName")?.value ?? "";
+  } catch {
+    return "";
+  }
+}
+
+/**
+ * A code span whose delimiter is one backtick longer than the longest run
+ * inside it, so nothing in the text needs escaping.
+ */
+function codeSpan(text: string): string {
+  const clean = text.replace(/\s+/g, " ").trim();
+  if (clean === "") return "";
+  const longest = Math.max(
+    0,
+    ...(clean.match(/`+/g) ?? []).map((run) => run.length),
+  );
+  const ticks = "`".repeat(longest + 1);
+  const pad = clean.startsWith("`") || clean.endsWith("`") ? " " : "";
+  return `${ticks}${pad}${clean}${pad}${ticks}`;
+}
+
+const URL_ESCAPES: Record<string, string> = {
+  "(": "%28",
+  ")": "%29",
+  "<": "%3C",
+  ">": "%3E",
+};
+
+function sourceLine(source: Source, index: number): string {
+  // The title must not close the link text or span lines.
+  const title = (source.title || source.url)
+    .replace(/\s+/g, " ")
+    .trim()
+    .replace(/[\\[\]]/g, "\\$&");
+  const safe = sanitizeUrl(source.url);
+  if (!safe) return `${index + 1}. ${title}`;
+  // Nor may the URL end the link destination.
+  const url = safe
+    .replace(/[()<>]/g, (ch) => URL_ESCAPES[ch])
+    .replace(/\s/g, "%20");
+  return `${index + 1}. [${title}](${url})`;
+}
+
+function attachmentLine(attachment: ChatAttachment): string {
+  return `- ${codeSpan(attachment.name)} (${attachment.mediaType}, ${formatBytes(attachment.size)})`;
+}
+
+/**
+ * The conversation as a Markdown transcript: a title, the export time, then
+ * one `##` heading per message with its text, attachments, tools, and
+ * citations. Never throws on message content.
+ */
+export function conversationToMarkdown(
+  messages: readonly ChatMessage[],
+  options: MarkdownExportOptions,
+): string {
+  const { labels } = options;
+  const formatDate = makeDateFormatter(options);
+  const now = options.now ?? new Date();
+  const offset = utcOffset(now, options.timeZone);
+  const exportedAt = formatDate(now) + (offset ? ` (${offset})` : "");
+
+  const blocks: string[] = [
+    `# ${labels.title}`,
+    interpolate(labels.exported, { date: exportedAt }),
+  ];
+
+  for (const message of messages) {
+    const role = message.role === "user" ? labels.user : labels.assistant;
+    const created = message.createdAt ? new Date(message.createdAt) : null;
+    const time =
+      created && !Number.isNaN(created.getTime())
+        ? ` · ${formatDate(created)}`
+        : "";
+    blocks.push(`## ${role}${time}`);
+
+    const text = protectMessageText(message.content ?? "");
+    if (text) blocks.push(text);
+
+    if (message.attachments?.length) {
+      blocks.push(
+        labels.attachments,
+        message.attachments.map(attachmentLine).join("\n"),
+      );
+    }
+    if (message.toolUses?.length) {
+      blocks.push(
+        message.toolUses
+          .map((toolUse) => `${labels.toolUsed} ${codeSpan(toolUse.name)}`)
+          .join("  \n"),
+      );
+    }
+    if (message.sources?.length) {
+      blocks.push(labels.sources, message.sources.map(sourceLine).join("\n"));
+    }
+  }
+
+  return blocks.join("\n\n") + "\n";
+}
+
+/**
+ * The conversation as JSON: the `ChatMessage[]` the widget persists, which
+ * means without inline attachment bytes.
+ */
+export function conversationToJson(messages: readonly ChatMessage[]): string {
+  return JSON.stringify(stripAttachmentData([...messages]), null, 2) + "\n";
+}
+
+/** `chat-transcript-YYYY-MM-DD.<extension>`, by the visitor's local date. */
+export function exportFilename(
+  extension: "md" | "json",
+  options: { now?: Date; timeZone?: string } = {},
+): string {
+  const now = options.now ?? new Date();
+  let stamp: string;
+  try {
+    // Assembled from parts so it does not depend on any locale's pattern.
+    const parts = new Intl.DateTimeFormat("en", {
+      timeZone: options.timeZone,
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+    }).formatToParts(now);
+    const get = (type: string) =>
+      parts.find((part) => part.type === type)?.value ?? "";
+    stamp = `${get("year")}-${get("month")}-${get("day")}`;
+  } catch {
+    stamp = now.toISOString().slice(0, 10);
+  }
+  return `chat-transcript-${stamp}.${extension}`;
+}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
+Expected: 32 passed (15 from Task 2, 17 new).
+
+Run: `./node_modules/.bin/tsc --noEmit`
+Expected: exit 0.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/utils/exportConversation.ts widget/src/utils/__tests__/exportConversation.test.ts
+git commit -m "feat(widget): Markdown and JSON conversation serializers" -m "Markdown: one heading per message with role and localized time, attachments by name only, tool names, and citations as escaped links. JSON: the ChatMessage[] the widget persists, never with inline bytes. Dates are normalized because Node 20 and some browsers emit U+202F before AM/PM." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 4: Clipboard and download helpers
+
+**Files:**
+- Create: `widget/src/utils/saveText.ts`
+- Test: `widget/src/utils/__tests__/saveText.test.ts` (create)
+
+**Interfaces:**
+- Produces:
+  ```ts
+  copyText(text: string): Promise<boolean>   // never rejects
+  downloadTextFile(filename: string, text: string, mimeType: string): void
+  ```
+
+- [ ] **Step 1: Write the failing tests**
+
+jsdom has no `navigator.clipboard`, no `document.execCommand`, and no `URL.createObjectURL`, so each test installs what it needs.
+
+Create `widget/src/utils/__tests__/saveText.test.ts`:
+
+```ts
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { copyText, downloadTextFile } from "../saveText";
+
+type Doc = Document & { execCommand?: (command: string) => boolean };
+
+function setClipboard(value: unknown) {
+  Object.defineProperty(navigator, "clipboard", { value, configurable: true });
+}
+
+/** jsdom's Blob has no text(), so read it the long way. */
+function readBlob(blob: Blob): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve(reader.result as string);
+    reader.onerror = () => reject(reader.error);
+    reader.readAsText(blob);
+  });
+}
+
+afterEach(() => {
+  setClipboard(undefined);
+  delete (document as Doc).execCommand;
+  document.body.innerHTML = "";
+  vi.restoreAllMocks();
+  vi.useRealTimers();
+});
+
+describe("copyText", () => {
+  it("uses the async clipboard API", async () => {
+    const writeText = vi.fn().mockResolvedValue(undefined);
+    setClipboard({ writeText });
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect(writeText).toHaveBeenCalledWith("hello");
+  });
+
+  it("calls writeText before yielding, inside the caller's user activation", () => {
+    const writeText = vi.fn().mockResolvedValue(undefined);
+    setClipboard({ writeText });
+
+    void copyText("hello");
+
+    expect(writeText).toHaveBeenCalledTimes(1);
+  });
+
+  it("falls back to execCommand when the API refuses", async () => {
+    setClipboard({
+      writeText: vi.fn().mockRejectedValue(new DOMException("no", "NotAllowedError")),
+    });
+    let copied = "";
+    (document as Doc).execCommand = vi.fn(() => {
+      copied = (document.activeElement as HTMLTextAreaElement).value;
+      return true;
+    });
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect(copied).toBe("hello");
+    expect(document.querySelector("textarea")).toBeNull();
+  });
+
+  it("falls back when there is no clipboard API, as on an insecure origin", async () => {
+    (document as Doc).execCommand = vi.fn(() => true);
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect((document as Doc).execCommand).toHaveBeenCalledWith("copy");
+  });
+
+  it("resolves false, never rejects, when both paths fail", async () => {
+    setClipboard({ writeText: vi.fn().mockRejectedValue(new Error("no")) });
+    (document as Doc).execCommand = vi.fn(() => {
+      throw new Error("blocked");
+    });
+
+    await expect(copyText("hello")).resolves.toBe(false);
+  });
+
+  it("returns focus to where it was after the fallback", async () => {
+    const button = document.createElement("button");
+    document.body.appendChild(button);
+    button.focus();
+    (document as Doc).execCommand = vi.fn(() => true);
+
+    await copyText("hello");
+
+    expect(document.activeElement).toBe(button);
+  });
+});
+
+describe("downloadTextFile", () => {
+  it("clicks a temporary download link to a Blob of the text", async () => {
+    let blob: Blob | undefined;
+    URL.createObjectURL = vi.fn((b: Blob) => {
+      blob = b;
+      return "blob:claudius-test";
+    });
+    URL.revokeObjectURL = vi.fn();
+    // Mocked so jsdom does not try to navigate. `contexts` holds each call's
+    // `this`, which is the link that was clicked.
+    const click = vi
+      .spyOn(HTMLAnchorElement.prototype, "click")
+      .mockImplementation(() => {});
+
+    downloadTextFile("chat.md", "# Hi", "text/markdown;charset=utf-8");
+
+    const clicked = click.mock.contexts[0] as HTMLAnchorElement;
+    expect(clicked.download).toBe("chat.md");
+    expect(clicked.href).toBe("blob:claudius-test");
+    expect(blob?.type).toBe("text/markdown;charset=utf-8");
+    await expect(readBlob(blob as Blob)).resolves.toBe("# Hi");
+    expect(document.querySelector("a")).toBeNull();
+  });
+
+  it("revokes the object URL later, not before the download starts", () => {
+    vi.useFakeTimers();
+    URL.createObjectURL = vi.fn(() => "blob:claudius-test");
+    URL.revokeObjectURL = vi.fn();
+    vi.spyOn(HTMLAnchorElement.prototype, "click").mockImplementation(() => {});
+
+    downloadTextFile("chat.json", "[]", "application/json");
+
+    expect(URL.revokeObjectURL).not.toHaveBeenCalled();
+    vi.advanceTimersByTime(40_000);
+    expect(URL.revokeObjectURL).toHaveBeenCalledWith("blob:claudius-test");
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/saveText.test.ts`
+Expected: FAIL, cannot resolve `../saveText`.
+
+- [ ] **Step 3: Implement**
+
+Create `widget/src/utils/saveText.ts`:
+
+```ts
+/** Copy through a hidden textarea, for where the async API is unavailable. */
+function legacyCopy(text: string): boolean {
+  const previous = document.activeElement as HTMLElement | null;
+  const area = document.createElement("textarea");
+  area.value = text;
+  area.setAttribute("readonly", "");
+  area.setAttribute("aria-hidden", "true");
+  area.style.position = "fixed";
+  area.style.top = "0";
+  area.style.left = "0";
+  area.style.opacity = "0";
+  document.body.appendChild(area);
+  // select() alone does not focus the field everywhere (iOS Safari), and the
+  // copy command acts on the focused element's selection.
+  area.focus({ preventScroll: true });
+  area.select();
+  let ok = false;
+  try {
+    ok = document.execCommand("copy");
+  } catch {
+    ok = false;
+  }
+  area.remove();
+  previous?.focus();
+  return ok;
+}
+
+/**
+ * Copy text to the clipboard. Resolves to whether it worked and never
+ * rejects.
+ *
+ * Call it synchronously from a click handler: `writeText` runs before the
+ * first `await`, while the transient activation Firefox and Safari require is
+ * still present. The async API is missing on insecure origins and refuses in
+ * an iframe without `clipboard-write`, so both cases fall back to
+ * `execCommand`.
+ */
+export async function copyText(text: string): Promise<boolean> {
+  try {
+    if (navigator.clipboard?.writeText) {
+      await navigator.clipboard.writeText(text);
+      return true;
+    }
+  } catch {
+    // Refused. Try the legacy path.
+  }
+  return legacyCopy(text);
+}
+
+// Revoking straight away cancels the download in some browsers. FileSaver.js
+// settled on 40 seconds, and a pending timer costs nothing.
+const REVOKE_AFTER_MS = 40_000;
+
+/** Save text as a file through a temporary `<a download>`. */
+export function downloadTextFile(
+  filename: string,
+  text: string,
+  mimeType: string,
+): void {
+  // No byte-order mark: it is invalid in JSON and breaks some Markdown tools.
+  const url = URL.createObjectURL(new Blob([text], { type: mimeType }));
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  link.style.display = "none";
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  setTimeout(() => URL.revokeObjectURL(url), REVOKE_AFTER_MS);
+}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/utils/__tests__/saveText.test.ts`
+Expected: 8 passed.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/utils/saveText.ts widget/src/utils/__tests__/saveText.test.ts
+git commit -m "feat(widget): clipboard and download helpers" -m "copyText calls the async clipboard API before yielding so the click's user activation still holds, and falls back to execCommand on insecure origins and in iframes without clipboard-write. It resolves to a boolean and never rejects." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 5: Strings in four locales
+
+**Files:**
+- Modify: `widget/src/i18n.ts`, `widget/src/locales/en.ts`, `es.ts`, `fr.ts`, `de.ts`
+- Test: the existing `widget/src/locales/__tests__/parity.test.ts` enforces this task.
+
+**Interfaces:**
+- Produces twelve keys on `ClaudiusTranslations`: `moreOptions`, `copyAsMarkdown`, `downloadAsMarkdown`, `downloadAsJson`, `copiedToClipboard`, `copyFailed`, `transcriptTitle`, `transcriptExported`, `transcriptUser`, `transcriptAssistant`, `transcriptAttachments`, `transcriptSources`. Task 7 reads them.
+
+- [ ] **Step 1: Add the keys to the interface**
+
+In `widget/src/i18n.ts`, inside `ClaudiusTranslations`, after `stopReading` and before `errorGeneric`:
+
+```ts
+  /** Accessible label for the header's overflow menu button. */
+  moreOptions: string;
+  /** Menu item that copies the conversation to the clipboard as Markdown. */
+  copyAsMarkdown: string;
+  /** Menu item that downloads the conversation as a Markdown file. */
+  downloadAsMarkdown: string;
+  /** Menu item that downloads the conversation as a JSON file. */
+  downloadAsJson: string;
+  /** Status shown after the conversation was copied. */
+  copiedToClipboard: string;
+  /** Status shown when the conversation could not be copied. */
+  copyFailed: string;
+  /** Title of an exported transcript. */
+  transcriptTitle: string;
+  /** Line under the transcript title; supports `{date}`. */
+  transcriptExported: string;
+  /** Transcript heading for a visitor message. */
+  transcriptUser: string;
+  /** Transcript heading for an assistant message. */
+  transcriptAssistant: string;
+  /** Transcript label above a message's attachment list, including its colon. */
+  transcriptAttachments: string;
+  /** Transcript label above a message's citation list, including its colon. */
+  transcriptSources: string;
+```
+
+- [ ] **Step 2: Run the parity test and confirm it fails on typing**
+
+Run: `./node_modules/.bin/tsc --noEmit`
+Expected: FAIL. `en`, `es`, `fr`, and `de` are each missing twelve properties.
+
+- [ ] **Step 3: Add the strings**
+
+Each block goes after the `stopReading` line and before `// Errors`. Spanish is informal (tú), French and German formal, matching the existing files. French puts a space before the colon, as its `toolUsed` already does.
+
+`widget/src/locales/en.ts`:
+
+```ts
+  // Conversation export
+  moreOptions: "More options",
+  copyAsMarkdown: "Copy as Markdown",
+  downloadAsMarkdown: "Download as Markdown",
+  downloadAsJson: "Download as JSON",
+  copiedToClipboard: "Copied to clipboard",
+  copyFailed: "Could not copy. Try downloading instead.",
+  transcriptTitle: "Chat transcript",
+  transcriptExported: "Exported {date}",
+  transcriptUser: "User",
+  transcriptAssistant: "Assistant",
+  transcriptAttachments: "Attachments:",
+  transcriptSources: "Sources:",
+```
+
+`widget/src/locales/es.ts`:
+
+```ts
+  // Conversation export
+  moreOptions: "Más opciones",
+  copyAsMarkdown: "Copiar como Markdown",
+  downloadAsMarkdown: "Descargar como Markdown",
+  downloadAsJson: "Descargar como JSON",
+  copiedToClipboard: "Copiado al portapapeles",
+  copyFailed: "No se pudo copiar. Prueba a descargarlo.",
+  transcriptTitle: "Transcripción del chat",
+  transcriptExported: "Exportado el {date}",
+  transcriptUser: "Usuario",
+  transcriptAssistant: "Asistente",
+  transcriptAttachments: "Adjuntos:",
+  transcriptSources: "Fuentes:",
+```
+
+`widget/src/locales/fr.ts`:
+
+```ts
+  // Conversation export
+  moreOptions: "Plus d'options",
+  copyAsMarkdown: "Copier en Markdown",
+  downloadAsMarkdown: "Télécharger en Markdown",
+  downloadAsJson: "Télécharger en JSON",
+  copiedToClipboard: "Copié dans le presse-papiers",
+  copyFailed: "Impossible de copier. Essayez plutôt de télécharger.",
+  transcriptTitle: "Transcription du chat",
+  transcriptExported: "Exporté le {date}",
+  transcriptUser: "Utilisateur",
+  transcriptAssistant: "Assistant",
+  transcriptAttachments: "Pièces jointes :",
+  transcriptSources: "Sources :",
+```
+
+`widget/src/locales/de.ts`:
+
+```ts
+  // Conversation export
+  moreOptions: "Weitere Optionen",
+  copyAsMarkdown: "Als Markdown kopieren",
+  downloadAsMarkdown: "Als Markdown herunterladen",
+  downloadAsJson: "Als JSON herunterladen",
+  copiedToClipboard: "In die Zwischenablage kopiert",
+  copyFailed:
+    "Kopieren nicht möglich. Laden Sie die Unterhaltung stattdessen herunter.",
+  transcriptTitle: "Chat-Protokoll",
+  transcriptExported: "Exportiert am {date}",
+  transcriptUser: "Nutzer",
+  transcriptAssistant: "Assistent",
+  transcriptAttachments: "Anhänge:",
+  transcriptSources: "Quellen:",
+```
+
+- [ ] **Step 4: Verify**
+
+Run: `./node_modules/.bin/tsc --noEmit && ./node_modules/.bin/vitest run src/locales && ./node_modules/.bin/typedoc --emit none`
+Expected: all exit 0. The parity test reports every locale has exactly the English key set and no empty values.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/i18n.ts widget/src/locales/en.ts widget/src/locales/es.ts widget/src/locales/fr.ts widget/src/locales/de.ts
+git commit -m "feat(widget): conversation export strings in en, es, fr, de" -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 6: `HeaderMenu` and the header's `actions` slot
+
+**Files:**
+- Create: `widget/src/components/HeaderMenu.tsx`
+- Modify: `widget/src/components/ChatHeader.tsx`, `widget/src/components/ChatHeader.stories.tsx`
+- Test: `widget/src/components/__tests__/HeaderMenu.test.tsx` (create)
+
+**Interfaces:**
+- Produces:
+  ```ts
+  interface HeaderMenuItem { id: string; label: string; disabled?: boolean; onSelect: () => void }
+  <HeaderMenu label: string  items: HeaderMenuItem[]  onOpen?: () => void />
+  <ChatHeader ... actions?: ReactNode />   // rendered before the close button
+  ```
+
+- [ ] **Step 1: Write the failing tests**
+
+Create `widget/src/components/__tests__/HeaderMenu.test.tsx`:
+
+```tsx
+import { render, screen, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { HeaderMenu, type HeaderMenuItem } from "../HeaderMenu";
+
+function setup(overrides: Partial<HeaderMenuItem>[] = []) {
+  const items: HeaderMenuItem[] = ["Copy", "Download", "Archive"].map(
+    (label, i) => ({
+      id: label.toLowerCase(),
+      label,
+      onSelect: vi.fn(),
+      ...overrides[i],
+    }),
+  );
+  const onOpen = vi.fn();
+  // The sibling stands in for the header's close button, so Tab has
+  // somewhere to go.
+  render(
+    <>
+      <HeaderMenu label="More options" items={items} onOpen={onOpen} />
+      <button type="button">Close chat</button>
+    </>,
+  );
+  return {
+    items,
+    onOpen,
+    user: userEvent.setup(),
+    trigger: screen.getByRole("button", { name: "More options" }),
+  };
+}
+
+describe("HeaderMenu", () => {
+  it("is a closed menu button until it is used", () => {
+    const { trigger } = setup();
+    expect(trigger).toHaveAttribute("aria-haspopup", "menu");
+    expect(trigger).toHaveAttribute("aria-expanded", "false");
+    expect(trigger).not.toHaveAttribute("aria-controls");
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
+
+  it("opens on click, labelled by its trigger, with focus on the first item", async () => {
+    const { user, trigger, onOpen } = setup();
+    await user.click(trigger);
+
+    const menu = screen.getByRole("menu", { name: "More options" });
+    expect(trigger).toHaveAttribute("aria-expanded", "true");
+    expect(trigger).toHaveAttribute("aria-controls", menu.id);
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    expect(onOpen).toHaveBeenCalledTimes(1);
+  });
+
+  it("opens from the keyboard: Enter and ArrowDown on the first item, ArrowUp on the last", async () => {
+    const { user, trigger } = setup();
+    trigger.focus();
+
+    await user.keyboard("{Enter}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{Escape}");
+
+    await user.keyboard("{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{Escape}");
+
+    await user.keyboard("{ArrowUp}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+  });
+
+  it("moves with the arrows, wrapping, and jumps with Home and End", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+
+    await user.keyboard("{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Download" })).toHaveFocus();
+    await user.keyboard("{ArrowDown}{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{ArrowUp}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+    await user.keyboard("{Home}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{End}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+  });
+
+  it("keeps its items out of the tab order", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("tabindex", "-1");
+    }
+  });
+
+  it("runs the chosen item, closes, and returns focus to the trigger", async () => {
+    const { user, trigger, items } = setup();
+    await user.click(trigger);
+    await user.click(screen.getByRole("menuitem", { name: "Download" }));
+
+    expect(items[1].onSelect).toHaveBeenCalledTimes(1);
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+  });
+
+  it("activates the focused item with Enter", async () => {
+    const { user, trigger, items } = setup();
+    await user.click(trigger);
+    await user.keyboard("{ArrowDown}{Enter}");
+    expect(items[1].onSelect).toHaveBeenCalledTimes(1);
+  });
+
+  it("keeps a disabled item focusable but inert, and stays open", async () => {
+    const { user, trigger, items } = setup([{ disabled: true }]);
+    await user.click(trigger);
+    const copy = screen.getByRole("menuitem", { name: "Copy" });
+
+    expect(copy).toHaveAttribute("aria-disabled", "true");
+    expect(copy).not.toBeDisabled();
+    expect(copy).toHaveFocus();
+    await user.click(copy);
+
+    expect(items[0].onSelect).not.toHaveBeenCalled();
+    expect(screen.getByRole("menu")).toBeInTheDocument();
+  });
+
+  it("closes on Escape, returns focus, and keeps the key from the page", async () => {
+    const onDocumentKeyDown = vi.fn();
+    document.addEventListener("keydown", onDocumentKeyDown);
+    const { user, trigger } = setup();
+    await user.click(trigger);
+
+    await user.keyboard("{Escape}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+    expect(onDocumentKeyDown).not.toHaveBeenCalled();
+    document.removeEventListener("keydown", onDocumentKeyDown);
+  });
+
+  it("lets Escape through when it is closed", async () => {
+    const onDocumentKeyDown = vi.fn();
+    document.addEventListener("keydown", onDocumentKeyDown);
+    const { user, trigger } = setup();
+    trigger.focus();
+
+    await user.keyboard("{Escape}");
+
+    expect(onDocumentKeyDown).toHaveBeenCalledTimes(1);
+    document.removeEventListener("keydown", onDocumentKeyDown);
+  });
+
+  it("closes on Tab once focus has moved on to the next control", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    await user.keyboard("{Tab}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(screen.getByRole("button", { name: "Close chat" })).toHaveFocus();
+  });
+
+  it("closes on Shift+Tab with focus back on the trigger", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    await user.keyboard("{Shift>}{Tab}{/Shift}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+  });
+
+  it("closes on a press outside, and on a second click of the trigger", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    fireEvent.pointerDown(document.body);
+    expect(screen.queryByRole("menu")).toBeNull();
+
+    await user.click(trigger);
+    await user.click(trigger);
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/components/__tests__/HeaderMenu.test.tsx`
+Expected: FAIL, cannot resolve `../HeaderMenu`.
+
+- [ ] **Step 3: Implement the menu**
+
+Create `widget/src/components/HeaderMenu.tsx`:
+
+```tsx
+import {
+  useEffect,
+  useId,
+  useRef,
+  useState,
+  type FocusEvent,
+  type KeyboardEvent,
+} from "react";
+
+export interface HeaderMenuItem {
+  id: string;
+  label: string;
+  /** Shown greyed out and focusable, but does nothing when chosen. */
+  disabled?: boolean;
+  onSelect: () => void;
+}
+
+interface HeaderMenuProps {
+  /** Accessible name of the trigger, and so of the menu. */
+  label: string;
+  items: HeaderMenuItem[];
+  /** Called each time the menu opens. */
+  onOpen?: () => void;
+}
+
+/**
+ * The header's overflow menu, following the WAI-ARIA menu button pattern. It
+ * is generic: it knows nothing about what its items do.
+ *
+ * It renders inline, not through a portal, so it stays inside the dialog's
+ * focus trap and inherits the theme tokens and dark mode from
+ * `.claudius-root`.
+ */
+export function HeaderMenu({ label, items, onOpen }: HeaderMenuProps) {
+  const [open, setOpen] = useState(false);
+  const triggerId = useId();
+  const menuId = useId();
+  const rootRef = useRef<HTMLDivElement>(null);
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);
+  // The item to focus once the popup has rendered.
+  const pendingFocus = useRef<number | null>(null);
+
+  const openMenu = (focusIndex: number) => {
+    pendingFocus.current = focusIndex;
+    setOpen(true);
+    onOpen?.();
+  };
+
+  const closeMenu = (restoreFocus: boolean) => {
+    setOpen(false);
+    if (restoreFocus) triggerRef.current?.focus();
+  };
+
+  useEffect(() => {
+    if (!open) return;
+    if (pendingFocus.current !== null) {
+      itemRefs.current[pendingFocus.current]?.focus();
+      pendingFocus.current = null;
+    }
+    // onBlur alone would miss this in Safari, which does not focus a button
+    // when it is clicked.
+    const onPointerDown = (event: PointerEvent) => {
+      if (!rootRef.current?.contains(event.target as Node)) setOpen(false);
+    };
+    document.addEventListener("pointerdown", onPointerDown);
+    return () => document.removeEventListener("pointerdown", onPointerDown);
+  }, [open]);
+
+  const focusItem = (index: number) => {
+    const count = items.length;
+    itemRefs.current[(index + count) % count]?.focus();
+  };
+
+  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {
+    // Enter and Space arrive as a click, which keeps them working the same
+    // in every browser.
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      openMenu(0);
+    } else if (event.key === "ArrowUp") {
+      event.preventDefault();
+      openMenu(items.length - 1);
+    }
+  };
+
+  // On the menu, not the wrapper: focus is always inside the menu while it is
+  // open, so this is where the keys arrive, and a plain wrapper div with
+  // handlers would need a role it does not have.
+  const onMenuKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
+    const current = itemRefs.current.findIndex(
+      (el) => el === document.activeElement,
+    );
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        focusItem(current + 1);
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        // -1 when the menu itself has focus, after a click on its padding.
+        focusItem(current === -1 ? items.length - 1 : current - 1);
+        break;
+      case "Home":
+        event.preventDefault();
+        focusItem(0);
+        break;
+      case "End":
+        event.preventDefault();
+        focusItem(items.length - 1);
+        break;
+      case "Escape":
+        // Close the menu only. Without this the chat's document-level
+        // Escape handler would close the whole window.
+        event.preventDefault();
+        event.stopPropagation();
+        closeMenu(true);
+        break;
+      case "Tab":
+        // Shift+Tab lands on the trigger anyway; going there ourselves
+        // closes the menu in the same step. A forward Tab is left to the
+        // browser, and onBlur closes the menu once focus has moved on.
+        // Closing here instead would unmount the focused item mid-keystroke.
+        if (event.shiftKey) {
+          event.preventDefault();
+          closeMenu(true);
+        }
+        break;
+    }
+  };
+
+  const onMenuBlur = (event: FocusEvent<HTMLDivElement>) => {
+    // Focus left the menu entirely: a Tab, or a click on another control.
+    // Moving to the trigger does not count, or a click on it would close the
+    // menu here and then reopen it in onClick.
+    if (!rootRef.current?.contains(event.relatedTarget as Node | null)) {
+      setOpen(false);
+    }
+  };
+
+  return (
+    <div ref={rootRef} className="relative">
+      <button
+        ref={triggerRef}
+        id={triggerId}
+        type="button"
+        aria-label={label}
+        aria-haspopup="menu"
+        aria-expanded={open}
+        aria-controls={open ? menuId : undefined}
+        onClick={() => (open ? closeMenu(true) : openMenu(0))}
+        onKeyDown={onTriggerKeyDown}
+        className="flex h-10 w-10 items-center justify-center rounded-claudius-full text-claudius-accent-text-muted transition-colors hover:bg-claudius-accent-soft hover:text-claudius-accent-text"
+      >
+        <svg
+          width="18"
+          height="18"
+          viewBox="0 0 24 24"
+          fill="currentColor"
+          aria-hidden="true"
+        >
+          <circle cx="12" cy="5" r="1.75" />
+          <circle cx="12" cy="12" r="1.75" />
+          <circle cx="12" cy="19" r="1.75" />
+        </svg>
+      </button>
+      {open && (
+        <div
+          id={menuId}
+          role="menu"
+          aria-labelledby={triggerId}
+          // Focusable by script only, as an element with handlers must be.
+          // The focus trap skips tabindex -1.
+          tabIndex={-1}
+          onKeyDown={onMenuKeyDown}
+          onBlur={onMenuBlur}
+          className="absolute right-0 top-full z-20 mt-1 min-w-[12rem] rounded-claudius-md border border-claudius-border bg-claudius-surface py-1 shadow-claudius-elevated"
+        >
+          {items.map((item, index) => (
+            <button
+              key={item.id}
+              ref={(el) => {
+                itemRefs.current[index] = el;
+              }}
+              type="button"
+              role="menuitem"
+              tabIndex={-1}
+              // Not `disabled`: a focused control must never drop out from
+              // under the dialog's focus trap.
+              aria-disabled={item.disabled || undefined}
+              onClick={() => {
+                if (item.disabled) return;
+                closeMenu(true);
+                item.onSelect();
+              }}
+              className="flex min-h-[40px] w-full items-center whitespace-nowrap px-4 text-left text-sm text-claudius-text hover:bg-claudius-surface-muted focus:bg-claudius-surface-muted aria-disabled:cursor-default aria-disabled:opacity-50 aria-disabled:hover:bg-transparent"
+            >
+              {item.label}
+            </button>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/components/__tests__/HeaderMenu.test.tsx`
+Expected: 13 passed.
+
+- [ ] **Step 5: Give `ChatHeader` an `actions` slot**
+
+In `widget/src/components/ChatHeader.tsx`, add the import, the prop, and the slot:
+
+```tsx
+import type { ReactNode } from "react";
+
+interface ChatHeaderProps {
+  title: string;
+  subtitle: string;
+  /** id linked from the dialog's aria-labelledby; applied to the heading. */
+  titleId?: string;
+  closeLabel: string;
+  onClose: () => void;
+  /** Extra header controls, rendered before the close button. */
+  actions?: ReactNode;
+}
+```
+
+Update the doc comment's first sentence to read "avatar initial, title and subtitle, optional actions, and the close button". Add `actions,` to the destructured props, and render `{actions}` on its own line directly before the close `<button`.
+
+- [ ] **Step 6: Add a story**
+
+In `widget/src/components/ChatHeader.stories.tsx`, add `import { HeaderMenu } from "./HeaderMenu";` and append:
+
+```tsx
+// The overflow menu sits before the close button and opens over the messages.
+export const WithMenu: Story = {
+  args: {
+    actions: (
+      <HeaderMenu
+        label="More options"
+        items={[
+          { id: "copy", label: "Copy as Markdown", onSelect: fn() },
+          { id: "md", label: "Download as Markdown", onSelect: fn() },
+          { id: "json", label: "Download as JSON", disabled: true, onSelect: fn() },
+        ]}
+      />
+    ),
+  },
+};
+```
+
+- [ ] **Step 7: Verify and commit**
+
+Run: `./node_modules/.bin/vitest run src/components && ./node_modules/.bin/tsc --noEmit && ./node_modules/.bin/eslint src/components/HeaderMenu.tsx src/components/ChatHeader.tsx src/components/ChatHeader.stories.tsx`
+Expected: all pass, exit 0.
+
+```bash
+git add widget/src/components/HeaderMenu.tsx widget/src/components/__tests__/HeaderMenu.test.tsx widget/src/components/ChatHeader.tsx widget/src/components/ChatHeader.stories.tsx
+git commit -m "feat(widget): accessible header menu" -m "A generic WAI-ARIA menu button for the chat header, rendered inline so it stays inside the focus trap and the theme scope. Escape closes only the menu. Disabled items use aria-disabled so a focused control never vanishes from under the trap." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 7: `useConversationExport`
+
+**Files:**
+- Create: `widget/src/hooks/useConversationExport.ts`
+- Test: `widget/src/hooks/__tests__/useConversationExport.test.ts` (create)
+
+**Interfaces:**
+- Consumes: `conversationToMarkdown`, `conversationToJson`, `exportFilename` (Task 3); `copyText`, `downloadTextFile` (Task 4); the twelve strings (Task 5); `HeaderMenuItem` (Task 6).
+- Produces:
+  ```ts
+  useConversationExport(options: {
+    enabled: boolean; messages: readonly ChatMessage[]; busy: boolean;
+    locale: string; translations?: ClaudiusTranslations;
+  }): { items: HeaderMenuItem[]; status: string | null; clearStatus: () => void }
+  ```
+  `items` is `[]` when `enabled` is false. Item ids are `copy-markdown`, `download-markdown`, `download-json`.
+
+- [ ] **Step 1: Write the failing tests**
+
+Create `widget/src/hooks/__tests__/useConversationExport.test.ts`:
+
+```ts
+import { renderHook, act } from "@testing-library/react";
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { useConversationExport } from "../useConversationExport";
+import { copyText, downloadTextFile } from "../../utils/saveText";
+import { locales } from "../../locales";
+import type { ChatMessage } from "../../api/types";
+
+vi.mock("../../utils/saveText", () => ({
+  copyText: vi.fn(),
+  downloadTextFile: vi.fn(),
+}));
+
+const messages: ChatMessage[] = [
+  { id: "msg-1", role: "user", content: "Hi", createdAt: "2026-09-19T14:03:00.000Z" },
+  { id: "msg-2", role: "assistant", content: "Hello!" },
+];
+
+const base = { enabled: true, messages, busy: false, locale: "en-US" };
+
+function item(result: { current: ReturnType<typeof useConversationExport> }, id: string) {
+  const found = result.current.items.find((i) => i.id === id);
+  if (!found) throw new Error(`no item ${id}`);
+  return found;
+}
+
+describe("useConversationExport", () => {
+  beforeEach(() => {
+    vi.mocked(copyText).mockReset().mockResolvedValue(true);
+    vi.mocked(downloadTextFile).mockReset();
+  });
+  afterEach(() => vi.useRealTimers());
+
+  it("offers nothing when the feature is off", () => {
+    const { result } = renderHook(() =>
+      useConversationExport({ ...base, enabled: false }),
+    );
+    expect(result.current.items).toEqual([]);
+  });
+
+  it("offers copy, Markdown, and JSON, in that order", () => {
+    const { result } = renderHook(() => useConversationExport(base));
+    expect(result.current.items.map((i) => [i.id, i.label, i.disabled])).toEqual([
+      ["copy-markdown", "Copy as Markdown", false],
+      ["download-markdown", "Download as Markdown", false],
+      ["download-json", "Download as JSON", false],
+    ]);
+  });
+
+  it("disables every item while the conversation is empty or a reply is in flight", () => {
+    const empty = renderHook(() => useConversationExport({ ...base, messages: [] }));
+    expect(empty.result.current.items.every((i) => i.disabled)).toBe(true);
+
+    const busy = renderHook(() => useConversationExport({ ...base, busy: true }));
+    expect(busy.result.current.items.every((i) => i.disabled)).toBe(true);
+  });
+
+  it("copies the Markdown transcript and reports success", async () => {
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    const text = vi.mocked(copyText).mock.calls[0][0];
+    expect(text).toContain("# Chat transcript");
+    expect(text).toContain("## User · ");
+    expect(text).toContain("## Assistant\n\nHello!");
+    expect(result.current.status).toBe("Copied to clipboard");
+  });
+
+  it("hands the text to copyText before yielding, to keep the user activation", () => {
+    const { result } = renderHook(() => useConversationExport(base));
+
+    act(() => item(result, "copy-markdown").onSelect());
+
+    expect(copyText).toHaveBeenCalledTimes(1);
+  });
+
+  it("reports a failed copy", async () => {
+    vi.mocked(copyText).mockResolvedValue(false);
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    expect(result.current.status).toBe("Could not copy. Try downloading instead.");
+  });
+
+  it("clears the status after four seconds, or on request", async () => {
+    // Only the timer the hook uses, so React's act() scheduling is untouched.
+    vi.useFakeTimers({ toFake: ["setTimeout", "clearTimeout"] });
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+    expect(result.current.status).not.toBeNull();
+    act(() => vi.advanceTimersByTime(3999));
+    expect(result.current.status).not.toBeNull();
+    act(() => vi.advanceTimersByTime(1));
+    expect(result.current.status).toBeNull();
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+    act(() => result.current.clearStatus());
+    expect(result.current.status).toBeNull();
+  });
+
+  it("downloads Markdown and JSON with a dated filename and the right type", () => {
+    const { result } = renderHook(() => useConversationExport(base));
+
+    act(() => item(result, "download-markdown").onSelect());
+    act(() => item(result, "download-json").onSelect());
+
+    const [md, json] = vi.mocked(downloadTextFile).mock.calls;
+    expect(md[0]).toMatch(/^chat-transcript-\d{4}-\d{2}-\d{2}\.md$/);
+    expect(md[1]).toContain("# Chat transcript");
+    expect(md[2]).toBe("text/markdown;charset=utf-8");
+    expect(json[0]).toMatch(/^chat-transcript-\d{4}-\d{2}-\d{2}\.json$/);
+    expect(JSON.parse(json[1])).toEqual(messages);
+    expect(json[2]).toBe("application/json");
+    expect(result.current.status).toBeNull();
+  });
+
+  it("writes the menu and the transcript in the widget's language", async () => {
+    const { result } = renderHook(() =>
+      useConversationExport({ ...base, locale: "de-DE", translations: locales.de }),
+    );
+    expect(result.current.items[0].label).toBe("Als Markdown kopieren");
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    const text = vi.mocked(copyText).mock.calls[0][0];
+    expect(text).toContain("# Chat-Protokoll");
+    expect(text).toContain("## Nutzer · ");
+    expect(result.current.status).toBe("In die Zwischenablage kopiert");
+  });
+
+  it("does not set state after unmount", async () => {
+    let resolve!: (ok: boolean) => void;
+    vi.mocked(copyText).mockReturnValue(new Promise((r) => (resolve = r)));
+    const { result, unmount } = renderHook(() => useConversationExport(base));
+
+    act(() => item(result, "copy-markdown").onSelect());
+    unmount();
+    await act(async () => resolve(true));
+
+    expect(result.current.status).toBeNull();
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/hooks/__tests__/useConversationExport.test.ts`
+Expected: FAIL, cannot resolve `../useConversationExport`.
+
+- [ ] **Step 3: Implement**
+
+Create `widget/src/hooks/useConversationExport.ts`:
+
+```ts
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import type { ChatMessage } from "../api/types";
+import type { HeaderMenuItem } from "../components/HeaderMenu";
+import { defaultTranslations, type ClaudiusTranslations } from "../i18n";
+import {
+  conversationToJson,
+  conversationToMarkdown,
+  exportFilename,
+} from "../utils/exportConversation";
+import { copyText, downloadTextFile } from "../utils/saveText";
+
+const STATUS_MS = 4000;
+
+interface UseConversationExportOptions {
+  enabled: boolean;
+  messages: readonly ChatMessage[];
+  /** True while a reply is in flight. Export waits for it. */
+  busy: boolean;
+  /** BCP-47 tag used for the dates in a transcript. */
+  locale: string;
+  translations?: ClaudiusTranslations;
+}
+
+interface UseConversationExportReturn {
+  /** The header menu's items. Empty when the feature is off. */
+  items: HeaderMenuItem[];
+  /** The result of the last copy, shown briefly, or `null`. */
+  status: string | null;
+  clearStatus: () => void;
+}
+
+/**
+ * The three export actions as header-menu items, plus the transient status a
+ * copy reports. Everything happens in the browser.
+ */
+export function useConversationExport({
+  enabled,
+  messages,
+  busy,
+  locale,
+  translations,
+}: UseConversationExportOptions): UseConversationExportReturn {
+  const t = translations ?? defaultTranslations;
+  const [status, setStatus] = useState<string | null>(null);
+  const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const mounted = useRef(true);
+
+  useEffect(() => {
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+      if (timer.current) clearTimeout(timer.current);
+    };
+  }, []);
+
+  const clearStatus = useCallback(() => {
+    if (timer.current) clearTimeout(timer.current);
+    timer.current = null;
+    setStatus(null);
+  }, []);
+
+  const showStatus = useCallback((text: string) => {
+    // The copy can settle after the window has closed.
+    if (!mounted.current) return;
+    if (timer.current) clearTimeout(timer.current);
+    setStatus(text);
+    timer.current = setTimeout(() => {
+      timer.current = null;
+      setStatus(null);
+    }, STATUS_MS);
+  }, []);
+
+  const items = useMemo<HeaderMenuItem[]>(() => {
+    if (!enabled) return [];
+
+    // A transcript whose last message is cut short is worse than a control
+    // that is unavailable for a few seconds.
+    const disabled = busy || messages.length === 0;
+    const markdown = () =>
+      conversationToMarkdown(messages, {
+        locale,
+        labels: {
+          title: t.transcriptTitle,
+          exported: t.transcriptExported,
+          user: t.transcriptUser,
+          assistant: t.transcriptAssistant,
+          attachments: t.transcriptAttachments,
+          sources: t.transcriptSources,
+          toolUsed: t.toolUsed,
+        },
+      });
+
+    return [
+      {
+        id: "copy-markdown",
+        label: t.copyAsMarkdown,
+        disabled,
+        onSelect: () => {
+          // Built and handed over synchronously: Firefox and Safari only
+          // allow a clipboard write during the click's user activation.
+          void copyText(markdown()).then((ok) =>
+            showStatus(ok ? t.copiedToClipboard : t.copyFailed),
+          );
+        },
+      },
+      {
+        id: "download-markdown",
+        label: t.downloadAsMarkdown,
+        disabled,
+        onSelect: () =>
+          downloadTextFile(
+            exportFilename("md"),
+            markdown(),
+            "text/markdown;charset=utf-8",
+          ),
+      },
+      {
+        id: "download-json",
+        label: t.downloadAsJson,
+        disabled,
+        onSelect: () =>
+          downloadTextFile(
+            exportFilename("json"),
+            conversationToJson(messages),
+            "application/json",
+          ),
+      },
+    ];
+  }, [enabled, busy, messages, locale, t, showStatus]);
+
+  return { items, status, clearStatus };
+}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/hooks/__tests__/useConversationExport.test.ts`
+Expected: 10 passed.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/hooks/useConversationExport.ts widget/src/hooks/__tests__/useConversationExport.test.ts
+git commit -m "feat(widget): useConversationExport hook" -m "Turns the conversation into the three header-menu actions and a transient copy status. Items are disabled while the conversation is empty or a reply is in flight." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 8: The `conversationExport` option, wired into the window
+
+**Files:**
+- Modify: `widget/src/components/ChatWindow.tsx`, `widget/src/components/ChatWidget.tsx`
+- Test: `widget/src/components/__tests__/ChatWindow.export.test.tsx`, `widget/src/components/__tests__/ChatWidget.export.test.tsx` (create both)
+
+**Interfaces:**
+- Consumes: `useConversationExport` (Task 7), `HeaderMenu` and `ChatHeader`'s `actions` (Task 6), `resolveSpeechLang` and `detectLocale` (existing).
+- Produces: `ChatWindow` props `conversationExport?: boolean` (default `false`) and `locale?: string` (default `"en-US"`); `ChatWidgetProps.conversationExport?: boolean` (default `false`). Task 9 passes the latter.
+
+- [ ] **Step 1: Write the failing `ChatWindow` tests**
+
+`userEvent.setup()` installs a working `navigator.clipboard` stub, so the success path runs the real `copyText`.
+
+Create `widget/src/components/__tests__/ChatWindow.export.test.tsx`:
+
+```tsx
+import { render, screen, within, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { ChatWindow } from "../ChatWindow";
+import type { ChatMessage } from "../../api/types";
+
+const messages: ChatMessage[] = [
+  { id: "msg-1", role: "user", content: "What are your prices?" },
+  { id: "msg-2", role: "assistant", content: "Plans start at $10." },
+];
+
+function renderWindow(props: Partial<React.ComponentProps<typeof ChatWindow>> = {}) {
+  const onClose = vi.fn();
+  render(
+    <ChatWindow
+      messages={messages}
+      isLoading={false}
+      error={null}
+      onSend={vi.fn()}
+      onClose={onClose}
+      conversationExport
+      {...props}
+    />,
+  );
+  return { onClose, user: userEvent.setup() };
+}
+
+describe("ChatWindow conversation export", () => {
+  it("renders no menu and no extra status region by default", () => {
+    renderWindow({ conversationExport: false });
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    expect(screen.queryByRole("status")).toBeNull();
+  });
+
+  it("puts the menu in the header, before the close button", () => {
+    renderWindow();
+    const buttons = within(screen.getByRole("dialog")).getAllByRole("button");
+    const names = buttons.map((b) => b.getAttribute("aria-label"));
+    expect(names.indexOf("More options")).toBe(names.indexOf("Close chat") - 1);
+  });
+
+  it("offers the three actions", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    expect(screen.getAllByRole("menuitem").map((i) => i.textContent)).toEqual([
+      "Copy as Markdown",
+      "Download as Markdown",
+      "Download as JSON",
+    ]);
+  });
+
+  it("disables the actions while empty and while a reply is in flight", async () => {
+    const { user } = renderWindow({ messages: [] });
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+
+  it("disables the actions while loading", async () => {
+    const { user } = renderWindow({ isLoading: true });
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+
+  it("copies the transcript and announces it", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    await user.click(screen.getByRole("menuitem", { name: "Copy as Markdown" }));
+
+    expect(await screen.findByText("Copied to clipboard")).toBeInTheDocument();
+    expect(screen.getByText("Copied to clipboard").closest('[role="status"]')).not.toBeNull();
+    const copied = await navigator.clipboard.readText();
+    expect(copied).toContain("## User\n\nWhat are your prices?");
+    expect(copied).toContain("## Assistant\n\nPlans start at $10.");
+  });
+
+  it("clears the last status when the menu is opened again", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    await user.click(screen.getByRole("menuitem", { name: "Copy as Markdown" }));
+    await screen.findByText("Copied to clipboard");
+
+    await user.click(screen.getByRole("button", { name: "More options" }));
+
+    expect(screen.queryByText("Copied to clipboard")).toBeNull();
+  });
+
+  it("closes only the menu on the first Escape, and the chat on the second", async () => {
+    const { user, onClose } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+
+    await user.keyboard("{Escape}");
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(onClose).not.toHaveBeenCalled();
+
+    await user.keyboard("{Escape}");
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("ignores an Escape that something else already handled", () => {
+    const { onClose } = renderWindow();
+    // A listener on body runs before the chat's listener on document.
+    const handle = (event: Event) => event.preventDefault();
+    document.body.addEventListener("keydown", handle);
+
+    fireEvent.keyDown(document.body, { key: "Escape" });
+
+    document.body.removeEventListener("keydown", handle);
+    expect(onClose).not.toHaveBeenCalled();
+  });
+
+  it("uses the translated labels", async () => {
+    const { locales } = await import("../../locales");
+    const { user } = renderWindow({ translations: locales.fr });
+    await user.click(screen.getByRole("button", { name: "Plus d'options" }));
+    expect(
+      screen.getByRole("menuitem", { name: "Copier en Markdown" }),
+    ).toBeInTheDocument();
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/components/__tests__/ChatWindow.export.test.tsx`
+Expected: FAIL. `conversationExport` is not a prop of `ChatWindow`; no "More options" button is found.
+
+- [ ] **Step 3: Wire `ChatWindow`**
+
+In `widget/src/components/ChatWindow.tsx`:
+
+Add imports:
+
+```tsx
+import { HeaderMenu } from "./HeaderMenu";
+import { useConversationExport } from "../hooks/useConversationExport";
+```
+
+Add to `ChatWindowProps`, after `voice`:
+
+```tsx
+  /** Show the header menu that copies or downloads the conversation. */
+  conversationExport?: boolean;
+  /** BCP-47 tag for the dates in an exported transcript. */
+  locale?: string;
+```
+
+Add to the destructured props, after `voice = null,`:
+
+```tsx
+  conversationExport = false,
+  locale = "en-US",
+```
+
+After the `speechLabels` constant add:
+
+```tsx
+  const exporter = useConversationExport({
+    enabled: conversationExport,
+    messages,
+    busy: isLoading,
+    locale,
+    translations,
+  });
+```
+
+In the Escape effect, change the condition so an Escape the open menu already handled does not also close the chat:
+
+```tsx
+      if (e.key === "Escape" && !e.isComposing && !e.defaultPrevented) {
+```
+
+Pass the menu to the header:
+
+```tsx
+      <ChatHeader
+        title={title}
+        subtitle={subtitle}
+        titleId={titleId}
+        closeLabel={closeLabel}
+        onClose={onClose}
+        actions={
+          conversationExport ? (
+            <HeaderMenu
+              label={translations?.moreOptions ?? "More options"}
+              items={exporter.items}
+              onOpen={exporter.clearStatus}
+            />
+          ) : undefined
+        }
+      />
+```
+
+Inside `<div className="relative flex-1 overflow-hidden">`, directly after the `{activeSources && ( ... )}` block, add:
+
+```tsx
+        {/* Mounted whenever export is on, so the text is announced when it
+            changes. Absent otherwise: the typing indicator is a status too. */}
+        {conversationExport && (
+          <div
+            role="status"
+            className="pointer-events-none absolute inset-x-0 top-2 z-10 flex justify-center px-4"
+          >
+            {exporter.status && (
+              <span className="rounded-claudius-full bg-claudius-text px-3 py-1 text-xs text-claudius-surface shadow-claudius-elevated">
+                {exporter.status}
+              </span>
+            )}
+          </div>
+        )}
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/components/__tests__/ChatWindow.export.test.tsx src/components/__tests__/ChatWindow.test.tsx`
+Expected: 10 new tests pass, and every existing `ChatWindow` test still passes, including "shows typing indicator when loading".
+
+- [ ] **Step 5: Write the failing `ChatWidget` tests**
+
+Create `widget/src/components/__tests__/ChatWidget.export.test.tsx`:
+
+```tsx
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { ChatWidget } from "../ChatWidget";
+
+globalThis.fetch = vi.fn();
+
+// The toggle is the only button before the chat opens.
+async function openChat() {
+  await userEvent.setup().click(screen.getByRole("button"));
+}
+
+describe("ChatWidget conversationExport option", () => {
+  it("is off by default", async () => {
+    render(<ChatWidget apiUrl="https://test.workers.dev" locale="en" />);
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+
+  it("shows the header menu when enabled", async () => {
+    render(
+      <ChatWidget apiUrl="https://test.workers.dev" locale="en" conversationExport />,
+    );
+    await openChat();
+    expect(screen.getByRole("button", { name: "More options" })).toBeInTheDocument();
+  });
+
+  it.each([["true"], ["false"], [1], [{}]])(
+    "fails closed for %j, which is not the literal true",
+    async (value) => {
+      render(
+        <ChatWidget
+          apiUrl="https://test.workers.dev"
+          locale="en"
+          conversationExport={value as unknown as boolean}
+        />,
+      );
+      await openChat();
+      expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    },
+  );
+
+  it("labels the menu in the widget's language", async () => {
+    render(
+      <ChatWidget apiUrl="https://test.workers.dev" locale="de" conversationExport />,
+    );
+    await openChat();
+    expect(
+      screen.getByRole("button", { name: "Weitere Optionen" }),
+    ).toBeInTheDocument();
+  });
+});
+```
+
+Run: `./node_modules/.bin/vitest run src/components/__tests__/ChatWidget.export.test.tsx`
+Expected: FAIL. `conversationExport` is not a prop of `ChatWidget`.
+
+- [ ] **Step 6: Wire `ChatWidget`**
+
+In `widget/src/components/ChatWidget.tsx`:
+
+Change the voice import to also bring in `resolveSpeechLang`:
+
+```tsx
+import {
+  resolveSpeechLang,
+  resolveVoiceConfig,
+  type VoiceOptions,
+} from "../utils/voice";
+```
+
+Add to `ChatWidgetProps`, after `voice`:
+
+```tsx
+  /**
+   * Let visitors copy the conversation as Markdown, or download it as
+   * Markdown or JSON, from a menu in the chat header. Everything happens in
+   * the browser and nothing is sent to the Worker. Only the literal `true`
+   * enables it. See the Conversation export guide.
+   * @defaultValue `false`
+   */
+  conversationExport?: boolean;
+```
+
+Add `conversationExport = false,` to the destructured props after `voice = false,`.
+
+Replace the `voiceConfig` memo with a shared locale, so speech and transcript dates agree:
+
+```tsx
+  // Speech and transcript dates follow the widget's language, detected the
+  // same way as the translations when no locale is given.
+  const activeLocale = useMemo(() => locale ?? detectLocale(), [locale]);
+  const voiceConfig = useMemo(
+    () => resolveVoiceConfig(voice, activeLocale),
+    [voice, activeLocale],
+  );
+  // The regional variant the visitor uses (en-GB, fr-CA), for dates.
+  const dateLocale = useMemo(
+    () => resolveSpeechLang(activeLocale),
+    [activeLocale],
+  );
+```
+
+Pass both to `<ChatWindow>`, after `voice={voiceConfig}`:
+
+```tsx
+            // Fail closed: a templated "false" string is truthy.
+            conversationExport={conversationExport === true}
+            locale={dateLocale}
+```
+
+- [ ] **Step 7: Run everything**
+
+Run: `./node_modules/.bin/vitest run`
+Expected: every file passes, including all `ChatWidget.voice` tests, which depend on the locale memo just refactored.
+
+Run: `./node_modules/.bin/tsc --noEmit && ./node_modules/.bin/typedoc --emit none`
+Expected: exit 0.
+
+- [ ] **Step 8: Commit**
+
+```bash
+git add widget/src/components/ChatWindow.tsx widget/src/components/ChatWidget.tsx widget/src/components/__tests__/ChatWindow.export.test.tsx widget/src/components/__tests__/ChatWidget.export.test.tsx
+git commit -m "feat(widget): conversationExport option and header menu wiring" -m "Opt-in and fails closed: only the literal true renders the menu, and nothing at all renders when it is off. The chat's Escape listener now skips events that are already defaultPrevented, so Escape closes an open menu without closing the window." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 9: `ClaudiusConfig`, `<claudius-chat>`, and the dev app
+
+**Files:**
+- Modify: `widget/src/embed.tsx`, `widget/src/main.tsx`
+- Test: `widget/src/__tests__/embed.test.tsx`
+
+**Interfaces:**
+- Consumes: `ChatWidgetProps.conversationExport` (Task 8).
+- Produces: `ClaudiusConfig.conversationExport?: boolean`; attribute `conversation-export` (present, or any value but `"false"`, enables). The dev app enables it, which Task 11 relies on.
+
+- [ ] **Step 1: Write the failing tests**
+
+Append to `widget/src/__tests__/embed.test.tsx`:
+
+```tsx
+describe("embed conversationExport option", () => {
+  beforeEach(() => {
+    vi.resetModules();
+    document.body.innerHTML = "";
+    window.sessionStorage.clear();
+    window.ClaudiusConfig = undefined;
+  });
+
+  afterEach(() => {
+    document.body.innerHTML = "";
+    window.ClaudiusConfig = undefined;
+  });
+
+  async function openChat() {
+    (await screen.findByRole("button", { name: /open chat/i })).click();
+    await screen.findByRole("dialog");
+  }
+
+  function mountElement(attributes: Record<string, string>) {
+    const el = document.createElement("claudius-chat");
+    el.setAttribute("api-url", "https://test.example/api");
+    for (const [name, value] of Object.entries(attributes)) {
+      el.setAttribute(name, value);
+    }
+    document.body.appendChild(el);
+  }
+
+  it("enables the header menu from ClaudiusConfig", async () => {
+    window.ClaudiusConfig = {
+      apiUrl: "https://test.example/api",
+      conversationExport: true,
+    };
+    await import("../embed");
+    await openChat();
+    expect(screen.getByRole("button", { name: "More options" })).toBeInTheDocument();
+  });
+
+  it("stays off for a templated string in ClaudiusConfig", async () => {
+    window.ClaudiusConfig = {
+      apiUrl: "https://test.example/api",
+      conversationExport: "false" as unknown as boolean,
+    };
+    await import("../embed");
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+
+  it("enables it via the web component attribute", async () => {
+    await import("../embed");
+    mountElement({ "conversation-export": "" });
+    await openChat();
+    expect(screen.getByRole("button", { name: "More options" })).toBeInTheDocument();
+  });
+
+  it('stays off for conversation-export="false", and when absent', async () => {
+    await import("../embed");
+    mountElement({ "conversation-export": "false" });
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run: `./node_modules/.bin/vitest run src/__tests__/embed.test.tsx`
+Expected: FAIL. TypeScript rejects `conversationExport` on `ClaudiusConfig`; the two "enables" tests find no button.
+
+- [ ] **Step 3: Implement**
+
+In `widget/src/embed.tsx`:
+
+- Add `conversationExport?: boolean;` to `interface ClaudiusConfig`, after `voice`.
+- In `init()`, add `conversationExport={config.conversationExport}` after `voice={config.voice}`.
+- Add `"conversation-export",` to `observedAttributes`, after `"attachments",`.
+- In `render()`, after the `attachments` constant:
+
+```tsx
+    // `conversation-export` / `="true"` enables it; "false" or absent does not.
+    const exportAttr = this.getAttribute("conversation-export");
+    const conversationExport =
+      exportAttr === null ? undefined : exportAttr !== "false";
+```
+
+- Add `conversationExport={conversationExport}` after `attachments={attachments}`.
+
+In `widget/src/main.tsx`, enable it in the dev app so it can be tried by hand and by Playwright:
+
+```tsx
+    <ChatWidget
+      apiUrl="http://localhost:8787"
+      attachments
+      voice
+      conversationExport
+    />
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run: `./node_modules/.bin/vitest run src/__tests__/embed.test.tsx && ./node_modules/.bin/tsc --noEmit`
+Expected: all embed tests pass (4 new), exit 0.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add widget/src/embed.tsx widget/src/main.tsx widget/src/__tests__/embed.test.tsx
+git commit -m "feat(widget): conversationExport in ClaudiusConfig and <claudius-chat>" -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 10: Client config schema, validation, and snippets
+
+**Files:**
+- Modify: `scripts/lib/config.ts`, `scripts/lib/snippet.ts`, `clients/_schema.json`
+- Test: `scripts/lib/__tests__/conversation-export-config.test.ts` (create)
+
+**Interfaces:**
+- Produces: `WidgetConfig.conversationExport?: boolean`. Snippets emit it only when it is `true`.
+
+- [ ] **Step 1: Write the failing tests**
+
+Create `scripts/lib/__tests__/conversation-export-config.test.ts`:
+
+```ts
+import { describe, it, expect } from "vitest";
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { validateConfig } from "../config.js";
+import type { ClientConfig, ValidationError } from "../config.js";
+import { generateScriptSnippet, generateWebComponentSnippet } from "../snippet.js";
+
+function base(overrides: Partial<ClientConfig> = {}): Record<string, unknown> {
+  return {
+    name: "Test Client",
+    slug: "test-client",
+    apiUrl: "https://api.example.com",
+    allowedDomains: ["example.com"],
+    ...overrides,
+  };
+}
+
+function fields(errors: ValidationError[]): string[] {
+  return errors.map((e) => e.field);
+}
+
+const SCRIPT_URL = "https://cdn.example.com/claudius.js";
+
+describe("validateConfig: conversationExport", () => {
+  it("accepts a boolean", () => {
+    expect(validateConfig(base({ widget: { conversationExport: true } }), "test-client")).toEqual([]);
+    expect(validateConfig(base({ widget: { conversationExport: false } }), "test-client")).toEqual([]);
+  });
+
+  it("rejects anything else, naming the field", () => {
+    for (const value of ["true", 1, {}, null]) {
+      const errors = validateConfig(
+        base({ widget: { conversationExport: value as never } }),
+        "test-client",
+      );
+      expect(fields(errors)).toEqual(["widget.conversationExport"]);
+      expect(errors[0].message).toBe("widget.conversationExport must be a boolean");
+    }
+  });
+});
+
+describe("snippets: conversationExport", () => {
+  it("is emitted only when it is true", () => {
+    const on = base({ widget: { conversationExport: true } }) as unknown as ClientConfig;
+    expect(generateScriptSnippet(on, SCRIPT_URL)).toContain('"conversationExport": true');
+    expect(generateWebComponentSnippet(on, SCRIPT_URL)).toContain('conversation-export="true"');
+
+    for (const widget of [{ conversationExport: false }, {}]) {
+      const off = base({ widget }) as unknown as ClientConfig;
+      expect(generateScriptSnippet(off, SCRIPT_URL)).not.toContain("conversationExport");
+      expect(generateWebComponentSnippet(off, SCRIPT_URL)).not.toContain("conversation-export");
+    }
+  });
+});
+
+describe("_schema.json: conversationExport", () => {
+  it("declares widget.conversationExport as a boolean", () => {
+    const schema = JSON.parse(
+      readFileSync(resolve(__dirname, "../../../clients/_schema.json"), "utf-8"),
+    );
+    expect(schema.properties.widget.properties.conversationExport.type).toBe("boolean");
+  });
+});
+```
+
+- [ ] **Step 2: Run and confirm failure**
+
+Run from `scripts/`: `../node_modules/.bin/vitest run --config vitest.config.ts lib/__tests__/conversation-export-config.test.ts`
+Expected: FAIL. No error is reported for the invalid values, and the snippets and schema lack the option.
+
+- [ ] **Step 3: Implement**
+
+`scripts/lib/config.ts`: add `conversationExport?: boolean;` to `WidgetConfig` after `voice`. After the whole `if (widget.voice !== undefined) { ... }` block, still inside the widget section, add:
+
+```ts
+    if (
+      widget.conversationExport !== undefined &&
+      typeof widget.conversationExport !== "boolean"
+    ) {
+      errors.push({
+        field: "widget.conversationExport",
+        message: "widget.conversationExport must be a boolean",
+      });
+    }
+```
+
+`scripts/lib/snippet.ts`: in `generateScriptSnippet`, after the `voice` block:
+
+```ts
+    // Opt-in, so only `true` is worth emitting.
+    if (config.widget.conversationExport === true) {
+      configObj.conversationExport = true;
+    }
+```
+
+In `generateWebComponentSnippet`, after the whole `voice` block:
+
+```ts
+    if (config.widget.conversationExport === true) {
+      attrs.push(["conversation-export", "true"]);
+    }
+```
+
+`clients/_schema.json`: inside `properties.widget.properties`, after the `voice` property, add (mind the comma after `voice`'s closing brace):
+
+```json
+        "conversationExport": {
+          "type": "boolean",
+          "description": "Let visitors copy the conversation as Markdown, or download it as Markdown or JSON, from a menu in the chat header. Off by default. Nothing is sent to the worker."
+        }
+```
+
+- [ ] **Step 4: Run and confirm it passes**
+
+Run from `scripts/`: `../node_modules/.bin/vitest run --config vitest.config.ts`
+Expected: 7 files, 86 tests pass (82 existing, 4 new).
+
+Run from the repo root: `node -e "JSON.parse(require('fs').readFileSync('clients/_schema.json','utf8')); console.log('schema ok')"`
+Expected: `schema ok`.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add scripts/lib/config.ts scripts/lib/snippet.ts clients/_schema.json scripts/lib/__tests__/conversation-export-config.test.ts
+git commit -m "feat(scripts): conversationExport in client config schema, validation, and snippets" -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 11: Playwright spec
+
+**Files:**
+- Create: `widget/e2e/export.spec.ts`
+
+**Interfaces:**
+- Consumes: the dev app with `conversationExport` on (Task 9); `mockChatApi` from `./helpers`.
+
+- [ ] **Step 1: Write the spec**
+
+Create `widget/e2e/export.spec.ts`:
+
+```ts
+import { test, expect, type Page } from "@playwright/test";
+import { readFile } from "node:fs/promises";
+import { mockChatApi } from "./helpers";
+
+/**
+ * Conversation export in a real browser: an actual file download, the real
+ * clipboard where the permission can be granted, and Escape. Serialization
+ * edge cases are covered by the unit tests in src/utils/__tests__.
+ */
+async function haveConversation(page: Page) {
+  const api = await mockChatApi(page);
+  api.enqueueReply("Plans start at $10.");
+  await page.goto("/");
+  await page.getByRole("button", { name: /open chat/i }).click();
+  const input = page.getByLabel(/type your message/i);
+  await input.fill("What are your prices?");
+  await input.press("Enter");
+  await expect(
+    page.getByRole("log").getByText("Plans start at $10."),
+  ).toBeVisible();
+}
+
+test.describe("conversation export", () => {
+  test("downloads the conversation as Markdown", async ({ page }) => {
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    const downloading = page.waitForEvent("download");
+    await page.getByRole("menuitem", { name: "Download as Markdown" }).click();
+    const download = await downloading;
+
+    expect(download.suggestedFilename()).toMatch(
+      /^chat-transcript-\d{4}-\d{2}-\d{2}\.md$/,
+    );
+    const text = await readFile(await download.path(), "utf8");
+    expect(text).toContain("# Chat transcript");
+    expect(text).toMatch(/## User · .+\n\nWhat are your prices\?/);
+    expect(text).toMatch(/## Assistant · .+\n\nPlans start at \$10\./);
+  });
+
+  test("downloads the conversation as JSON", async ({ page }) => {
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    const downloading = page.waitForEvent("download");
+    await page.getByRole("menuitem", { name: "Download as JSON" }).click();
+    const download = await downloading;
+
+    expect(download.suggestedFilename()).toMatch(/\.json$/);
+    const messages = JSON.parse(await readFile(await download.path(), "utf8"));
+    expect(messages.map((m: { role: string }) => m.role)).toEqual([
+      "user",
+      "assistant",
+    ]);
+    expect(messages[0].createdAt).toMatch(/^\d{4}-\d{2}-\d{2}T/);
+  });
+
+  test("copies the conversation as Markdown", async ({
+    page,
+    context,
+    browserName,
+  }) => {
+    test.skip(
+      browserName !== "chromium",
+      "Only Chromium lets a test grant clipboard permissions",
+    );
+    await context.grantPermissions(["clipboard-read", "clipboard-write"]);
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    await page.getByRole("menuitem", { name: "Copy as Markdown" }).click();
+
+    await expect(page.getByText("Copied to clipboard")).toBeVisible();
+    const copied = await page.evaluate(() => navigator.clipboard.readText());
+    expect(copied).toContain("Plans start at $10.");
+  });
+
+  test("Escape closes the menu first, then the chat", async ({ page }) => {
+    await haveConversation(page);
+    const trigger = page.getByRole("button", { name: "More options" });
+
+    await trigger.click();
+    await expect(page.getByRole("menu")).toBeVisible();
+    await page.keyboard.press("Escape");
+    await expect(page.getByRole("menu")).toBeHidden();
+    await expect(page.getByRole("dialog")).toBeVisible();
+    await expect(trigger).toBeFocused();
+
+    await page.keyboard.press("Escape");
+    await expect(page.getByRole("dialog")).toBeHidden();
+  });
+
+  test("the actions are unavailable until there is something to export", async ({
+    page,
+  }) => {
+    await mockChatApi(page);
+    await page.goto("/");
+    await page.getByRole("button", { name: /open chat/i }).click();
+
+    await page.getByRole("button", { name: "More options" }).click();
+    for (const item of await page.getByRole("menuitem").all()) {
+      await expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+});
+```
+
+- [ ] **Step 2: Run it locally in Chromium**
+
+Playwright cannot install browsers on this OS, and its global setup trips the pnpm 11 quirk, so build directly and use the system Chrome through a throwaway config. From `widget/`:
+
+```bash
+./node_modules/.bin/vite build --config vite.config.embed.ts
+cat > playwright.local.config.ts <<'EOF'
+import base from "./playwright.config";
+import { defineConfig } from "@playwright/test";
+
+export default defineConfig({
+  ...base,
+  projects: (base.projects ?? [])
+    .filter((p) => p.name === "chromium-desktop")
+    .map((p) => ({ ...p, use: { ...p.use, channel: "chrome" } })),
+});
+EOF
+E2E_SKIP_BUILD=1 ./node_modules/.bin/playwright test --config playwright.local.config.ts e2e/export.spec.ts
+rm playwright.local.config.ts
+```
+
+Expected: 5 passed. If `pnpm dev` fails to start as the web server, start `./node_modules/.bin/vite` in another terminal first; the config reuses a server already on the port.
+
+Then run the whole local suite the same way, without the spec path, to make sure the new header control broke no existing spec.
+Expected: all chromium-desktop specs pass. WebKit and mobile-safari cannot run locally and are covered by CI.
+
+- [ ] **Step 3: Confirm the throwaway config is gone, then commit**
+
+Run: `git status --short widget/`
+Expected: only `?? widget/e2e/export.spec.ts`. No `playwright.local.config.ts`.
+
+```bash
+git add widget/e2e/export.spec.ts
+git commit -m "test(widget): e2e for conversation export" -m "A real download for both formats, the real clipboard in Chromium, and Escape closing the menu before the chat." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 12: Documentation
+
+**Files:**
+- Create: `docs/src/content/docs/configuration/conversation-export.md`
+- Modify: `docs/src/content/docs/configuration/widget.md`, `localization.md`, `clients.md`, `docs/src/content/docs/faq.md`, `CLAUDE.md`
+
+- [ ] **Step 1: Write the guide**
+
+Create `docs/src/content/docs/configuration/conversation-export.md`. The page itself contains a four-backtick block, so it is fenced with five here; copy what is between the five-backtick lines.
+
+`````markdown
+---
+title: Conversation export
+description: Let visitors copy or download the conversation as Markdown or JSON, and understand what an export contains.
+sidebar:
+  order: 9
+---
+
+Conversation export adds a **More options** menu to the chat header with three
+actions:
+
+- **Copy as Markdown** puts a transcript on the clipboard.
+- **Download as Markdown** saves the same transcript as a `.md` file.
+- **Download as JSON** saves the raw message array as a `.json` file.
+
+Visitors use it to share an answer with a teammate, attach a transcript to a
+support ticket, or keep a record. It is **off by default**. Everything happens
+in the visitor's browser, and nothing is sent to your worker.
+
+## Enabling it
+
+```tsx
+<ChatWidget apiUrl="https://api.example.com" conversationExport />
+```
+
+```html
+<script>
+  window.ClaudiusConfig = {
+    apiUrl: "https://api.example.com",
+    conversationExport: true,
+  };
+</script>
+```
+
+```html
+<claudius-chat api-url="https://api.example.com" conversation-export></claudius-chat>
+```
+
+In a [client config](/configuration/clients/), set
+`"widget": { "conversationExport": true }` and regenerate the snippet.
+
+Only the literal `true` enables it. A value such as the string `"false"`, which
+a CMS template can easily produce, leaves it off. On the web component,
+`conversation-export="false"` also leaves it off.
+
+The actions are greyed out while the conversation is empty and while a reply
+is still arriving, so a transcript never ends in a half-finished answer.
+
+## The Markdown transcript
+
+````markdown
+# Chat transcript
+
+Exported Sep 19, 2026, 3:32 PM (GMT+01:00)
+
+## User · Sep 19, 2026, 3:03 PM
+
+What does the error in this screenshot mean?
+
+Attachments:
+
+- `error_v2.png` (image/png, 48 KB)
+
+## Assistant · Sep 19, 2026, 3:03 PM
+
+The response body is not valid JSON. Guard the parse:
+
+```js
+const data = JSON.parse(text);
+```
+
+Sources:
+
+1. [Parsing JSON](https://example.com/docs/json)
+````
+
+- The transcript is written in the widget's [language](/configuration/localization/),
+  and dates follow the visitor's regional format and time zone. The zone is
+  given once, as a UTC offset.
+- Message text is exported as written, so code blocks, lists, and links
+  survive. A code block that a stopped reply left open is closed, so it cannot
+  swallow the messages after it. Line breaks are kept as the visitor saw them.
+- Citations become a numbered list of links. A source whose URL is not
+  `http:` or `https:` keeps its title and loses its link.
+- Attachments are listed by name, type, and size. The file itself is never
+  included, and neither is its download link.
+- Tools the assistant used are named. Their inputs and results are not.
+- Messages from a conversation that began before you upgraded have no
+  timestamp, and are exported without one.
+
+## The JSON file
+
+A pretty-printed array of [`ChatMessage`](/api/) objects, exactly as the widget
+keeps them in `sessionStorage`:
+
+```json
+[
+  {
+    "id": "msg-1",
+    "role": "user",
+    "content": "What are your prices?",
+    "createdAt": "2026-09-19T14:03:00.000Z"
+  },
+  {
+    "id": "msg-2",
+    "role": "assistant",
+    "content": "Plans start at $10.",
+    "createdAt": "2026-09-19T14:03:04.120Z",
+    "sources": [
+      { "url": "https://example.com/pricing", "title": "Pricing", "type": "page" }
+    ]
+  }
+]
+```
+
+Inline attachment bytes are never included. `createdAt` is new in this
+release; it is sent to the worker along with the rest of each message, and the
+worker ignores it.
+
+## Privacy posture
+
+- **Export runs entirely in the browser.** No request is made, and your worker
+  never learns that a conversation was exported.
+- **A transcript contains whatever the conversation contains.** That includes
+  anything a visitor typed that the [PII plugin](/plugins/) did not redact.
+  Once it is a file or on the clipboard, it is outside the widget's control.
+- **The JSON can include attachment storage details.** With the
+  [R2 attachment backend](/configuration/attachments/), each stored attachment
+  carries its storage key and a signed URL that works until it expires. The
+  Markdown transcript leaves both out.
+- **A transcript is not evidence.** It is an editable text file, and a visitor
+  can type text into a message that looks like an assistant heading. If you
+  need a reliable record of what the assistant said, keep it on the worker
+  side.
+
+This is why the option exists and is off by default: leave it off for
+deployments where conversations should not leave the chat window.
+
+## Limitations
+
+- Copying needs a secure (HTTPS) page. In an `<iframe>`, the frame also needs
+  `allow="clipboard-write"`. Where copying is refused, the widget says so and
+  suggests downloading instead.
+- Some in-app browsers (the ones inside social media apps) silently block
+  downloads. The page cannot detect that. Copy still works there.
+- A Markdown viewer decides how raw HTML in a message is shown. The transcript
+  escapes HTML that could hide later messages, and leaves the rest as written.
+`````
+
+- [ ] **Step 2: Update the existing pages**
+
+`docs/src/content/docs/configuration/widget.md`: in the options table, after the `voice` row, add:
+
+```markdown
+| `conversationExport` | `boolean` | `false` | Header menu that copies the conversation as Markdown, or downloads it as Markdown or JSON. Runs in the browser; nothing is sent to the worker. See [Conversation export](/configuration/conversation-export/) |
+```
+
+In the same file's "Web component attributes" section, replace the end of the attribute sentence, from `and `voice` with its companions` through `(see [Voice](/configuration/voice/#enable-voice)).`, with:
+
+```markdown
+`voice` with its companions
+`voice-mode`, `voice-auto-submit`, `voice-input`, `voice-output`, and
+`voice-lang` (see [Voice](/configuration/voice/#enable-voice)), and
+`conversation-export` (see
+[Conversation export](/configuration/conversation-export/#enabling-it)).
+```
+
+`docs/src/content/docs/configuration/localization.md`: in the "Available keys" table, after the Voice row, add:
+
+```markdown
+| [Conversation export](/configuration/conversation-export/) | `moreOptions`, `copyAsMarkdown`, `downloadAsMarkdown`, `downloadAsJson`, `copiedToClipboard`, `copyFailed`, `transcriptTitle`, `transcriptExported`, `transcriptUser`, `transcriptAssistant`, `transcriptAttachments`, `transcriptSources` |
+```
+
+`docs/src/content/docs/configuration/clients.md`: in the `widget` row of the config table, append before the closing ` |`:
+
+```markdown
+; `conversationExport` (`true` to enable, see [Conversation export](/configuration/conversation-export/))
+```
+
+`docs/src/content/docs/faq.md`: in "What data is stored, and where?", after the **Voice** bullet, add:
+
+```markdown
+- **Conversation export** (optional, off by default): copying or downloading a
+  transcript happens entirely in the visitor's browser. Nothing is sent to your
+  worker. Details in
+  [Conversation export](/configuration/conversation-export/#privacy-posture).
+```
+
+- [ ] **Step 3: Update `CLAUDE.md`**
+
+In the "Widget Components" table, after the `AttachmentPreview` row:
+
+```markdown
+| `HeaderMenu` | Generic accessible overflow menu in the chat header; hosts the export actions |
+```
+
+In "useChat Hook", extend the `messages` bullet to: `` `messages` - Array of chat messages, each stamped with an ISO `createdAt` when it enters the conversation ``.
+
+After the "### Voice" section and before "### Chat Request/Response", add:
+
+```markdown
+### Conversation Export
+
+Widget-only and opt-in (`conversationExport` prop / `ClaudiusConfig` key /
+`<claudius-chat conversation-export>` / `widget.conversationExport` in client
+configs). It fails closed: only the literal `true` enables it, and nothing
+renders when it is off. A `HeaderMenu` in the chat header offers Copy as
+Markdown, Download as Markdown, and Download as JSON, all in the browser with
+no request to the worker.
+
+Pure serializers live in `widget/src/utils/exportConversation.ts`
+(`protectMessageText`, `conversationToMarkdown`, `conversationToJson`,
+`exportFilename`); clipboard and download side effects in
+`widget/src/utils/saveText.ts`; `useConversationExport` (owned by `ChatWindow`)
+turns messages into menu items plus a transient status. Markdown keeps message
+text as written but closes unclosed code fences, turns single newlines into
+hard breaks outside code, and escapes a line-leading `<`. JSON is the
+persisted `ChatMessage[]`, never with inline attachment bytes.
+
+Never assert on raw `Intl` output in tests: CI's Node 20 emits U+202F before
+"PM" and local Node 24 does not. Docs: configuration/conversation-export.md;
+design: docs/plans/2026-09-19-conversation-export-design.md.
+```
+
+- [ ] **Step 4: Build the docs and check the links resolve**
+
+From `docs/`: `./node_modules/.bin/astro build`
+Expected: completes with no errors, one more page than before.
+
+```bash
+grep -c 'id="privacy-posture"' dist/configuration/conversation-export/index.html
+grep -c 'id="enabling-it"' dist/configuration/conversation-export/index.html
+```
+
+Expected: `1` and `1`. The FAQ links to the first anchor and the widget page to the second.
+
+- [ ] **Step 5: Commit**
+
+```bash
+git add docs/src/content/docs/configuration/conversation-export.md docs/src/content/docs/configuration/widget.md docs/src/content/docs/configuration/localization.md docs/src/content/docs/configuration/clients.md docs/src/content/docs/faq.md CLAUDE.md
+git commit -m "docs: conversation export guide" -m "Enabling it in each embed style, what each format contains, and a privacy posture that says plainly what an export can carry and that a transcript is not evidence." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 13: Bundle budget
+
+CONTRIBUTING requires a budget bump in its own commit with the increase explained. The "exceeded by" figure size-limit prints is not the real cost, because the old limit already holds 5% headroom over `main`. Measure both.
+
+**Files:**
+- Modify: `widget/.size-limit.json`
+
+- [ ] **Step 1: Measure the branch**
+
+From `widget/`:
+
+```bash
+./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts
+./node_modules/.bin/size-limit --json > /tmp/claude-export-branch.json; echo "exit $?"
+```
+
+Expected: a non-zero exit, because at least the IIFE entries exceed their limits. That is the reason for this task.
+
+- [ ] **Step 2: Measure `main` with the same tool**
+
+```bash
+SCRATCH=$(mktemp -d)
+git worktree add --detach "$SCRATCH/main-wt" origin/main
+ln -s "$PWD/node_modules" "$SCRATCH/main-wt/widget/node_modules"
+( cd "$SCRATCH/main-wt/widget" && ./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts && ./node_modules/.bin/size-limit --json > /tmp/claude-export-main.json )
+git worktree remove --force "$SCRATCH/main-wt" && git worktree prune
+```
+
+- [ ] **Step 3: Compute deltas and new limits**
+
+```bash
+node -e '
+const main = require("/tmp/claude-export-main.json"), branch = require("/tmp/claude-export-branch.json");
+for (const b of branch) {
+  const m = main.find((x) => x.name === b.name);
+  console.log(b.name.padEnd(28), "main", m.size, "branch", b.size, "delta", b.size - m.size, "-> limit", Math.ceil(b.size * 1.05) + " B");
+}'
+```
+
+Set each entry's `limit` in `widget/.size-limit.json` to the printed value. Change nothing else in the file.
+
+- [ ] **Step 4: Verify the gate passes**
+
+Run: `./node_modules/.bin/size-limit`
+Expected: exit 0, every entry within its limit.
+
+- [ ] **Step 5: Commit, quoting the measured deltas**
+
+Replace the bracketed figures with the numbers from Step 3.
+
+```bash
+git add widget/.size-limit.json
+git commit -m "chore(widget): raise bundle budgets for conversation export" -m "Measured against main with size-limit: claudius.iife.js [+N B raw, +N B gzip, +N B brotli]; claudius.js [+N B raw, +N B gzip, +N B brotli]; claudius.css [+N B raw, +N B gzip, +N B brotli]. The cost is the header menu, the transcript serializer, and twelve strings in four locales. Limits are the measured sizes plus 5%." -m "Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>"
+```
+
+---
+
+### Task 14: Verify, review, then open the PR
+
+The maintainer merges within minutes of CI going green. A caveat in prose does not gate a merge, so **the independent review happens before the PR exists**, not after.
+
+- [ ] **Step 1: Run everything CI runs**
+
+From `widget/`:
+
+```bash
+./node_modules/.bin/eslint src/ && ./node_modules/.bin/prettier --check "src/**/*.{ts,tsx,css}" && ./node_modules/.bin/tsc --noEmit && ./node_modules/.bin/typedoc --emit none && ./node_modules/.bin/vitest run
+./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts && node scripts/emit-dts-cts.mjs
+./node_modules/.bin/publint --strict && ./node_modules/.bin/attw --pack . --exclude-entrypoints ./embed ./style.css
+./node_modules/.bin/size-limit
+```
+
+From `scripts/`: `../node_modules/.bin/vitest run --config vitest.config.ts`
+From `worker/`: `./node_modules/.bin/vitest run` (untouched, but it shares the repo)
+
+Expected: every command exits 0. Record the test counts.
+
+- [ ] **Step 2: Try it by hand**
+
+Start `./node_modules/.bin/vite` in `widget/`, open http://localhost:5173, and check what no test can: the menu sits correctly beside the close button and is not clipped; it looks right in dark mode and in the mobile bottom sheet (narrow the window below 640 px); the status pill is legible; a downloaded `.md` renders properly in a Markdown viewer.
+
+- [ ] **Step 3: Confirm nothing unintended is staged or committed**
+
+```bash
+git status --short
+git diff --stat origin/main...HEAD
+```
+
+Expected: the only uncommitted entries are the pre-existing local ones (`.mcp.json`, `.claude/`, `signup-state.png`). The diff lists only files named in this plan. No `pnpm-workspace.yaml`, no `playwright.local.config.ts`.
+
+- [ ] **Step 4: Independent review, and fix what it finds**
+
+Use superpowers:requesting-code-review against `origin/main...HEAD`. Point the reviewer at the spec and ask specifically about: an embed with the option **off** (the last feature shipped a bug that affected exactly those), Escape and the focus trap, the fence scanner's edge cases, and anything that could throw on odd message content. Apply fixes as new commits, re-run Step 1, and only then continue.
+
+- [ ] **Step 5: Push and open the PR**
+
+Per `CLAUDE.md`, finishing a branch means pushing and opening a PR without asking.
+
+```bash
+git push -u origin 55-conversation-export
+gh pr create --title "feat(widget): conversation export (Markdown, JSON, copy to clipboard)" --body-file <(cat <<'EOF'
+Closes #55.
+
+## What
+
+An opt-in **More options** menu in the chat header: Copy as Markdown, Download as Markdown, Download as JSON. Everything happens in the browser. Nothing is sent to the worker.
+
+## Decisions worth a look
+
+- **Off by default, which departs from the issue.** Embeds load the floating `@1` CDN tag, so an on-by-default feature would add a header button to every live site on release, including any privacy-sensitive client. Opt-in matches `attachments` and `voice`, and can be flipped later without breaking anyone. Only the literal `true` enables it.
+- **New optional `ChatMessage.createdAt`.** The issue asks for timestamps and messages had none. It rides in the request body like `id` does; workers have discarded unknown message fields since the first commit.
+- **Message text is exported as written, with protections** so one message cannot damage the rest of a rendered transcript: unclosed code fences are closed, single newlines become hard breaks outside code, and a line-leading `<` is escaped.
+- **Escape closes only the menu.** The chat's document-level listener now skips `defaultPrevented` events.
+
+Design: `docs/plans/2026-09-19-conversation-export-design.md`.
+
+## Acceptance criteria
+
+- [x] Header overflow menu with Copy as Markdown, Download as Markdown, Download as JSON
+- [x] Markdown preserves roles, timestamps, code blocks, and source citations
+- [x] JSON is the raw `ChatMessage[]` the widget stores, without inline attachment bytes
+- [x] Configurable per widget, across the React prop, `ClaudiusConfig`, `<claudius-chat>`, and client configs
+- [x] Unit tests for serialization edge cases
+
+## Testing
+
+[Fill in the real counts from Step 1, and state that e2e ran locally in Chromium only; WebKit runs in CI.]
+
+## Bundle
+
+[Fill in the measured deltas from the budget commit.]
+
+🤖 Generated with [Claude Code](https://claude.com/claude-code)
+EOF
+)
+```
+
+- [ ] **Step 6: Confirm CI is judging this commit**
+
+```bash
+gh pr view --json state,headRefOid,url
+git rev-parse HEAD
+```
+
+Expected: `state` is `OPEN` and `headRefOid` equals `HEAD`. A merged PR silently ignores new pushes and keeps showing the old commit's green checks. Report the PR URL.

From 12d8bc047daac87c27a90821078b89e50ac4501a Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 12:25:08 -0400
Subject: [PATCH 03/28] docs(plans): correct three defects found in the
 pre-flight scan

A docs link pointed at /api/, which has no index page and nothing validates links. The bundle task wrote scratch files to /tmp. One hook test set state outside act().

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 ...9-19-conversation-export-implementation.md | 35 +++++++++++++------
 1 file changed, 24 insertions(+), 11 deletions(-)

diff --git a/docs/plans/2026-09-19-conversation-export-implementation.md b/docs/plans/2026-09-19-conversation-export-implementation.md
index 98009a0..14956d4 100644
--- a/docs/plans/2026-09-19-conversation-export-implementation.md
+++ b/docs/plans/2026-09-19-conversation-export-implementation.md
@@ -2106,12 +2106,18 @@ describe("useConversationExport", () => {
     expect(result.current.status).toBe("Copied to clipboard");
   });
 
-  it("hands the text to copyText before yielding, to keep the user activation", () => {
+  it("hands the text to copyText before yielding, to keep the user activation", async () => {
     const { result } = renderHook(() => useConversationExport(base));
+    let calledBeforeYielding = false;
 
-    act(() => item(result, "copy-markdown").onSelect());
+    // Async act, so the status update that follows the copy lands inside it
+    // instead of producing an act() warning. The count is read synchronously.
+    await act(async () => {
+      item(result, "copy-markdown").onSelect();
+      calledBeforeYielding = vi.mocked(copyText).mock.calls.length === 1;
+    });
 
-    expect(copyText).toHaveBeenCalledTimes(1);
+    expect(calledBeforeYielding).toBe(true);
   });
 
   it("reports a failed copy", async () => {
@@ -3241,8 +3247,8 @@ Sources:
 
 ## The JSON file
 
-A pretty-printed array of [`ChatMessage`](/api/) objects, exactly as the widget
-keeps them in `sessionStorage`:
+A pretty-printed array of `ChatMessage` objects, exactly as the widget
+[keeps them in `sessionStorage`](/api/widget/#message-persistence):
 
 ```json
 [
@@ -3403,30 +3409,37 @@ CONTRIBUTING requires a budget bump in its own commit with the increase explaine
 
 - [ ] **Step 1: Measure the branch**
 
-From `widget/`:
+Scratch files go in the plan's git-ignored workspace, not `/tmp`. From `widget/`:
 
 ```bash
+SCRATCH="$(git rev-parse --show-toplevel)/.superpowers/sdd/2026-09-19-conversation-export-implementation/size"
+mkdir -p "$SCRATCH"
 ./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts
-./node_modules/.bin/size-limit --json > /tmp/claude-export-branch.json; echo "exit $?"
+./node_modules/.bin/size-limit --json > "$SCRATCH/branch.json"; echo "exit $?"
 ```
 
 Expected: a non-zero exit, because at least the IIFE entries exceed their limits. That is the reason for this task.
 
 - [ ] **Step 2: Measure `main` with the same tool**
 
+Same shell, still in `widget/`, so `$SCRATCH` and `$PWD` carry over:
+
 ```bash
-SCRATCH=$(mktemp -d)
 git worktree add --detach "$SCRATCH/main-wt" origin/main
 ln -s "$PWD/node_modules" "$SCRATCH/main-wt/widget/node_modules"
-( cd "$SCRATCH/main-wt/widget" && ./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts && ./node_modules/.bin/size-limit --json > /tmp/claude-export-main.json )
+( cd "$SCRATCH/main-wt/widget" && ./node_modules/.bin/vite build && ./node_modules/.bin/vite build --config vite.config.embed.ts && ./node_modules/.bin/size-limit --json > "$SCRATCH/main.json" )
 git worktree remove --force "$SCRATCH/main-wt" && git worktree prune
+git worktree list
 ```
 
+Expected: `git worktree list` shows only the main checkout again.
+
 - [ ] **Step 3: Compute deltas and new limits**
 
 ```bash
-node -e '
-const main = require("/tmp/claude-export-main.json"), branch = require("/tmp/claude-export-branch.json");
+SCRATCH="$SCRATCH" node -e '
+const dir = process.env.SCRATCH;
+const main = require(dir + "/main.json"), branch = require(dir + "/branch.json");
 for (const b of branch) {
   const m = main.find((x) => x.name === b.name);
   console.log(b.name.padEnd(28), "main", m.size, "branch", b.size, "delta", b.size - m.size, "-> limit", Math.ceil(b.size * 1.05) + " B");

From c6049d299d52b06dd67480038b7055fb6b68389f Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 12:31:46 -0400
Subject: [PATCH 04/28] feat(widget): record createdAt on chat messages

Conversation export (#55) needs timestamps, and messages had none. Stamped where useChat creates a message, kept from the streaming placeholder to the settled reply, and restored when a plugin returns a fresh object. Workers discard unknown message fields, so nothing changes on the wire that matters.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 widget/src/api/types.ts                       |   5 +
 .../__tests__/useChat.timestamps.test.ts      | 197 ++++++++++++++++++
 widget/src/hooks/useChat.ts                   |  31 ++-
 3 files changed, 230 insertions(+), 3 deletions(-)
 create mode 100644 widget/src/hooks/__tests__/useChat.timestamps.test.ts

diff --git a/widget/src/api/types.ts b/widget/src/api/types.ts
index 0687b76..47b91b2 100644
--- a/widget/src/api/types.ts
+++ b/widget/src/api/types.ts
@@ -85,6 +85,11 @@ export interface ChatMessage {
   attachments?: ChatAttachment[];
   /** Tools the assistant called while producing this message, when any. */
   toolUses?: ToolUse[];
+  /**
+   * ISO 8601 time the message was added to the conversation. Absent on
+   * messages persisted by widget versions that predate conversation export.
+   */
+  createdAt?: string;
 }
 
 /**
diff --git a/widget/src/hooks/__tests__/useChat.timestamps.test.ts b/widget/src/hooks/__tests__/useChat.timestamps.test.ts
new file mode 100644
index 0000000..e98da72
--- /dev/null
+++ b/widget/src/hooks/__tests__/useChat.timestamps.test.ts
@@ -0,0 +1,197 @@
+import { renderHook, act, waitFor } from "@testing-library/react";
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { useChat } from "../useChat";
+import type { ClaudiusPlugin } from "../../plugins/types";
+
+const API_URL = "https://test.workers.dev";
+const STORAGE_KEY = "claudius:messages:test.workers.dev";
+const T1 = "2026-09-19T14:03:00.000Z";
+const T2 = "2026-09-19T14:03:05.000Z";
+const T3 = "2026-09-19T14:03:09.000Z";
+
+const mockFetch = vi.fn();
+globalThis.fetch = mockFetch;
+
+const encoder = new TextEncoder();
+
+function sseStream() {
+  let controller!: ReadableStreamDefaultController<Uint8Array>;
+  const body = new ReadableStream<Uint8Array>({
+    start(c) {
+      controller = c;
+    },
+  });
+  return {
+    response: {
+      ok: true,
+      status: 200,
+      headers: new Headers({ "Content-Type": "text/event-stream" }),
+      body,
+    },
+    emit(event: string, data: unknown) {
+      controller.enqueue(
+        encoder.encode(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`),
+      );
+    },
+    close() {
+      controller.close();
+    },
+  };
+}
+
+/** Resolve a blocking reply, moving the clock to `at` as it arrives. */
+function mockReplyAt(reply: string, at: string) {
+  mockFetch.mockImplementationOnce(async () => {
+    vi.setSystemTime(new Date(at));
+    return {
+      ok: true,
+      status: 200,
+      headers: new Headers(),
+      json: () => Promise.resolve({ reply }),
+    };
+  });
+}
+
+describe("useChat timestamps", () => {
+  beforeEach(() => {
+    mockFetch.mockReset();
+    sessionStorage.clear();
+    vi.useFakeTimers({ toFake: ["Date"] });
+    vi.setSystemTime(new Date(T1));
+  });
+  afterEach(() => vi.useRealTimers());
+
+  it("stamps the visitor message on send and the reply on arrival", async () => {
+    mockReplyAt("Hello!", T2);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    await act(async () => {
+      await result.current.sendMessage("Hi");
+    });
+
+    expect(result.current.messages[0].createdAt).toBe(T1);
+    expect(result.current.messages[1].createdAt).toBe(T2);
+  });
+
+  it("keeps a streamed reply's time from its first token", async () => {
+    const stream = sseStream();
+    mockFetch.mockResolvedValueOnce(stream.response);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    let sendPromise!: Promise<void>;
+    act(() => {
+      sendPromise = result.current.sendMessage("Hi");
+    });
+    await waitFor(() => expect(mockFetch).toHaveBeenCalledTimes(1));
+
+    vi.setSystemTime(new Date(T2));
+    act(() => stream.emit("chunk", { text: "Hel" }));
+    await waitFor(() => expect(result.current.messages).toHaveLength(2));
+    expect(result.current.messages[1].createdAt).toBe(T2);
+
+    vi.setSystemTime(new Date(T3));
+    act(() => {
+      stream.emit("done", { reply: "Hello!" });
+      stream.close();
+    });
+    await act(async () => {
+      await sendPromise;
+    });
+
+    expect(result.current.messages[1].content).toBe("Hello!");
+    expect(result.current.messages[1].createdAt).toBe(T2);
+  });
+
+  it("persists the timestamps with the history", async () => {
+    mockReplyAt("Hello!", T2);
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    await act(async () => {
+      await result.current.sendMessage("Hi");
+    });
+
+    const stored = JSON.parse(sessionStorage.getItem(STORAGE_KEY) ?? "[]");
+    expect(stored.map((m: { createdAt?: string }) => m.createdAt)).toEqual([
+      T1,
+      T2,
+    ]);
+  });
+
+  it("leaves messages restored from an older version without a time", () => {
+    sessionStorage.setItem(
+      STORAGE_KEY,
+      JSON.stringify([{ id: "msg-1", role: "user", content: "old" }]),
+    );
+    const { result } = renderHook(() => useChat({ apiUrl: API_URL }));
+
+    expect(result.current.messages[0].createdAt).toBeUndefined();
+  });
+
+  it("restores the time when a plugin returns a fresh message object", async () => {
+    mockReplyAt("hello", T2);
+    const rebuild: ClaudiusPlugin = {
+      name: "rebuild",
+      onBeforeSend: (m) => ({ id: m.id, role: m.role, content: m.content }),
+      onAfterReceive: (m) => ({
+        id: m.id,
+        role: m.role,
+        content: m.content.toUpperCase(),
+      }),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [rebuild] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hi");
+    });
+
+    expect(result.current.messages[0].createdAt).toBe(T1);
+    expect(result.current.messages[1]).toMatchObject({
+      content: "HELLO",
+      createdAt: T2,
+    });
+  });
+
+  it("stamps both sides of a reply a plugin answered locally", async () => {
+    const canned: ClaudiusPlugin = {
+      name: "canned",
+      onBeforeSend: (_m, ctx) => ctx.respondWith("We open at 9."),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [canned] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hours?");
+    });
+
+    expect(mockFetch).not.toHaveBeenCalled();
+    expect(result.current.messages.map((m) => m.createdAt)).toEqual([T1, T1]);
+  });
+
+  it("stamps a fallback reply a plugin supplied after an error", async () => {
+    mockFetch.mockResolvedValueOnce({
+      ok: false,
+      status: 500,
+      headers: new Headers(),
+      json: () => Promise.resolve({ error: "boom", code: "UNKNOWN_ERROR" }),
+    });
+    const recover: ClaudiusPlugin = {
+      name: "recover",
+      onError: (_e, ctx) => ctx.respondWith("We're offline."),
+    };
+    const { result } = renderHook(() =>
+      useChat({ apiUrl: API_URL, plugins: [recover] }),
+    );
+
+    await act(async () => {
+      await result.current.sendMessage("hi");
+    });
+
+    expect(result.current.messages.at(-1)).toMatchObject({
+      role: "assistant",
+      createdAt: T1,
+    });
+  });
+});
diff --git a/widget/src/hooks/useChat.ts b/widget/src/hooks/useChat.ts
index f892e0b..3088b0b 100644
--- a/widget/src/hooks/useChat.ts
+++ b/widget/src/hooks/useChat.ts
@@ -51,6 +51,9 @@ interface UseChatReturn {
 const MAX_PERSISTED_MESSAGES = 200;
 const DEFAULT_STORAGE_KEY_PREFIX = "claudius:messages";
 
+/** Timestamp for a message entering the conversation. */
+const timestamp = () => new Date().toISOString();
+
 function getStorageKey(prefix: string, apiUrl: string): string {
   let host: string;
   try {
@@ -215,7 +218,13 @@ export function useChat({
           setStreamingMessageId(placeholderId);
           const next: ChatMessage[] = [
             ...messagesRef.current,
-            { id: placeholderId, role: "assistant", content: "", ...patch },
+            {
+              id: placeholderId,
+              role: "assistant",
+              content: "",
+              createdAt: timestamp(),
+              ...patch,
+            },
           ];
           messagesRef.current = next;
           setMessages(next);
@@ -275,10 +284,15 @@ export function useChat({
           return;
         }
 
+        // A streamed reply keeps the time its first token arrived.
+        const createdAt =
+          messagesRef.current.find((m) => m.id === placeholderId)?.createdAt ??
+          timestamp();
         let assistantMessage: ChatMessage = {
           id: placeholderId ?? nextId(),
           role: "assistant",
           content: reply,
+          createdAt,
           sources,
           toolUses,
         };
@@ -290,6 +304,10 @@ export function useChat({
             assistantMessage,
             { messages: msgsToSend, apiUrl },
           );
+          // A plugin that returns a fresh object should not erase the time.
+          if (!assistantMessage.createdAt) {
+            assistantMessage = { ...assistantMessage, createdAt };
+          }
         }
         const settled =
           placeholderId !== null
@@ -352,6 +370,7 @@ export function useChat({
               id: nextId(),
               role: "assistant",
               content: recovery.content,
+              createdAt: timestamp(),
               sources: recovery.sources,
             };
             const withReply = [...msgsToSend, assistantMessage];
@@ -406,6 +425,7 @@ export function useChat({
         id: nextId(),
         role: "user",
         content: trimmed,
+        createdAt: timestamp(),
         ...(files.length > 0 ? { attachments: files } : {}),
       };
 
@@ -420,6 +440,10 @@ export function useChat({
         // A plugin cancelled the send: drop the message, render nothing.
         if (outcome.type === "abort") return;
 
+        // A plugin that returns a fresh object should not erase the time.
+        const keepTime = (m: ChatMessage): ChatMessage =>
+          m.createdAt ? m : { ...m, createdAt: userMessage.createdAt };
+
         // A plugin answered locally: show the user message and the canned
         // reply, and skip the network entirely.
         if (outcome.type === "respond") {
@@ -427,11 +451,12 @@ export function useChat({
             id: nextId(),
             role: "assistant",
             content: outcome.reply.content,
+            createdAt: timestamp(),
             sources: outcome.reply.sources,
           };
           const next = [
             ...messagesRef.current,
-            outcome.message,
+            keepTime(outcome.message),
             assistantMessage,
           ];
           messagesRef.current = next;
@@ -442,7 +467,7 @@ export function useChat({
           return;
         }
 
-        outgoing = outcome.message;
+        outgoing = keepTime(outcome.message);
       }
 
       const updatedMessages = [...messagesRef.current, outgoing];

From e5cc07fdee4b9207e40792d60867512923e0b0c9 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 12:42:57 -0400
Subject: [PATCH 05/28] feat(widget): message text protections for Markdown
 export

Closes unclosed code fences, turns single newlines into hard breaks outside code, and escapes a line-leading < so an unterminated HTML block cannot hide later messages. Code inside a fence is never touched.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 .../__tests__/exportConversation.test.ts      | 98 +++++++++++++++++++
 widget/src/utils/exportConversation.ts        | 88 +++++++++++++++++
 2 files changed, 186 insertions(+)
 create mode 100644 widget/src/utils/__tests__/exportConversation.test.ts
 create mode 100644 widget/src/utils/exportConversation.ts

diff --git a/widget/src/utils/__tests__/exportConversation.test.ts b/widget/src/utils/__tests__/exportConversation.test.ts
new file mode 100644
index 0000000..16d8ef1
--- /dev/null
+++ b/widget/src/utils/__tests__/exportConversation.test.ts
@@ -0,0 +1,98 @@
+import { describe, it, expect } from "vitest";
+import { protectMessageText } from "../exportConversation";
+
+describe("protectMessageText", () => {
+  describe("code fences", () => {
+    it("keeps a long code block byte for byte", () => {
+      const code = Array.from(
+        { length: 5000 },
+        (_, i) => `  line ${i}   `,
+      ).join("\n");
+      const text = "Here:\n\n```txt\n" + code + "\n```";
+      expect(protectMessageText(text)).toBe(text);
+    });
+
+    it("closes a fence left open by a stopped reply", () => {
+      expect(protectMessageText("Try:\n\n```js\nconst a = 1;")).toBe(
+        "Try:\n\n```js\nconst a = 1;\n```",
+      );
+    });
+
+    it("closes with the opener's character, length, and indentation", () => {
+      expect(protectMessageText("1. Run:\n\n   ~~~~bash\n   npm i")).toBe(
+        "1. Run:\n\n   ~~~~bash\n   npm i\n   ~~~~",
+      );
+    });
+
+    it("does not end a longer fence at a shorter one inside it", () => {
+      const text = "````md\n```js\ncode\n```\n````";
+      expect(protectMessageText(text)).toBe(text);
+    });
+
+    it("does not end a fence at a line that carries an info string", () => {
+      expect(protectMessageText("```\n```js\nx")).toBe("```\n```js\nx\n```");
+    });
+
+    it("does not end a backtick fence with tildes", () => {
+      expect(protectMessageText("```\n~~~\nx")).toBe("```\n~~~\nx\n```");
+    });
+
+    it("treats three backticks followed by more backticks as inline code", () => {
+      expect(protectMessageText("```not a fence``` here\nnext")).toBe(
+        "```not a fence``` here  \nnext",
+      );
+    });
+  });
+
+  describe("hard line breaks", () => {
+    it("turns a single newline into a hard break, and leaves blank lines", () => {
+      expect(protectMessageText("One.\nTwo.\n\nThree.")).toBe(
+        "One.  \nTwo.\n\nThree.",
+      );
+    });
+
+    it("adds none inside code, on indented lines, or after a backslash", () => {
+      expect(protectMessageText("```\na\nb\n```")).toBe("```\na\nb\n```");
+      expect(protectMessageText("    a\n    b")).toBe("    a\n    b");
+      expect(protectMessageText("\ta\n\tb")).toBe("\ta\n\tb");
+      expect(protectMessageText("a\\\nb")).toBe("a\\\nb");
+    });
+
+    it("replaces existing trailing whitespace instead of stacking on it", () => {
+      expect(protectMessageText("One. \t\nTwo.")).toBe("One.  \nTwo.");
+    });
+  });
+
+  describe("HTML blocks", () => {
+    it("escapes a line-leading < that could open an unterminated block", () => {
+      expect(protectMessageText("<!-- note")).toBe("\\<!-- note");
+      expect(protectMessageText("<script>alert(1)")).toBe("\\<script>alert(1)");
+      expect(protectMessageText("</div>")).toBe("\\</div>");
+      expect(protectMessageText("  <?php")).toBe("  \\<?php");
+    });
+
+    it("leaves < alone inside code, mid-line, and when it is not a tag", () => {
+      expect(protectMessageText("```html\n<script>\n```")).toBe(
+        "```html\n<script>\n```",
+      );
+      expect(protectMessageText("a < b and <b>bold</b>")).toBe(
+        "a < b and <b>bold</b>",
+      );
+      expect(protectMessageText("< 5 items")).toBe("< 5 items");
+    });
+  });
+
+  it("normalizes CRLF and drops trailing blank lines", () => {
+    expect(protectMessageText("One.\r\nTwo.\r\n\r\n")).toBe("One.  \nTwo.");
+  });
+
+  it("passes emoji and right-to-left text through untouched", () => {
+    const text = "שלום 👋 مرحبا";
+    expect(protectMessageText(text)).toBe(text);
+  });
+
+  it("returns an empty string for empty or whitespace-only text", () => {
+    expect(protectMessageText("")).toBe("");
+    expect(protectMessageText("  \n\n")).toBe("");
+  });
+});
diff --git a/widget/src/utils/exportConversation.ts b/widget/src/utils/exportConversation.ts
new file mode 100644
index 0000000..7bd52d6
--- /dev/null
+++ b/widget/src/utils/exportConversation.ts
@@ -0,0 +1,88 @@
+interface OpenFence {
+  indent: string;
+  char: string;
+  length: number;
+}
+
+const FENCE_OPEN = /^([ \t]*)(`{3,}|~{3,})(.*)$/;
+// A line-leading "<" that CommonMark could read as the start of an HTML block.
+const HTML_BLOCK_START = /^( {0,3})<(?=[A-Za-z!?/])/;
+const INDENTED = /^(?: {4}|\t)/;
+
+/**
+ * CommonMark fences, except that any indentation is accepted: models indent
+ * fences inside list items all the time and almost never write indented code.
+ */
+function parseFenceOpen(line: string): OpenFence | null {
+  const match = FENCE_OPEN.exec(line);
+  if (!match) return null;
+  const [, indent, run, info] = match;
+  // A backtick fence's info string cannot contain a backtick. Such a line is
+  // inline code that happens to start the line.
+  if (run[0] === "`" && info.includes("`")) return null;
+  return { indent, char: run[0], length: run.length };
+}
+
+/** A closer is the opener's character alone, at least as many times. */
+function closesFence(line: string, fence: OpenFence): boolean {
+  const trimmed = line.trim();
+  if (trimmed.length < fence.length) return false;
+  for (const ch of trimmed) {
+    if (ch !== fence.char) return false;
+  }
+  return true;
+}
+
+/**
+ * Prepare one message's text for a Markdown transcript. The text is kept as
+ * written, with protections that stop it damaging the rest of the file or
+ * rendering differently from how the widget showed it:
+ *
+ * - an unclosed code fence is closed, so a reply stopped inside a code block
+ *   does not swallow every later message;
+ * - a single newline becomes a hard line break, because the widget shows
+ *   every newline as a line break while Markdown treats it as a space;
+ * - a line-leading `<` is escaped, so an unterminated HTML block or comment
+ *   cannot hide what follows it;
+ * - line endings are normalized and trailing blank lines dropped.
+ *
+ * Text inside a fenced block is never modified.
+ */
+export function protectMessageText(text: string): string {
+  const lines = text.replace(/\r\n?/g, "\n").replace(/\s+$/, "").split("\n");
+  const out: string[] = [];
+  let fence: OpenFence | null = null;
+
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+
+    if (fence) {
+      out.push(line);
+      if (closesFence(line, fence)) fence = null;
+      continue;
+    }
+
+    const opened = parseFenceOpen(line);
+    if (opened) {
+      fence = opened;
+      out.push(line);
+      continue;
+    }
+
+    let result = line.replace(HTML_BLOCK_START, "$1\\<");
+    const next = lines[i + 1];
+    const breakable =
+      line.trim() !== "" &&
+      next !== undefined &&
+      next.trim() !== "" &&
+      // Possibly indented code, where trailing spaces would be content.
+      !INDENTED.test(line) &&
+      // Already a hard break.
+      !line.endsWith("\\");
+    if (breakable) result = result.replace(/[ \t]+$/, "") + "  ";
+    out.push(result);
+  }
+
+  if (fence) out.push(fence.indent + fence.char.repeat(fence.length));
+  return out.join("\n");
+}

From f012dc4a949f1c774e64c94ac41a45741923d4b8 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sat, 19 Sep 2026 12:45:21 -0400
Subject: [PATCH 06/28] feat(widget): Markdown and JSON conversation
 serializers

Markdown: one heading per message with role and localized time, attachments by name only, tool names, and citations as escaped links. JSON: the ChatMessage[] the widget persists, never with inline bytes. Dates are normalized because Node 20 and some browsers emit U+202F before AM/PM.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 .../__tests__/exportConversation.test.ts      | 315 +++++++++++++++++-
 widget/src/utils/exportConversation.ts        | 202 +++++++++++
 2 files changed, 515 insertions(+), 2 deletions(-)

diff --git a/widget/src/utils/__tests__/exportConversation.test.ts b/widget/src/utils/__tests__/exportConversation.test.ts
index 16d8ef1..ecbd083 100644
--- a/widget/src/utils/__tests__/exportConversation.test.ts
+++ b/widget/src/utils/__tests__/exportConversation.test.ts
@@ -1,5 +1,12 @@
-import { describe, it, expect } from "vitest";
-import { protectMessageText } from "../exportConversation";
+import { describe, it, expect, vi } from "vitest";
+import {
+  conversationToJson,
+  conversationToMarkdown,
+  exportFilename,
+  protectMessageText,
+  type TranscriptLabels,
+} from "../exportConversation";
+import type { ChatMessage } from "../../api/types";
 
 describe("protectMessageText", () => {
   describe("code fences", () => {
@@ -96,3 +103,307 @@ describe("protectMessageText", () => {
     expect(protectMessageText("  \n\n")).toBe("");
   });
 });
+
+const labels: TranscriptLabels = {
+  title: "Chat transcript",
+  exported: "Exported {date}",
+  user: "User",
+  assistant: "Assistant",
+  attachments: "Attachments:",
+  sources: "Sources:",
+  toolUsed: "Used tool:",
+};
+
+// Asia/Kolkata is a fixed +05:30 with no DST, so exact strings are stable
+// across ICU versions. 14:32 UTC is 8:02 PM there.
+const base = {
+  labels,
+  locale: "en-US",
+  timeZone: "Asia/Kolkata",
+  now: new Date("2026-09-19T14:32:00.000Z"),
+};
+const T = "2026-09-19T14:03:00.000Z";
+
+describe("conversationToMarkdown", () => {
+  it("writes a title, the export time, and one heading per message", () => {
+    const messages: ChatMessage[] = [
+      { id: "msg-1", role: "user", content: "Hi", createdAt: T },
+      { id: "msg-2", role: "assistant", content: "Hello!", createdAt: T },
+    ];
+    expect(conversationToMarkdown(messages, base)).toBe(
+      [
+        "# Chat transcript",
+        "",
+        "Exported Sep 19, 2026, 8:02 PM (GMT+05:30)",
+        "",
+        "## User · Sep 19, 2026, 7:33 PM",
+        "",
+        "Hi",
+        "",
+        "## Assistant · Sep 19, 2026, 7:33 PM",
+        "",
+        "Hello!",
+        "",
+      ].join("\n"),
+    );
+  });
+
+  it("formats dates in the given locale", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: "Hallo", createdAt: T }],
+      { ...base, locale: "de-DE" },
+    );
+    expect(md).toContain("## User · 19.09.2026, 19:33");
+  });
+
+  it("falls back to the default locale when the tag is invalid", () => {
+    expect(() =>
+      conversationToMarkdown(
+        [{ id: "1", role: "user", content: "Hi", createdAt: T }],
+        { ...base, locale: "not a locale!" },
+      ),
+    ).not.toThrow();
+  });
+
+  it("replaces the no-break spaces some engines put in dates", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: "Hi", createdAt: T }],
+      { ...base, formatDate: () => "2:03\u202fPM\u00a0IST" },
+    );
+    expect(md).toContain("## User · 2:03 PM IST");
+    expect(md).not.toMatch(/[\u00a0\u202f]/);
+  });
+
+  it("omits the offset where longOffset is unsupported", () => {
+    const Real = Intl.DateTimeFormat;
+    // A regular function, not an arrow: it is called with `new`.
+    const spy = vi.spyOn(Intl, "DateTimeFormat").mockImplementation(function (
+      locale?: string | string[],
+      options?: Intl.DateTimeFormatOptions,
+    ) {
+      if (options?.timeZoneName) throw new RangeError("unsupported");
+      return new Real(locale, options);
+    } as unknown as typeof Intl.DateTimeFormat);
+
+    const md = conversationToMarkdown([], base);
+    spy.mockRestore();
+
+    expect(md).toBe("# Chat transcript\n\nExported Sep 19, 2026, 8:02 PM\n");
+  });
+
+  it("shows the role alone when a message has no usable time", () => {
+    const md = conversationToMarkdown(
+      [
+        { id: "1", role: "user", content: "old" },
+        { id: "2", role: "assistant", content: "bad", createdAt: "nonsense" },
+      ],
+      base,
+    );
+    expect(md).toContain("## User\n\nold");
+    expect(md).toContain("## Assistant\n\nbad");
+  });
+
+  it("applies the text protections to each message", () => {
+    const md = conversationToMarkdown(
+      [
+        { id: "1", role: "assistant", content: "```js\nconst a = 1;" },
+        { id: "2", role: "user", content: "Thanks.\nBye." },
+      ],
+      base,
+    );
+    expect(md).toContain("```js\nconst a = 1;\n```\n\n## User");
+    expect(md).toContain("Thanks.  \nBye.");
+  });
+
+  it("lists attachments by name, type, and size, and never their bytes", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "user",
+          content: "",
+          attachments: [
+            {
+              id: "att-1",
+              name: "_draft_*final*.png",
+              mediaType: "image/png",
+              size: 49152,
+              data: "QUJDREVGRw==",
+              url: "https://files.example.com/att/1?sig=secret",
+            },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "## User\n\nAttachments:\n\n- `_draft_*final*.png` (image/png, 48 KB)",
+    );
+    expect(md).not.toContain("QUJDREVGRw==");
+    expect(md).not.toContain("sig=secret");
+  });
+
+  it("sizes a code span to the backticks inside the name", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "user",
+          content: "",
+          attachments: [
+            {
+              id: "a",
+              name: "we`ird``.pdf",
+              mediaType: "application/pdf",
+              size: 10,
+            },
+            { id: "b", name: "`edge`", mediaType: "application/pdf", size: 10 },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("- ```we`ird``.pdf``` (application/pdf, 10 B)");
+    expect(md).toContain("- `` `edge` `` (application/pdf, 10 B)");
+  });
+
+  it("names the tools a reply used, without their inputs or results", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "It is noon.",
+          toolUses: [
+            { name: "get_current_time", input: { tz: "UTC" }, result: "12:00" },
+            { name: "search_knowledge_base" },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "Used tool: `get_current_time`  \nUsed tool: `search_knowledge_base`",
+    );
+    expect(md).not.toContain("12:00");
+  });
+
+  it("writes citations as a numbered list of escaped links", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "See these.",
+          sources: [
+            {
+              title: "Parsing [JSON]\nguide \\ notes",
+              url: "https://example.com/json_(format)?q=a b&x=<y>",
+              type: "page",
+            },
+            {
+              title: "MDN",
+              url: "https://developer.mozilla.org/",
+              type: "external",
+            },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain(
+      "Sources:\n\n" +
+        "1. [Parsing \\[JSON\\] guide \\\\ notes](https://example.com/json_%28format%29?q=a%20b&x=%3Cy%3E)\n" +
+        "2. [MDN](https://developer.mozilla.org/)",
+    );
+  });
+
+  it("drops the link, not the citation, when a URL is not http(s)", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "x",
+          sources: [
+            { title: "Click me", url: "javascript:alert(1)", type: "external" },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("1. Click me");
+    expect(md).not.toContain("javascript:");
+  });
+
+  it("exports an empty conversation as the header alone", () => {
+    expect(conversationToMarkdown([], base)).toBe(
+      "# Chat transcript\n\nExported Sep 19, 2026, 8:02 PM (GMT+05:30)\n",
+    );
+  });
+});
+
+describe("conversationToJson", () => {
+  const messages: ChatMessage[] = [
+    {
+      id: "msg-1",
+      role: "user",
+      content: 'Quote " slash \\ emoji 👋 separator 
 end',
+      createdAt: T,
+      attachments: [
+        {
+          id: "att-1",
+          name: "a.png",
+          mediaType: "image/png",
+          size: 3,
+          data: "QUJD",
+        },
+      ],
+    },
+    {
+      id: "msg-2",
+      role: "assistant",
+      content: "Hello!",
+      createdAt: T,
+      sources: [{ title: "Docs", url: "https://example.com", type: "page" }],
+    },
+  ];
+
+  it("is the message array itself, pretty-printed, ending in a newline", () => {
+    const json = conversationToJson(messages);
+    expect(json.endsWith("\n")).toBe(true);
+    expect(json).toContain('\n  {\n    "id": "msg-1"');
+    const parsed = JSON.parse(json);
+    expect(Array.isArray(parsed)).toBe(true);
+    expect(parsed[0].content).toBe(messages[0].content);
+    expect(parsed[1]).toEqual(messages[1]);
+  });
+
+  it("never includes inline attachment bytes", () => {
+    const json = conversationToJson(messages);
+    expect(json).not.toContain("QUJD");
+    expect(JSON.parse(json)[0].attachments[0]).toEqual({
+      id: "att-1",
+      name: "a.png",
+      mediaType: "image/png",
+      size: 3,
+    });
+  });
+
+  it("does not modify the messages it was given", () => {
+    conversationToJson(messages);
+    expect(messages[0].attachments?.[0].data).toBe("QUJD");
+  });
+});
+
+describe("exportFilename", () => {
+  it("uses the visitor's local date, not the UTC date", () => {
+    const now = new Date("2026-09-19T14:03:00.000Z");
+    expect(exportFilename("md", { now, timeZone: "Pacific/Auckland" })).toBe(
+      "chat-transcript-2026-09-20.md",
+    );
+    expect(
+      exportFilename("json", { now, timeZone: "America/Los_Angeles" }),
+    ).toBe("chat-transcript-2026-09-19.json");
+  });
+});
diff --git a/widget/src/utils/exportConversation.ts b/widget/src/utils/exportConversation.ts
index 7bd52d6..a751ef2 100644
--- a/widget/src/utils/exportConversation.ts
+++ b/widget/src/utils/exportConversation.ts
@@ -1,3 +1,35 @@
+import type { ChatAttachment, ChatMessage, Source } from "../api/types";
+import { formatBytes, stripAttachmentData } from "./attachments";
+import { interpolate } from "./interpolate";
+import { sanitizeUrl } from "./sanitize";
+
+/**
+ * The strings a transcript is written with. `attachments`, `sources`, and
+ * `toolUsed` carry their own colon, because French puts a space before it.
+ */
+export interface TranscriptLabels {
+  title: string;
+  /** Takes `{date}`. */
+  exported: string;
+  user: string;
+  assistant: string;
+  attachments: string;
+  sources: string;
+  toolUsed: string;
+}
+
+export interface MarkdownExportOptions {
+  labels: TranscriptLabels;
+  /** BCP-47 tag for dates. An invalid tag falls back to the browser default. */
+  locale?: string;
+  /** IANA zone. Defaults to the visitor's. */
+  timeZone?: string;
+  /** The export time. Defaults to now. */
+  now?: Date;
+  /** Replaces the built-in date formatting. The result is still normalized. */
+  formatDate?: (date: Date) => string;
+}
+
 interface OpenFence {
   indent: string;
   char: string;
@@ -86,3 +118,173 @@ export function protectMessageText(text: string): string {
   if (fence) out.push(fence.indent + fence.char.repeat(fence.length));
   return out.join("\n");
 }
+
+// Some engines separate the time from AM/PM with U+202F. It looks like a
+// space but breaks string comparison and some plain-text tools.
+const NO_BREAK_SPACES = /[\u00a0\u202f]/g;
+
+function makeDateFormatter(
+  options: MarkdownExportOptions,
+): (date: Date) => string {
+  const custom = options.formatDate;
+  if (custom) return (date) => custom(date).replace(NO_BREAK_SPACES, " ");
+
+  const build = (locale?: string) =>
+    new Intl.DateTimeFormat(locale, {
+      dateStyle: "medium",
+      timeStyle: "short",
+      timeZone: options.timeZone,
+    });
+  let formatter: Intl.DateTimeFormat;
+  try {
+    formatter = build(options.locale);
+  } catch {
+    formatter = build(undefined);
+  }
+  return (date) => formatter.format(date).replace(NO_BREAK_SPACES, " ");
+}
+
+/**
+ * "GMT+01:00" for the zone at that moment. A second formatter is needed
+ * because `timeZoneName` cannot be combined with `dateStyle`/`timeStyle`. An
+ * offset tells a reader in another zone what they need; an IANA name would
+ * also disclose roughly where the visitor is.
+ */
+function utcOffset(date: Date, timeZone?: string): string {
+  try {
+    const parts = new Intl.DateTimeFormat("en", {
+      timeZone,
+      timeZoneName: "longOffset",
+    }).formatToParts(date);
+    return parts.find((part) => part.type === "timeZoneName")?.value ?? "";
+  } catch {
+    return "";
+  }
+}
+
+/**
+ * A code span whose delimiter is one backtick longer than the longest run
+ * inside it, so nothing in the text needs escaping.
+ */
+function codeSpan(text: string): string {
+  const clean = text.replace(/\s+/g, " ").trim();
+  if (clean === "") return "";
+  const longest = Math.max(
+    0,
+    ...(clean.match(/`+/g) ?? []).map((run) => run.length),
+  );
+  const ticks = "`".repeat(longest + 1);
+  const pad = clean.startsWith("`") || clean.endsWith("`") ? " " : "";
+  return `${ticks}${pad}${clean}${pad}${ticks}`;
+}
+
+const URL_ESCAPES: Record<string, string> = {
+  "(": "%28",
+  ")": "%29",
+  "<": "%3C",
+  ">": "%3E",
+};
+
+function sourceLine(source: Source, index: number): string {
+  // The title must not close the link text or span lines.
+  const title = (source.title || source.url)
+    .replace(/\s+/g, " ")
+    .trim()
+    .replace(/[\\[\]]/g, "\\$&");
+  const safe = sanitizeUrl(source.url);
+  if (!safe) return `${index + 1}. ${title}`;
+  // Nor may the URL end the link destination.
+  const url = safe
+    .replace(/[()<>]/g, (ch) => URL_ESCAPES[ch])
+    .replace(/\s/g, "%20");
+  return `${index + 1}. [${title}](${url})`;
+}
+
+function attachmentLine(attachment: ChatAttachment): string {
+  return `- ${codeSpan(attachment.name)} (${attachment.mediaType}, ${formatBytes(attachment.size)})`;
+}
+
+/**
+ * The conversation as a Markdown transcript: a title, the export time, then
+ * one `##` heading per message with its text, attachments, tools, and
+ * citations. Never throws on message content.
+ */
+export function conversationToMarkdown(
+  messages: readonly ChatMessage[],
+  options: MarkdownExportOptions,
+): string {
+  const { labels } = options;
+  const formatDate = makeDateFormatter(options);
+  const now = options.now ?? new Date();
+  const offset = utcOffset(now, options.timeZone);
+  const exportedAt = formatDate(now) + (offset ? ` (${offset})` : "");
+
+  const blocks: string[] = [
+    `# ${labels.title}`,
+    interpolate(labels.exported, { date: exportedAt }),
+  ];
+
+  for (const message of messages) {
+    const role = message.role === "user" ? labels.user : labels.assistant;
+    const created = message.createdAt ? new Date(message.createdAt) : null;
+    const time =
+      created && !Number.isNaN(created.getTime())
+        ? ` · ${formatDate(created)}`
+        : "";
+    blocks.push(`## ${role}${time}`);
+
+    const text = protectMessageText(message.content ?? "");
+    if (text) blocks.push(text);
+
+    if (message.attachments?.length) {
+      blocks.push(
+        labels.attachments,
+        message.attachments.map(attachmentLine).join("\n"),
+      );
+    }
+    if (message.toolUses?.length) {
+      blocks.push(
+        message.toolUses
+          .map((toolUse) => `${labels.toolUsed} ${codeSpan(toolUse.name)}`)
+          .join("  \n"),
+      );
+    }
+    if (message.sources?.length) {
+      blocks.push(labels.sources, message.sources.map(sourceLine).join("\n"));
+    }
+  }
+
+  return blocks.join("\n\n") + "\n";
+}
+
+/**
+ * The conversation as JSON: the `ChatMessage[]` the widget persists, which
+ * means without inline attachment bytes.
+ */
+export function conversationToJson(messages: readonly ChatMessage[]): string {
+  return JSON.stringify(stripAttachmentData([...messages]), null, 2) + "\n";
+}
+
+/** `chat-transcript-YYYY-MM-DD.<extension>`, by the visitor's local date. */
+export function exportFilename(
+  extension: "md" | "json",
+  options: { now?: Date; timeZone?: string } = {},
+): string {
+  const now = options.now ?? new Date();
+  let stamp: string;
+  try {
+    // Assembled from parts so it does not depend on any locale's pattern.
+    const parts = new Intl.DateTimeFormat("en", {
+      timeZone: options.timeZone,
+      year: "numeric",
+      month: "2-digit",
+      day: "2-digit",
+    }).formatToParts(now);
+    const get = (type: string) =>
+      parts.find((part) => part.type === type)?.value ?? "";
+    stamp = `${get("year")}-${get("month")}-${get("day")}`;
+  } catch {
+    stamp = now.toISOString().slice(0, 10);
+  }
+  return `chat-transcript-${stamp}.${extension}`;
+}

From e001999adf2d6d8bb650782e8e5625f3d31c7a5b Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 00:59:22 -0400
Subject: [PATCH 07/28] fix(widget): keep code intact when a message ends
 inside an open fence

The whole-text trim (replacing /\s+$/ before fence tracking) was stripping trailing spaces and blank lines even when they fell inside an unclosed code block. This violated the invariant that content inside a fence is never modified.

Fixed by: normalizing line endings only during initial split, handling fence-closing content after the line loop (distinguish between still-open fences, which keep all interior content intact, vs closed fences, which trim trailing blank lines and spaces only outside code).

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 .../__tests__/exportConversation.test.ts      | 17 ++++++++++++++-
 widget/src/utils/exportConversation.ts        | 21 ++++++++++++++++---
 2 files changed, 34 insertions(+), 4 deletions(-)

diff --git a/widget/src/utils/__tests__/exportConversation.test.ts b/widget/src/utils/__tests__/exportConversation.test.ts
index ecbd083..23c0031 100644
--- a/widget/src/utils/__tests__/exportConversation.test.ts
+++ b/widget/src/utils/__tests__/exportConversation.test.ts
@@ -49,6 +49,21 @@ describe("protectMessageText", () => {
         "```not a fence``` here  \nnext",
       );
     });
+
+    it("leaves trailing spaces alone inside a fence that was never closed", () => {
+      expect(protectMessageText("```js\nconst a = 1;   ")).toBe(
+        "```js\nconst a = 1;   \n```",
+      );
+    });
+
+    it("keeps blank lines inside a fence that was never closed, minus the final line terminator", () => {
+      expect(protectMessageText("```js\nconst a = 1;\n\n\n")).toBe(
+        "```js\nconst a = 1;\n\n\n```",
+      );
+      expect(protectMessageText("```js\nconst a = 1;\n")).toBe(
+        "```js\nconst a = 1;\n```",
+      );
+    });
   });
 
   describe("hard line breaks", () => {
@@ -348,7 +363,7 @@ describe("conversationToJson", () => {
     {
       id: "msg-1",
       role: "user",
-      content: 'Quote " slash \\ emoji 👋 separator 
 end',
+      content: 'Quote " slash \\ emoji 👋 separator \u2028 end',
       createdAt: T,
       attachments: [
         {
diff --git a/widget/src/utils/exportConversation.ts b/widget/src/utils/exportConversation.ts
index a751ef2..20d882d 100644
--- a/widget/src/utils/exportConversation.ts
+++ b/widget/src/utils/exportConversation.ts
@@ -76,12 +76,13 @@ function closesFence(line: string, fence: OpenFence): boolean {
  *   every newline as a line break while Markdown treats it as a space;
  * - a line-leading `<` is escaped, so an unterminated HTML block or comment
  *   cannot hide what follows it;
- * - line endings are normalized and trailing blank lines dropped.
+ * - line endings are normalized, and trailing blank lines are dropped unless
+ *   the text ends inside an open code block, whose content is left alone.
  *
  * Text inside a fenced block is never modified.
  */
 export function protectMessageText(text: string): string {
-  const lines = text.replace(/\r\n?/g, "\n").replace(/\s+$/, "").split("\n");
+  const lines = text.replace(/\r\n?/g, "\n").split("\n");
   const out: string[] = [];
   let fence: OpenFence | null = null;
 
@@ -115,7 +116,21 @@ export function protectMessageText(text: string): string {
     out.push(result);
   }
 
-  if (fence) out.push(fence.indent + fence.char.repeat(fence.length));
+  if (fence) {
+    // The text ended inside the block. A final line terminator leaves one empty
+    // string at the end of the split array. That empty string is not a blank
+    // line of code, so drop it if present; everything else inside the block
+    // stays untouched.
+    if (out[out.length - 1] === "") out.pop();
+    out.push(fence.indent + fence.char.repeat(fence.length));
+  } else {
+    // Pop trailing blank lines, then trim trailing spaces from the new last line.
+    while (out.length > 0 && out[out.length - 1].trim() === "") out.pop();
+    if (out.length > 0) {
+      out[out.length - 1] = out[out.length - 1].replace(/[ \t]+$/, "");
+    }
+  }
+
   return out.join("\n");
 }
 

From 88cd14736f9d7387317b194cf97cbd1aff4459e0 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:07:48 -0400
Subject: [PATCH 08/28] docs(plans): trailing-blank-line trimming applies only
 outside code

Task review found that the plan's protectMessageText trimmed the whole text before it knew where the fences were, so a reply stopped inside a code block lost trailing spaces and blank lines from that code. The design's invariant that code in a fence is never modified wins. The design now says so explicitly, and the plan's code and tests match the fix in e001999.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 .../2026-09-19-conversation-export-design.md  |  9 +++-
 ...9-19-conversation-export-implementation.md | 43 ++++++++++++++++---
 2 files changed, 44 insertions(+), 8 deletions(-)

diff --git a/docs/plans/2026-09-19-conversation-export-design.md b/docs/plans/2026-09-19-conversation-export-design.md
index 106fbb6..4ad5668 100644
--- a/docs/plans/2026-09-19-conversation-export-design.md
+++ b/docs/plans/2026-09-19-conversation-export-design.md
@@ -248,10 +248,15 @@ rendered file match what the visitor saw.
    comments entirely. The widget shows such text literally, so the escaped
    form is also the more faithful one. Inline HTML later in a line is left
    alone: it cannot extend past its own paragraph.
-4. **Line endings are normalized** to `\n`, and trailing blank lines dropped.
+4. **Line endings are normalized** to `\n`, and trailing blank lines dropped,
+   unless the text ends inside an open code block. There the trailing lines
+   are code, so they are left alone and only the block is closed.
 
 Code inside a fence is never modified: no hard breaks, no escaping, no
-trimming. That is what makes "long code blocks" safe.
+trimming. That is what makes "long code blocks" safe. It holds for a fence
+that was never closed too, which is why protection 4 cannot simply trim the
+whole text before looking for fences: the first implementation did, and lost
+trailing spaces and blank lines from the code of a stopped reply.
 
 ### Citations, filenames, and tool names
 
diff --git a/docs/plans/2026-09-19-conversation-export-implementation.md b/docs/plans/2026-09-19-conversation-export-implementation.md
index 14956d4..73637f1 100644
--- a/docs/plans/2026-09-19-conversation-export-implementation.md
+++ b/docs/plans/2026-09-19-conversation-export-implementation.md
@@ -426,6 +426,21 @@ describe("protectMessageText", () => {
         "```not a fence``` here  \nnext",
       );
     });
+
+    it("leaves trailing spaces alone inside a fence that was never closed", () => {
+      expect(protectMessageText("```js\nconst a = 1;   ")).toBe(
+        "```js\nconst a = 1;   \n```",
+      );
+    });
+
+    it("keeps blank lines inside a fence that was never closed, minus the final line terminator", () => {
+      expect(protectMessageText("```js\nconst a = 1;\n\n\n")).toBe(
+        "```js\nconst a = 1;\n\n\n```",
+      );
+      expect(protectMessageText("```js\nconst a = 1;\n")).toBe(
+        "```js\nconst a = 1;\n```",
+      );
+    });
   });
 
   describe("hard line breaks", () => {
@@ -538,12 +553,15 @@ function closesFence(line: string, fence: OpenFence): boolean {
  *   every newline as a line break while Markdown treats it as a space;
  * - a line-leading `<` is escaped, so an unterminated HTML block or comment
  *   cannot hide what follows it;
- * - line endings are normalized and trailing blank lines dropped.
+ * - line endings are normalized, and trailing blank lines are dropped unless
+ *   the text ends inside an open code block, whose content is left alone.
  *
  * Text inside a fenced block is never modified.
  */
 export function protectMessageText(text: string): string {
-  const lines = text.replace(/\r\n?/g, "\n").replace(/\s+$/, "").split("\n");
+  // Line endings only. Trimming the whole text here, before the fences are
+  // known, would strip whitespace from the code of a reply stopped mid-block.
+  const lines = text.replace(/\r\n?/g, "\n").split("\n");
   const out: string[] = [];
   let fence: OpenFence | null = null;
 
@@ -577,7 +595,20 @@ export function protectMessageText(text: string): string {
     out.push(result);
   }
 
-  if (fence) out.push(fence.indent + fence.char.repeat(fence.length));
+  if (fence) {
+    // The text ended inside the block. A final line terminator leaves one
+    // empty string at the end of the split array. That is not a blank line of
+    // code, so drop it if present; everything else in the block stays.
+    if (out[out.length - 1] === "") out.pop();
+    out.push(fence.indent + fence.char.repeat(fence.length));
+  } else {
+    // Pop trailing blank lines, then trim the new last line.
+    while (out.length > 0 && out[out.length - 1].trim() === "") out.pop();
+    if (out.length > 0) {
+      out[out.length - 1] = out[out.length - 1].replace(/[ \t]+$/, "");
+    }
+  }
+
   return out.join("\n");
 }
 ```
@@ -585,7 +616,7 @@ export function protectMessageText(text: string): string {
 - [ ] **Step 4: Run and confirm it passes**
 
 Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
-Expected: 15 passed.
+Expected: 17 passed.
 
 - [ ] **Step 5: Commit**
 
@@ -930,7 +961,7 @@ describe("exportFilename", () => {
 - [ ] **Step 2: Run and confirm failure**
 
 Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
-Expected: FAIL. `conversationToMarkdown` is not exported. The 15 `protectMessageText` tests still pass.
+Expected: FAIL. `conversationToMarkdown` is not exported. The 17 `protectMessageText` tests still pass.
 
 - [ ] **Step 3: Implement**
 
@@ -1147,7 +1178,7 @@ export function exportFilename(
 - [ ] **Step 4: Run and confirm it passes**
 
 Run: `./node_modules/.bin/vitest run src/utils/__tests__/exportConversation.test.ts`
-Expected: 32 passed (15 from Task 2, 17 new).
+Expected: 34 passed (17 from Task 2, 17 new).
 
 Run: `./node_modules/.bin/tsc --noEmit`
 Expected: exit 0.

From c64b4531c0881b4f476c8651fcf6118230ea8e82 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:09:04 -0400
Subject: [PATCH 09/28] feat(widget): clipboard and download helpers

copyText calls the async clipboard API before yielding so the click's user activation still holds, and falls back to execCommand on insecure origins and in iframes without clipboard-write. It resolves to a boolean and never rejects.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 widget/src/utils/__tests__/saveText.test.ts | 127 ++++++++++++++++++++
 widget/src/utils/saveText.ts                |  70 +++++++++++
 2 files changed, 197 insertions(+)
 create mode 100644 widget/src/utils/__tests__/saveText.test.ts
 create mode 100644 widget/src/utils/saveText.ts

diff --git a/widget/src/utils/__tests__/saveText.test.ts b/widget/src/utils/__tests__/saveText.test.ts
new file mode 100644
index 0000000..bd62445
--- /dev/null
+++ b/widget/src/utils/__tests__/saveText.test.ts
@@ -0,0 +1,127 @@
+import { describe, it, expect, vi, afterEach } from "vitest";
+import { copyText, downloadTextFile } from "../saveText";
+
+type Doc = Document & { execCommand?: (command: string) => boolean };
+
+function setClipboard(value: unknown) {
+  Object.defineProperty(navigator, "clipboard", { value, configurable: true });
+}
+
+/** jsdom's Blob has no text(), so read it the long way. */
+function readBlob(blob: Blob): Promise<string> {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onload = () => resolve(reader.result as string);
+    reader.onerror = () => reject(reader.error);
+    reader.readAsText(blob);
+  });
+}
+
+afterEach(() => {
+  setClipboard(undefined);
+  delete (document as Doc).execCommand;
+  document.body.innerHTML = "";
+  vi.restoreAllMocks();
+  vi.useRealTimers();
+});
+
+describe("copyText", () => {
+  it("uses the async clipboard API", async () => {
+    const writeText = vi.fn().mockResolvedValue(undefined);
+    setClipboard({ writeText });
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect(writeText).toHaveBeenCalledWith("hello");
+  });
+
+  it("calls writeText before yielding, inside the caller's user activation", () => {
+    const writeText = vi.fn().mockResolvedValue(undefined);
+    setClipboard({ writeText });
+
+    void copyText("hello");
+
+    expect(writeText).toHaveBeenCalledTimes(1);
+  });
+
+  it("falls back to execCommand when the API refuses", async () => {
+    setClipboard({
+      writeText: vi
+        .fn()
+        .mockRejectedValue(new DOMException("no", "NotAllowedError")),
+    });
+    let copied = "";
+    (document as Doc).execCommand = vi.fn(() => {
+      copied = (document.activeElement as HTMLTextAreaElement).value;
+      return true;
+    });
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect(copied).toBe("hello");
+    expect(document.querySelector("textarea")).toBeNull();
+  });
+
+  it("falls back when there is no clipboard API, as on an insecure origin", async () => {
+    (document as Doc).execCommand = vi.fn(() => true);
+
+    await expect(copyText("hello")).resolves.toBe(true);
+    expect((document as Doc).execCommand).toHaveBeenCalledWith("copy");
+  });
+
+  it("resolves false, never rejects, when both paths fail", async () => {
+    setClipboard({ writeText: vi.fn().mockRejectedValue(new Error("no")) });
+    (document as Doc).execCommand = vi.fn(() => {
+      throw new Error("blocked");
+    });
+
+    await expect(copyText("hello")).resolves.toBe(false);
+  });
+
+  it("returns focus to where it was after the fallback", async () => {
+    const button = document.createElement("button");
+    document.body.appendChild(button);
+    button.focus();
+    (document as Doc).execCommand = vi.fn(() => true);
+
+    await copyText("hello");
+
+    expect(document.activeElement).toBe(button);
+  });
+});
+
+describe("downloadTextFile", () => {
+  it("clicks a temporary download link to a Blob of the text", async () => {
+    let blob: Blob | undefined;
+    URL.createObjectURL = vi.fn((b: Blob) => {
+      blob = b;
+      return "blob:claudius-test";
+    });
+    URL.revokeObjectURL = vi.fn();
+    // Mocked so jsdom does not try to navigate. `contexts` holds each call's
+    // `this`, which is the link that was clicked.
+    const click = vi
+      .spyOn(HTMLAnchorElement.prototype, "click")
+      .mockImplementation(() => {});
+
+    downloadTextFile("chat.md", "# Hi", "text/markdown;charset=utf-8");
+
+    const clicked = click.mock.contexts[0] as HTMLAnchorElement;
+    expect(clicked.download).toBe("chat.md");
+    expect(clicked.href).toBe("blob:claudius-test");
+    expect(blob?.type).toBe("text/markdown;charset=utf-8");
+    await expect(readBlob(blob as Blob)).resolves.toBe("# Hi");
+    expect(document.querySelector("a")).toBeNull();
+  });
+
+  it("revokes the object URL later, not before the download starts", () => {
+    vi.useFakeTimers();
+    URL.createObjectURL = vi.fn(() => "blob:claudius-test");
+    URL.revokeObjectURL = vi.fn();
+    vi.spyOn(HTMLAnchorElement.prototype, "click").mockImplementation(() => {});
+
+    downloadTextFile("chat.json", "[]", "application/json");
+
+    expect(URL.revokeObjectURL).not.toHaveBeenCalled();
+    vi.advanceTimersByTime(40_000);
+    expect(URL.revokeObjectURL).toHaveBeenCalledWith("blob:claudius-test");
+  });
+});
diff --git a/widget/src/utils/saveText.ts b/widget/src/utils/saveText.ts
new file mode 100644
index 0000000..380697a
--- /dev/null
+++ b/widget/src/utils/saveText.ts
@@ -0,0 +1,70 @@
+/** Copy through a hidden textarea, for where the async API is unavailable. */
+function legacyCopy(text: string): boolean {
+  const previous = document.activeElement as HTMLElement | null;
+  const area = document.createElement("textarea");
+  area.value = text;
+  area.setAttribute("readonly", "");
+  area.setAttribute("aria-hidden", "true");
+  area.style.position = "fixed";
+  area.style.top = "0";
+  area.style.left = "0";
+  area.style.opacity = "0";
+  document.body.appendChild(area);
+  // select() alone does not focus the field everywhere (iOS Safari), and the
+  // copy command acts on the focused element's selection.
+  area.focus({ preventScroll: true });
+  area.select();
+  let ok = false;
+  try {
+    ok = document.execCommand("copy");
+  } catch {
+    ok = false;
+  }
+  area.remove();
+  previous?.focus();
+  return ok;
+}
+
+/**
+ * Copy text to the clipboard. Resolves to whether it worked and never
+ * rejects.
+ *
+ * Call it synchronously from a click handler: `writeText` runs before the
+ * first `await`, while the transient activation Firefox and Safari require is
+ * still present. The async API is missing on insecure origins and refuses in
+ * an iframe without `clipboard-write`, so both cases fall back to
+ * `execCommand`.
+ */
+export async function copyText(text: string): Promise<boolean> {
+  try {
+    if (navigator.clipboard?.writeText) {
+      await navigator.clipboard.writeText(text);
+      return true;
+    }
+  } catch {
+    // Refused. Try the legacy path.
+  }
+  return legacyCopy(text);
+}
+
+// Revoking straight away cancels the download in some browsers. FileSaver.js
+// settled on 40 seconds, and a pending timer costs nothing.
+const REVOKE_AFTER_MS = 40_000;
+
+/** Save text as a file through a temporary `<a download>`. */
+export function downloadTextFile(
+  filename: string,
+  text: string,
+  mimeType: string,
+): void {
+  // No byte-order mark: it is invalid in JSON and breaks some Markdown tools.
+  const url = URL.createObjectURL(new Blob([text], { type: mimeType }));
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = filename;
+  link.style.display = "none";
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  setTimeout(() => URL.revokeObjectURL(url), REVOKE_AFTER_MS);
+}

From 95bb6c6af1a66ed0c0cee6458a2dee383517af21 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:16:16 -0400
Subject: [PATCH 10/28] feat(widget): conversation export strings in en, es,
 fr, de

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 widget/src/i18n.ts       | 24 ++++++++++++++++++++++++
 widget/src/locales/de.ts | 15 +++++++++++++++
 widget/src/locales/en.ts | 14 ++++++++++++++
 widget/src/locales/es.ts | 14 ++++++++++++++
 widget/src/locales/fr.ts | 14 ++++++++++++++
 5 files changed, 81 insertions(+)

diff --git a/widget/src/i18n.ts b/widget/src/i18n.ts
index bf67061..3e5aa93 100644
--- a/widget/src/i18n.ts
+++ b/widget/src/i18n.ts
@@ -74,6 +74,30 @@ export interface ClaudiusTranslations {
   resumeReading: string;
   /** Accessible label for stopping read-aloud playback. */
   stopReading: string;
+  /** Accessible label for the header's overflow menu button. */
+  moreOptions: string;
+  /** Menu item that copies the conversation to the clipboard as Markdown. */
+  copyAsMarkdown: string;
+  /** Menu item that downloads the conversation as a Markdown file. */
+  downloadAsMarkdown: string;
+  /** Menu item that downloads the conversation as a JSON file. */
+  downloadAsJson: string;
+  /** Status shown after the conversation was copied. */
+  copiedToClipboard: string;
+  /** Status shown when the conversation could not be copied. */
+  copyFailed: string;
+  /** Title of an exported transcript. */
+  transcriptTitle: string;
+  /** Line under the transcript title; supports `{date}`. */
+  transcriptExported: string;
+  /** Transcript heading for a visitor message. */
+  transcriptUser: string;
+  /** Transcript heading for an assistant message. */
+  transcriptAssistant: string;
+  /** Transcript label above a message's attachment list, including its colon. */
+  transcriptAttachments: string;
+  /** Transcript label above a message's citation list, including its colon. */
+  transcriptSources: string;
   /** Generic fallback error message. */
   errorGeneric: string;
   /** Error shown when the network request fails. */
diff --git a/widget/src/locales/de.ts b/widget/src/locales/de.ts
index a09e2f2..c50e9c6 100644
--- a/widget/src/locales/de.ts
+++ b/widget/src/locales/de.ts
@@ -47,6 +47,21 @@ export const de: ClaudiusTranslations = {
   resumeReading: "Vorlesen fortsetzen",
   stopReading: "Vorlesen beenden",
 
+  // Conversation export
+  moreOptions: "Weitere Optionen",
+  copyAsMarkdown: "Als Markdown kopieren",
+  downloadAsMarkdown: "Als Markdown herunterladen",
+  downloadAsJson: "Als JSON herunterladen",
+  copiedToClipboard: "In die Zwischenablage kopiert",
+  copyFailed:
+    "Kopieren nicht möglich. Laden Sie die Unterhaltung stattdessen herunter.",
+  transcriptTitle: "Chat-Protokoll",
+  transcriptExported: "Exportiert am {date}",
+  transcriptUser: "Nutzer",
+  transcriptAssistant: "Assistent",
+  transcriptAttachments: "Anhänge:",
+  transcriptSources: "Quellen:",
+
   // Errors
   errorGeneric: "Etwas ist schiefgelaufen. Bitte versuchen Sie es erneut.",
   errorConnection: "Verbindung fehlgeschlagen. Bitte versuchen Sie es erneut.",
diff --git a/widget/src/locales/en.ts b/widget/src/locales/en.ts
index a18153f..015d528 100644
--- a/widget/src/locales/en.ts
+++ b/widget/src/locales/en.ts
@@ -46,6 +46,20 @@ export const en: ClaudiusTranslations = {
   resumeReading: "Resume reading",
   stopReading: "Stop reading",
 
+  // Conversation export
+  moreOptions: "More options",
+  copyAsMarkdown: "Copy as Markdown",
+  downloadAsMarkdown: "Download as Markdown",
+  downloadAsJson: "Download as JSON",
+  copiedToClipboard: "Copied to clipboard",
+  copyFailed: "Could not copy. Try downloading instead.",
+  transcriptTitle: "Chat transcript",
+  transcriptExported: "Exported {date}",
+  transcriptUser: "User",
+  transcriptAssistant: "Assistant",
+  transcriptAttachments: "Attachments:",
+  transcriptSources: "Sources:",
+
   // Errors
   errorGeneric: "Something went wrong. Please try again.",
   errorConnection: "Failed to connect. Please try again.",
diff --git a/widget/src/locales/es.ts b/widget/src/locales/es.ts
index 480c28d..8df5f25 100644
--- a/widget/src/locales/es.ts
+++ b/widget/src/locales/es.ts
@@ -46,6 +46,20 @@ export const es: ClaudiusTranslations = {
   resumeReading: "Reanudar la lectura",
   stopReading: "Detener la lectura",
 
+  // Conversation export
+  moreOptions: "Más opciones",
+  copyAsMarkdown: "Copiar como Markdown",
+  downloadAsMarkdown: "Descargar como Markdown",
+  downloadAsJson: "Descargar como JSON",
+  copiedToClipboard: "Copiado al portapapeles",
+  copyFailed: "No se pudo copiar. Prueba a descargarlo.",
+  transcriptTitle: "Transcripción del chat",
+  transcriptExported: "Exportado el {date}",
+  transcriptUser: "Usuario",
+  transcriptAssistant: "Asistente",
+  transcriptAttachments: "Adjuntos:",
+  transcriptSources: "Fuentes:",
+
   // Errors
   errorGeneric: "Algo salió mal. Inténtalo de nuevo.",
   errorConnection: "No se pudo conectar. Inténtalo de nuevo.",
diff --git a/widget/src/locales/fr.ts b/widget/src/locales/fr.ts
index b7746f0..c07045f 100644
--- a/widget/src/locales/fr.ts
+++ b/widget/src/locales/fr.ts
@@ -48,6 +48,20 @@ export const fr: ClaudiusTranslations = {
   resumeReading: "Reprendre la lecture",
   stopReading: "Arrêter la lecture",
 
+  // Conversation export
+  moreOptions: "Plus d'options",
+  copyAsMarkdown: "Copier en Markdown",
+  downloadAsMarkdown: "Télécharger en Markdown",
+  downloadAsJson: "Télécharger en JSON",
+  copiedToClipboard: "Copié dans le presse-papiers",
+  copyFailed: "Impossible de copier. Essayez plutôt de télécharger.",
+  transcriptTitle: "Transcription du chat",
+  transcriptExported: "Exporté le {date}",
+  transcriptUser: "Utilisateur",
+  transcriptAssistant: "Assistant",
+  transcriptAttachments: "Pièces jointes :",
+  transcriptSources: "Sources :",
+
   // Errors
   errorGeneric: "Une erreur s'est produite. Veuillez réessayer.",
   errorConnection: "Échec de la connexion. Veuillez réessayer.",

From ae759d096a97006ad11c014096bfc06fbf48857c Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:23:48 -0400
Subject: [PATCH 11/28] feat(widget): accessible header menu

A generic WAI-ARIA menu button for the chat header, rendered inline so it stays inside the focus trap and the theme scope. Escape closes only the menu. Disabled items use aria-disabled so a focused control never vanishes from under the trap.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 widget/src/components/ChatHeader.stories.tsx  |  22 ++
 widget/src/components/ChatHeader.tsx          |  10 +-
 widget/src/components/HeaderMenu.tsx          | 205 ++++++++++++++++++
 .../components/__tests__/HeaderMenu.test.tsx  | 177 +++++++++++++++
 4 files changed, 412 insertions(+), 2 deletions(-)
 create mode 100644 widget/src/components/HeaderMenu.tsx
 create mode 100644 widget/src/components/__tests__/HeaderMenu.test.tsx

diff --git a/widget/src/components/ChatHeader.stories.tsx b/widget/src/components/ChatHeader.stories.tsx
index b07fd75..36e68e8 100644
--- a/widget/src/components/ChatHeader.stories.tsx
+++ b/widget/src/components/ChatHeader.stories.tsx
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { fn } from "storybook/test";
 import { ChatHeader } from "./ChatHeader";
+import { HeaderMenu } from "./HeaderMenu";
 import { locales, type LocaleCode } from "../locales";
 
 const meta = {
@@ -33,3 +34,24 @@ export const LongTitle: Story = {
     subtitle: "We typically reply within a few minutes",
   },
 };
+
+// The overflow menu sits before the close button and opens over the messages.
+export const WithMenu: Story = {
+  args: {
+    actions: (
+      <HeaderMenu
+        label="More options"
+        items={[
+          { id: "copy", label: "Copy as Markdown", onSelect: fn() },
+          { id: "md", label: "Download as Markdown", onSelect: fn() },
+          {
+            id: "json",
+            label: "Download as JSON",
+            disabled: true,
+            onSelect: fn(),
+          },
+        ]}
+      />
+    ),
+  },
+};
diff --git a/widget/src/components/ChatHeader.tsx b/widget/src/components/ChatHeader.tsx
index bed7d21..b78b86e 100644
--- a/widget/src/components/ChatHeader.tsx
+++ b/widget/src/components/ChatHeader.tsx
@@ -1,3 +1,5 @@
+import type { ReactNode } from "react";
+
 interface ChatHeaderProps {
   title: string;
   subtitle: string;
@@ -5,12 +7,14 @@ interface ChatHeaderProps {
   titleId?: string;
   closeLabel: string;
   onClose: () => void;
+  /** Extra header controls, rendered before the close button. */
+  actions?: ReactNode;
 }
 
 /**
  * The accent-colored bar at the top of the chat window: avatar initial, title
- * and subtitle, and the close button. The heading carries `titleId` so the
- * parent dialog can reference it via aria-labelledby.
+ * and subtitle, optional actions, and the close button. The heading carries
+ * `titleId` so the parent dialog can reference it via aria-labelledby.
  */
 export function ChatHeader({
   title,
@@ -18,6 +22,7 @@ export function ChatHeader({
   titleId,
   closeLabel,
   onClose,
+  actions,
 }: ChatHeaderProps) {
   return (
     <div className="flex items-center gap-3 bg-claudius-accent px-5 py-4">
@@ -36,6 +41,7 @@ export function ChatHeader({
         </h2>
         <p className="text-xs text-claudius-accent-text">{subtitle}</p>
       </div>
+      {actions}
       <button
         onClick={onClose}
         aria-label={closeLabel}
diff --git a/widget/src/components/HeaderMenu.tsx b/widget/src/components/HeaderMenu.tsx
new file mode 100644
index 0000000..2e9da29
--- /dev/null
+++ b/widget/src/components/HeaderMenu.tsx
@@ -0,0 +1,205 @@
+import {
+  useEffect,
+  useId,
+  useRef,
+  useState,
+  type FocusEvent,
+  type KeyboardEvent,
+} from "react";
+
+export interface HeaderMenuItem {
+  id: string;
+  label: string;
+  /** Shown greyed out and focusable, but does nothing when chosen. */
+  disabled?: boolean;
+  onSelect: () => void;
+}
+
+interface HeaderMenuProps {
+  /** Accessible name of the trigger, and so of the menu. */
+  label: string;
+  items: HeaderMenuItem[];
+  /** Called each time the menu opens. */
+  onOpen?: () => void;
+}
+
+/**
+ * The header's overflow menu, following the WAI-ARIA menu button pattern. It
+ * is generic: it knows nothing about what its items do.
+ *
+ * It renders inline, not through a portal, so it stays inside the dialog's
+ * focus trap and inherits the theme tokens and dark mode from
+ * `.claudius-root`.
+ */
+export function HeaderMenu({ label, items, onOpen }: HeaderMenuProps) {
+  const [open, setOpen] = useState(false);
+  const triggerId = useId();
+  const menuId = useId();
+  const rootRef = useRef<HTMLDivElement>(null);
+  const triggerRef = useRef<HTMLButtonElement>(null);
+  const itemRefs = useRef<(HTMLButtonElement | null)[]>([]);
+  // The item to focus once the popup has rendered.
+  const pendingFocus = useRef<number | null>(null);
+
+  const openMenu = (focusIndex: number) => {
+    pendingFocus.current = focusIndex;
+    setOpen(true);
+    onOpen?.();
+  };
+
+  const closeMenu = (restoreFocus: boolean) => {
+    setOpen(false);
+    if (restoreFocus) triggerRef.current?.focus();
+  };
+
+  useEffect(() => {
+    if (!open) return;
+    if (pendingFocus.current !== null) {
+      itemRefs.current[pendingFocus.current]?.focus();
+      pendingFocus.current = null;
+    }
+    // onBlur alone would miss this in Safari, which does not focus a button
+    // when it is clicked.
+    const onPointerDown = (event: PointerEvent) => {
+      if (!rootRef.current?.contains(event.target as Node)) setOpen(false);
+    };
+    document.addEventListener("pointerdown", onPointerDown);
+    return () => document.removeEventListener("pointerdown", onPointerDown);
+  }, [open]);
+
+  const focusItem = (index: number) => {
+    const count = items.length;
+    itemRefs.current[(index + count) % count]?.focus();
+  };
+
+  const onTriggerKeyDown = (event: KeyboardEvent<HTMLButtonElement>) => {
+    // Enter and Space arrive as a click, which keeps them working the same
+    // in every browser.
+    if (event.key === "ArrowDown") {
+      event.preventDefault();
+      openMenu(0);
+    } else if (event.key === "ArrowUp") {
+      event.preventDefault();
+      openMenu(items.length - 1);
+    }
+  };
+
+  // On the menu, not the wrapper: focus is always inside the menu while it is
+  // open, so this is where the keys arrive, and a plain wrapper div with
+  // handlers would need a role it does not have.
+  const onMenuKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {
+    const current = itemRefs.current.findIndex(
+      (el) => el === document.activeElement,
+    );
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        focusItem(current + 1);
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        // -1 when the menu itself has focus, after a click on its padding.
+        focusItem(current === -1 ? items.length - 1 : current - 1);
+        break;
+      case "Home":
+        event.preventDefault();
+        focusItem(0);
+        break;
+      case "End":
+        event.preventDefault();
+        focusItem(items.length - 1);
+        break;
+      case "Escape":
+        // Close the menu only. Without this the chat's document-level
+        // Escape handler would close the whole window.
+        event.preventDefault();
+        event.stopPropagation();
+        closeMenu(true);
+        break;
+      case "Tab":
+        // Shift+Tab lands on the trigger anyway; going there ourselves
+        // closes the menu in the same step. A forward Tab is left to the
+        // browser, and onBlur closes the menu once focus has moved on.
+        // Closing here instead would unmount the focused item mid-keystroke.
+        if (event.shiftKey) {
+          event.preventDefault();
+          closeMenu(true);
+        }
+        break;
+    }
+  };
+
+  const onMenuBlur = (event: FocusEvent<HTMLDivElement>) => {
+    // Focus left the menu entirely: a Tab, or a click on another control.
+    // Moving to the trigger does not count, or a click on it would close the
+    // menu here and then reopen it in onClick.
+    if (!rootRef.current?.contains(event.relatedTarget as Node | null)) {
+      setOpen(false);
+    }
+  };
+
+  return (
+    <div ref={rootRef} className="relative">
+      <button
+        ref={triggerRef}
+        id={triggerId}
+        type="button"
+        aria-label={label}
+        aria-haspopup="menu"
+        aria-expanded={open}
+        aria-controls={open ? menuId : undefined}
+        onClick={() => (open ? closeMenu(true) : openMenu(0))}
+        onKeyDown={onTriggerKeyDown}
+        className="flex h-10 w-10 items-center justify-center rounded-claudius-full text-claudius-accent-text-muted transition-colors hover:bg-claudius-accent-soft hover:text-claudius-accent-text"
+      >
+        <svg
+          width="18"
+          height="18"
+          viewBox="0 0 24 24"
+          fill="currentColor"
+          aria-hidden="true"
+        >
+          <circle cx="12" cy="5" r="1.75" />
+          <circle cx="12" cy="12" r="1.75" />
+          <circle cx="12" cy="19" r="1.75" />
+        </svg>
+      </button>
+      {open && (
+        <div
+          id={menuId}
+          role="menu"
+          aria-labelledby={triggerId}
+          // Focusable by script only, as an element with handlers must be.
+          // The focus trap skips tabindex -1.
+          tabIndex={-1}
+          onKeyDown={onMenuKeyDown}
+          onBlur={onMenuBlur}
+          className="absolute right-0 top-full z-20 mt-1 min-w-[12rem] rounded-claudius-md border border-claudius-border bg-claudius-surface py-1 shadow-claudius-elevated"
+        >
+          {items.map((item, index) => (
+            <button
+              key={item.id}
+              ref={(el) => {
+                itemRefs.current[index] = el;
+              }}
+              type="button"
+              role="menuitem"
+              tabIndex={-1}
+              // Not `disabled`: a focused control must never drop out from
+              // under the dialog's focus trap.
+              aria-disabled={item.disabled || undefined}
+              onClick={() => {
+                if (item.disabled) return;
+                closeMenu(true);
+                item.onSelect();
+              }}
+              className="flex min-h-[40px] w-full items-center whitespace-nowrap px-4 text-left text-sm text-claudius-text hover:bg-claudius-surface-muted focus:bg-claudius-surface-muted aria-disabled:cursor-default aria-disabled:opacity-50 aria-disabled:hover:bg-transparent"
+            >
+              {item.label}
+            </button>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/widget/src/components/__tests__/HeaderMenu.test.tsx b/widget/src/components/__tests__/HeaderMenu.test.tsx
new file mode 100644
index 0000000..60d1595
--- /dev/null
+++ b/widget/src/components/__tests__/HeaderMenu.test.tsx
@@ -0,0 +1,177 @@
+import { render, screen, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { HeaderMenu, type HeaderMenuItem } from "../HeaderMenu";
+
+function setup(overrides: Partial<HeaderMenuItem>[] = []) {
+  const items: HeaderMenuItem[] = ["Copy", "Download", "Archive"].map(
+    (label, i) => ({
+      id: label.toLowerCase(),
+      label,
+      onSelect: vi.fn(),
+      ...overrides[i],
+    }),
+  );
+  const onOpen = vi.fn();
+  // The sibling stands in for the header's close button, so Tab has
+  // somewhere to go.
+  render(
+    <>
+      <HeaderMenu label="More options" items={items} onOpen={onOpen} />
+      <button type="button">Close chat</button>
+    </>,
+  );
+  return {
+    items,
+    onOpen,
+    user: userEvent.setup(),
+    trigger: screen.getByRole("button", { name: "More options" }),
+  };
+}
+
+describe("HeaderMenu", () => {
+  it("is a closed menu button until it is used", () => {
+    const { trigger } = setup();
+    expect(trigger).toHaveAttribute("aria-haspopup", "menu");
+    expect(trigger).toHaveAttribute("aria-expanded", "false");
+    expect(trigger).not.toHaveAttribute("aria-controls");
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
+
+  it("opens on click, labelled by its trigger, with focus on the first item", async () => {
+    const { user, trigger, onOpen } = setup();
+    await user.click(trigger);
+
+    const menu = screen.getByRole("menu", { name: "More options" });
+    expect(trigger).toHaveAttribute("aria-expanded", "true");
+    expect(trigger).toHaveAttribute("aria-controls", menu.id);
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    expect(onOpen).toHaveBeenCalledTimes(1);
+  });
+
+  it("opens from the keyboard: Enter and ArrowDown on the first item, ArrowUp on the last", async () => {
+    const { user, trigger } = setup();
+    trigger.focus();
+
+    await user.keyboard("{Enter}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{Escape}");
+
+    await user.keyboard("{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{Escape}");
+
+    await user.keyboard("{ArrowUp}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+  });
+
+  it("moves with the arrows, wrapping, and jumps with Home and End", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+
+    await user.keyboard("{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Download" })).toHaveFocus();
+    await user.keyboard("{ArrowDown}{ArrowDown}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{ArrowUp}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+    await user.keyboard("{Home}");
+    expect(screen.getByRole("menuitem", { name: "Copy" })).toHaveFocus();
+    await user.keyboard("{End}");
+    expect(screen.getByRole("menuitem", { name: "Archive" })).toHaveFocus();
+  });
+
+  it("keeps its items out of the tab order", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("tabindex", "-1");
+    }
+  });
+
+  it("runs the chosen item, closes, and returns focus to the trigger", async () => {
+    const { user, trigger, items } = setup();
+    await user.click(trigger);
+    await user.click(screen.getByRole("menuitem", { name: "Download" }));
+
+    expect(items[1].onSelect).toHaveBeenCalledTimes(1);
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+  });
+
+  it("activates the focused item with Enter", async () => {
+    const { user, trigger, items } = setup();
+    await user.click(trigger);
+    await user.keyboard("{ArrowDown}{Enter}");
+    expect(items[1].onSelect).toHaveBeenCalledTimes(1);
+  });
+
+  it("keeps a disabled item focusable but inert, and stays open", async () => {
+    const { user, trigger, items } = setup([{ disabled: true }]);
+    await user.click(trigger);
+    const copy = screen.getByRole("menuitem", { name: "Copy" });
+
+    expect(copy).toHaveAttribute("aria-disabled", "true");
+    expect(copy).not.toBeDisabled();
+    expect(copy).toHaveFocus();
+    await user.click(copy);
+
+    expect(items[0].onSelect).not.toHaveBeenCalled();
+    expect(screen.getByRole("menu")).toBeInTheDocument();
+  });
+
+  it("closes on Escape, returns focus, and keeps the key from the page", async () => {
+    const onDocumentKeyDown = vi.fn();
+    document.addEventListener("keydown", onDocumentKeyDown);
+    const { user, trigger } = setup();
+    await user.click(trigger);
+
+    await user.keyboard("{Escape}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+    expect(onDocumentKeyDown).not.toHaveBeenCalled();
+    document.removeEventListener("keydown", onDocumentKeyDown);
+  });
+
+  it("lets Escape through when it is closed", async () => {
+    const onDocumentKeyDown = vi.fn();
+    document.addEventListener("keydown", onDocumentKeyDown);
+    const { user, trigger } = setup();
+    trigger.focus();
+
+    await user.keyboard("{Escape}");
+
+    expect(onDocumentKeyDown).toHaveBeenCalledTimes(1);
+    document.removeEventListener("keydown", onDocumentKeyDown);
+  });
+
+  it("closes on Tab once focus has moved on to the next control", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    await user.keyboard("{Tab}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(screen.getByRole("button", { name: "Close chat" })).toHaveFocus();
+  });
+
+  it("closes on Shift+Tab with focus back on the trigger", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    await user.keyboard("{Shift>}{Tab}{/Shift}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(trigger).toHaveFocus();
+  });
+
+  it("closes on a press outside, and on a second click of the trigger", async () => {
+    const { user, trigger } = setup();
+    await user.click(trigger);
+    fireEvent.pointerDown(document.body);
+    expect(screen.queryByRole("menu")).toBeNull();
+
+    await user.click(trigger);
+    await user.click(trigger);
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
+});

From 62ca7574c72f0512391f1560ed0d046a342d5a90 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:41:31 -0400
Subject: [PATCH 12/28] feat(widget): useConversationExport hook

Turns the conversation into the three header-menu actions and a transient copy status. Items are disabled while the conversation is empty or a reply is in flight.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 .../__tests__/useConversationExport.test.ts   | 170 ++++++++++++++++++
 widget/src/hooks/useConversationExport.ts     | 132 ++++++++++++++
 2 files changed, 302 insertions(+)
 create mode 100644 widget/src/hooks/__tests__/useConversationExport.test.ts
 create mode 100644 widget/src/hooks/useConversationExport.ts

diff --git a/widget/src/hooks/__tests__/useConversationExport.test.ts b/widget/src/hooks/__tests__/useConversationExport.test.ts
new file mode 100644
index 0000000..7cb8ba4
--- /dev/null
+++ b/widget/src/hooks/__tests__/useConversationExport.test.ts
@@ -0,0 +1,170 @@
+import { renderHook, act } from "@testing-library/react";
+import { describe, it, expect, vi, beforeEach, afterEach } from "vitest";
+import { useConversationExport } from "../useConversationExport";
+import { copyText, downloadTextFile } from "../../utils/saveText";
+import { locales } from "../../locales";
+import type { ChatMessage } from "../../api/types";
+
+vi.mock("../../utils/saveText", () => ({
+  copyText: vi.fn(),
+  downloadTextFile: vi.fn(),
+}));
+
+const messages: ChatMessage[] = [
+  {
+    id: "msg-1",
+    role: "user",
+    content: "Hi",
+    createdAt: "2026-09-19T14:03:00.000Z",
+  },
+  { id: "msg-2", role: "assistant", content: "Hello!" },
+];
+
+const base = { enabled: true, messages, busy: false, locale: "en-US" };
+
+function item(
+  result: { current: ReturnType<typeof useConversationExport> },
+  id: string,
+) {
+  const found = result.current.items.find((i) => i.id === id);
+  if (!found) throw new Error(`no item ${id}`);
+  return found;
+}
+
+describe("useConversationExport", () => {
+  beforeEach(() => {
+    vi.mocked(copyText).mockReset().mockResolvedValue(true);
+    vi.mocked(downloadTextFile).mockReset();
+  });
+  afterEach(() => vi.useRealTimers());
+
+  it("offers nothing when the feature is off", () => {
+    const { result } = renderHook(() =>
+      useConversationExport({ ...base, enabled: false }),
+    );
+    expect(result.current.items).toEqual([]);
+  });
+
+  it("offers copy, Markdown, and JSON, in that order", () => {
+    const { result } = renderHook(() => useConversationExport(base));
+    expect(
+      result.current.items.map((i) => [i.id, i.label, i.disabled]),
+    ).toEqual([
+      ["copy-markdown", "Copy as Markdown", false],
+      ["download-markdown", "Download as Markdown", false],
+      ["download-json", "Download as JSON", false],
+    ]);
+  });
+
+  it("disables every item while the conversation is empty or a reply is in flight", () => {
+    const empty = renderHook(() =>
+      useConversationExport({ ...base, messages: [] }),
+    );
+    expect(empty.result.current.items.every((i) => i.disabled)).toBe(true);
+
+    const busy = renderHook(() =>
+      useConversationExport({ ...base, busy: true }),
+    );
+    expect(busy.result.current.items.every((i) => i.disabled)).toBe(true);
+  });
+
+  it("copies the Markdown transcript and reports success", async () => {
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    const text = vi.mocked(copyText).mock.calls[0][0];
+    expect(text).toContain("# Chat transcript");
+    expect(text).toContain("## User · ");
+    expect(text).toContain("## Assistant\n\nHello!");
+    expect(result.current.status).toBe("Copied to clipboard");
+  });
+
+  it("hands the text to copyText before yielding, to keep the user activation", async () => {
+    const { result } = renderHook(() => useConversationExport(base));
+    let calledBeforeYielding = false;
+
+    // Async act, so the status update that follows the copy lands inside it
+    // instead of producing an act() warning. The count is read synchronously.
+    await act(async () => {
+      item(result, "copy-markdown").onSelect();
+      calledBeforeYielding = vi.mocked(copyText).mock.calls.length === 1;
+    });
+
+    expect(calledBeforeYielding).toBe(true);
+  });
+
+  it("reports a failed copy", async () => {
+    vi.mocked(copyText).mockResolvedValue(false);
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    expect(result.current.status).toBe(
+      "Could not copy. Try downloading instead.",
+    );
+  });
+
+  it("clears the status after four seconds, or on request", async () => {
+    // Only the timer the hook uses, so React's act() scheduling is untouched.
+    vi.useFakeTimers({ toFake: ["setTimeout", "clearTimeout"] });
+    const { result } = renderHook(() => useConversationExport(base));
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+    expect(result.current.status).not.toBeNull();
+    act(() => vi.advanceTimersByTime(3999));
+    expect(result.current.status).not.toBeNull();
+    act(() => vi.advanceTimersByTime(1));
+    expect(result.current.status).toBeNull();
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+    act(() => result.current.clearStatus());
+    expect(result.current.status).toBeNull();
+  });
+
+  it("downloads Markdown and JSON with a dated filename and the right type", () => {
+    const { result } = renderHook(() => useConversationExport(base));
+
+    act(() => item(result, "download-markdown").onSelect());
+    act(() => item(result, "download-json").onSelect());
+
+    const [md, json] = vi.mocked(downloadTextFile).mock.calls;
+    expect(md[0]).toMatch(/^chat-transcript-\d{4}-\d{2}-\d{2}\.md$/);
+    expect(md[1]).toContain("# Chat transcript");
+    expect(md[2]).toBe("text/markdown;charset=utf-8");
+    expect(json[0]).toMatch(/^chat-transcript-\d{4}-\d{2}-\d{2}\.json$/);
+    expect(JSON.parse(json[1])).toEqual(messages);
+    expect(json[2]).toBe("application/json");
+    expect(result.current.status).toBeNull();
+  });
+
+  it("writes the menu and the transcript in the widget's language", async () => {
+    const { result } = renderHook(() =>
+      useConversationExport({
+        ...base,
+        locale: "de-DE",
+        translations: locales.de,
+      }),
+    );
+    expect(result.current.items[0].label).toBe("Als Markdown kopieren");
+
+    await act(async () => item(result, "copy-markdown").onSelect());
+
+    const text = vi.mocked(copyText).mock.calls[0][0];
+    expect(text).toContain("# Chat-Protokoll");
+    expect(text).toContain("## Nutzer · ");
+    expect(result.current.status).toBe("In die Zwischenablage kopiert");
+  });
+
+  it("does not set state after unmount", async () => {
+    let resolve!: (ok: boolean) => void;
+    vi.mocked(copyText).mockReturnValue(new Promise((r) => (resolve = r)));
+    const { result, unmount } = renderHook(() => useConversationExport(base));
+
+    act(() => item(result, "copy-markdown").onSelect());
+    unmount();
+    await act(async () => resolve(true));
+
+    expect(result.current.status).toBeNull();
+  });
+});
diff --git a/widget/src/hooks/useConversationExport.ts b/widget/src/hooks/useConversationExport.ts
new file mode 100644
index 0000000..507a400
--- /dev/null
+++ b/widget/src/hooks/useConversationExport.ts
@@ -0,0 +1,132 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import type { ChatMessage } from "../api/types";
+import type { HeaderMenuItem } from "../components/HeaderMenu";
+import { defaultTranslations, type ClaudiusTranslations } from "../i18n";
+import {
+  conversationToJson,
+  conversationToMarkdown,
+  exportFilename,
+} from "../utils/exportConversation";
+import { copyText, downloadTextFile } from "../utils/saveText";
+
+const STATUS_MS = 4000;
+
+interface UseConversationExportOptions {
+  enabled: boolean;
+  messages: readonly ChatMessage[];
+  /** True while a reply is in flight. Export waits for it. */
+  busy: boolean;
+  /** BCP-47 tag used for the dates in a transcript. */
+  locale: string;
+  translations?: ClaudiusTranslations;
+}
+
+interface UseConversationExportReturn {
+  /** The header menu's items. Empty when the feature is off. */
+  items: HeaderMenuItem[];
+  /** The result of the last copy, shown briefly, or `null`. */
+  status: string | null;
+  clearStatus: () => void;
+}
+
+/**
+ * The three export actions as header-menu items, plus the transient status a
+ * copy reports. Everything happens in the browser.
+ */
+export function useConversationExport({
+  enabled,
+  messages,
+  busy,
+  locale,
+  translations,
+}: UseConversationExportOptions): UseConversationExportReturn {
+  const t = translations ?? defaultTranslations;
+  const [status, setStatus] = useState<string | null>(null);
+  const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
+  const mounted = useRef(true);
+
+  useEffect(() => {
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+      if (timer.current) clearTimeout(timer.current);
+    };
+  }, []);
+
+  const clearStatus = useCallback(() => {
+    if (timer.current) clearTimeout(timer.current);
+    timer.current = null;
+    setStatus(null);
+  }, []);
+
+  const showStatus = useCallback((text: string) => {
+    // The copy can settle after the window has closed.
+    if (!mounted.current) return;
+    if (timer.current) clearTimeout(timer.current);
+    setStatus(text);
+    timer.current = setTimeout(() => {
+      timer.current = null;
+      setStatus(null);
+    }, STATUS_MS);
+  }, []);
+
+  const items = useMemo<HeaderMenuItem[]>(() => {
+    if (!enabled) return [];
+
+    // A transcript whose last message is cut short is worse than a control
+    // that is unavailable for a few seconds.
+    const disabled = busy || messages.length === 0;
+    const markdown = () =>
+      conversationToMarkdown(messages, {
+        locale,
+        labels: {
+          title: t.transcriptTitle,
+          exported: t.transcriptExported,
+          user: t.transcriptUser,
+          assistant: t.transcriptAssistant,
+          attachments: t.transcriptAttachments,
+          sources: t.transcriptSources,
+          toolUsed: t.toolUsed,
+        },
+      });
+
+    return [
+      {
+        id: "copy-markdown",
+        label: t.copyAsMarkdown,
+        disabled,
+        onSelect: () => {
+          // Built and handed over synchronously: Firefox and Safari only
+          // allow a clipboard write during the click's user activation.
+          void copyText(markdown()).then((ok) =>
+            showStatus(ok ? t.copiedToClipboard : t.copyFailed),
+          );
+        },
+      },
+      {
+        id: "download-markdown",
+        label: t.downloadAsMarkdown,
+        disabled,
+        onSelect: () =>
+          downloadTextFile(
+            exportFilename("md"),
+            markdown(),
+            "text/markdown;charset=utf-8",
+          ),
+      },
+      {
+        id: "download-json",
+        label: t.downloadAsJson,
+        disabled,
+        onSelect: () =>
+          downloadTextFile(
+            exportFilename("json"),
+            conversationToJson(messages),
+            "application/json",
+          ),
+      },
+    ];
+  }, [enabled, busy, messages, locale, t, showStatus]);
+
+  return { items, status, clearStatus };
+}

From 368319bac89bade59e9b0affa95ff67cdfb21580 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 01:55:15 -0400
Subject: [PATCH 13/28] feat(widget): conversationExport option and header menu
 wiring

Opt-in and fails closed: only the literal true renders the menu, and nothing at all renders when it is off. The chat's Escape listener now skips events that are already defaultPrevented, so Escape closes an open menu without closing the window.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 widget/src/components/ChatWidget.tsx          |  32 +++-
 widget/src/components/ChatWindow.tsx          |  42 ++++-
 .../__tests__/ChatWidget.export.test.tsx      |  62 +++++++
 .../__tests__/ChatWindow.export.test.tsx      | 159 ++++++++++++++++++
 4 files changed, 289 insertions(+), 6 deletions(-)
 create mode 100644 widget/src/components/__tests__/ChatWidget.export.test.tsx
 create mode 100644 widget/src/components/__tests__/ChatWindow.export.test.tsx

diff --git a/widget/src/components/ChatWidget.tsx b/widget/src/components/ChatWidget.tsx
index c005d10..28e7ee9 100644
--- a/widget/src/components/ChatWidget.tsx
+++ b/widget/src/components/ChatWidget.tsx
@@ -18,7 +18,11 @@ import {
   resolveAttachmentsConfig,
   type AttachmentsOptions,
 } from "../utils/attachments";
-import { resolveVoiceConfig, type VoiceOptions } from "../utils/voice";
+import {
+  resolveSpeechLang,
+  resolveVoiceConfig,
+  type VoiceOptions,
+} from "../utils/voice";
 
 /** Corner of the viewport the widget docks to. */
 export type WidgetPosition =
@@ -105,6 +109,14 @@ export interface ChatWidgetProps {
    * @defaultValue `false`
    */
   voice?: boolean | VoiceOptions;
+  /**
+   * Let visitors copy the conversation as Markdown, or download it as
+   * Markdown or JSON, from a menu in the chat header. Everything happens in
+   * the browser and nothing is sent to the Worker. Only the literal `true`
+   * enables it. See the Conversation export guide.
+   * @defaultValue `false`
+   */
+  conversationExport?: boolean;
 }
 
 function readDismissed(): boolean {
@@ -154,17 +166,24 @@ export function ChatWidget({
   streaming = true,
   attachments = false,
   voice = false,
+  conversationExport = false,
 }: ChatWidgetProps) {
   const [isOpen, setIsOpen] = useState(false);
   const attachmentsConfig = useMemo(
     () => resolveAttachmentsConfig(attachments),
     [attachments],
   );
-  // Speech follows the widget's language, detected the same way as the
-  // translations when no locale is given.
+  // Speech and transcript dates follow the widget's language, detected the
+  // same way as the translations when no locale is given.
+  const activeLocale = useMemo(() => locale ?? detectLocale(), [locale]);
   const voiceConfig = useMemo(
-    () => resolveVoiceConfig(voice, locale ?? detectLocale()),
-    [voice, locale],
+    () => resolveVoiceConfig(voice, activeLocale),
+    [voice, activeLocale],
+  );
+  // The regional variant the visitor uses (en-GB, fr-CA), for dates.
+  const dateLocale = useMemo(
+    () => resolveSpeechLang(activeLocale),
+    [activeLocale],
   );
   const [greeting, setGreeting] = useState<string | null>(null);
   const [triggersDismissed, setTriggersDismissed] = useState(readDismissed);
@@ -317,6 +336,9 @@ export function ChatWidget({
             isMobile={isMobile}
             attachments={attachmentsConfig}
             voice={voiceConfig}
+            // Fail closed: a templated "false" string is truthy.
+            conversationExport={conversationExport === true}
+            locale={dateLocale}
           />
         )}
         {!(isOpen && isMobile) && (
diff --git a/widget/src/components/ChatWindow.tsx b/widget/src/components/ChatWindow.tsx
index 1b9f5c0..c34625c 100644
--- a/widget/src/components/ChatWindow.tsx
+++ b/widget/src/components/ChatWindow.tsx
@@ -5,9 +5,11 @@ import { ChatSources } from "./ChatSources";
 import { ChatHeader } from "./ChatHeader";
 import { ErrorBanner } from "./ErrorBanner";
 import { TypingIndicator } from "./TypingIndicator";
+import { HeaderMenu } from "./HeaderMenu";
 import { useSwipeToDismiss } from "../hooks/useSwipeToDismiss";
 import { useFocusTrap } from "../hooks/useFocusTrap";
 import { useSpeechSynthesis } from "../hooks/useSpeechSynthesis";
+import { useConversationExport } from "../hooks/useConversationExport";
 import { stripAnnouncementFormatting } from "../utils/stripAnnouncementFormatting";
 import type { WidgetPosition } from "./ChatWidget";
 import type { ClaudiusTranslations } from "../i18n";
@@ -44,6 +46,10 @@ interface ChatWindowProps {
   attachments?: ResolvedAttachmentsConfig | null;
   /** Voice settings, or `null` to hide the mic and read-aloud controls. */
   voice?: ResolvedVoiceConfig | null;
+  /** Show the header menu that copies or downloads the conversation. */
+  conversationExport?: boolean;
+  /** BCP-47 tag for the dates in an exported transcript. */
+  locale?: string;
 }
 
 const windowPositionClasses: Record<WidgetPosition, string> = {
@@ -73,6 +79,8 @@ export function ChatWindow({
   isMobile = false,
   attachments = null,
   voice = null,
+  conversationExport = false,
+  locale = "en-US",
 }: ChatWindowProps) {
   const titleId = useId();
   const dialogRef = useRef<HTMLDivElement>(null);
@@ -94,6 +102,14 @@ export function ChatWindow({
     stop: translations?.stopReading ?? "Stop reading",
   };
 
+  const exporter = useConversationExport({
+    enabled: conversationExport,
+    messages,
+    busy: isLoading,
+    locale,
+    translations,
+  });
+
   const { offsetY } = useSwipeToDismiss(
     messagesContainerRef,
     onClose,
@@ -114,7 +130,7 @@ export function ChatWindow({
 
   useEffect(() => {
     const handler = (e: KeyboardEvent) => {
-      if (e.key === "Escape" && !e.isComposing) {
+      if (e.key === "Escape" && !e.isComposing && !e.defaultPrevented) {
         onClose();
       }
     };
@@ -158,6 +174,15 @@ export function ChatWindow({
         titleId={titleId}
         closeLabel={closeLabel}
         onClose={onClose}
+        actions={
+          conversationExport ? (
+            <HeaderMenu
+              label={translations?.moreOptions ?? "More options"}
+              items={exporter.items}
+              onOpen={exporter.clearStatus}
+            />
+          ) : undefined
+        }
       />
 
       {/* Messages area */}
@@ -170,6 +195,21 @@ export function ChatWindow({
           />
         )}
 
+        {/* Mounted whenever export is on, so the text is announced when it
+            changes. Absent otherwise: the typing indicator is a status too. */}
+        {conversationExport && (
+          <div
+            role="status"
+            className="pointer-events-none absolute inset-x-0 top-2 z-10 flex justify-center px-4"
+          >
+            {exporter.status && (
+              <span className="rounded-claudius-full bg-claudius-text px-3 py-1 text-xs text-claudius-surface shadow-claudius-elevated">
+                {exporter.status}
+              </span>
+            )}
+          </div>
+        )}
+
         {/* Messages */}
         <div
           ref={messagesContainerRef}
diff --git a/widget/src/components/__tests__/ChatWidget.export.test.tsx b/widget/src/components/__tests__/ChatWidget.export.test.tsx
new file mode 100644
index 0000000..0578a18
--- /dev/null
+++ b/widget/src/components/__tests__/ChatWidget.export.test.tsx
@@ -0,0 +1,62 @@
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { ChatWidget } from "../ChatWidget";
+
+globalThis.fetch = vi.fn();
+
+// The toggle is the only button before the chat opens.
+async function openChat() {
+  await userEvent.setup().click(screen.getByRole("button"));
+}
+
+describe("ChatWidget conversationExport option", () => {
+  it("is off by default", async () => {
+    render(<ChatWidget apiUrl="https://test.workers.dev" locale="en" />);
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+
+  it("shows the header menu when enabled", async () => {
+    render(
+      <ChatWidget
+        apiUrl="https://test.workers.dev"
+        locale="en"
+        conversationExport
+      />,
+    );
+    await openChat();
+    expect(
+      screen.getByRole("button", { name: "More options" }),
+    ).toBeInTheDocument();
+  });
+
+  it.each([["true"], ["false"], [1], [{}]])(
+    "fails closed for %j, which is not the literal true",
+    async (value) => {
+      render(
+        <ChatWidget
+          apiUrl="https://test.workers.dev"
+          locale="en"
+          conversationExport={value as unknown as boolean}
+        />,
+      );
+      await openChat();
+      expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    },
+  );
+
+  it("labels the menu in the widget's language", async () => {
+    render(
+      <ChatWidget
+        apiUrl="https://test.workers.dev"
+        locale="de"
+        conversationExport
+      />,
+    );
+    await openChat();
+    expect(
+      screen.getByRole("button", { name: "Weitere Optionen" }),
+    ).toBeInTheDocument();
+  });
+});
diff --git a/widget/src/components/__tests__/ChatWindow.export.test.tsx b/widget/src/components/__tests__/ChatWindow.export.test.tsx
new file mode 100644
index 0000000..b565330
--- /dev/null
+++ b/widget/src/components/__tests__/ChatWindow.export.test.tsx
@@ -0,0 +1,159 @@
+import { render, screen, within, fireEvent } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import { describe, it, expect, vi } from "vitest";
+import { ChatWindow } from "../ChatWindow";
+import type { ChatMessage } from "../../api/types";
+
+const messages: ChatMessage[] = [
+  { id: "msg-1", role: "user", content: "What are your prices?" },
+  { id: "msg-2", role: "assistant", content: "Plans start at $10." },
+];
+
+function renderWindow(
+  props: Partial<React.ComponentProps<typeof ChatWindow>> = {},
+) {
+  const onClose = vi.fn();
+  render(
+    <ChatWindow
+      messages={messages}
+      isLoading={false}
+      error={null}
+      onSend={vi.fn()}
+      onClose={onClose}
+      conversationExport
+      {...props}
+    />,
+  );
+  return { onClose, user: userEvent.setup() };
+}
+
+describe("ChatWindow conversation export", () => {
+  it("renders no menu and no extra status region by default", () => {
+    renderWindow({ conversationExport: false });
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    expect(screen.queryByRole("status")).toBeNull();
+  });
+
+  it("puts the menu in the header, before the close button", () => {
+    renderWindow();
+    const buttons = within(screen.getByRole("dialog")).getAllByRole("button");
+    const names = buttons.map((b) => b.getAttribute("aria-label"));
+    expect(names.indexOf("More options")).toBe(names.indexOf("Close chat") - 1);
+  });
+
+  it("offers the three actions", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    expect(screen.getAllByRole("menuitem").map((i) => i.textContent)).toEqual([
+      "Copy as Markdown",
+      "Download as Markdown",
+      "Download as JSON",
+    ]);
+  });
+
+  it("disables the actions while empty and while a reply is in flight", async () => {
+    const { user } = renderWindow({ messages: [] });
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+
+  it("disables the actions while loading", async () => {
+    const { user } = renderWindow({ isLoading: true });
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    for (const item of screen.getAllByRole("menuitem")) {
+      expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+
+  it("copies the transcript and announces it", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    await user.click(
+      screen.getByRole("menuitem", { name: "Copy as Markdown" }),
+    );
+
+    expect(await screen.findByText("Copied to clipboard")).toBeInTheDocument();
+    expect(
+      screen.getByText("Copied to clipboard").closest('[role="status"]'),
+    ).not.toBeNull();
+    const copied = await navigator.clipboard.readText();
+    expect(copied).toContain("## User\n\nWhat are your prices?");
+    expect(copied).toContain("## Assistant\n\nPlans start at $10.");
+  });
+
+  it("clears the last status when the menu is opened again", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    await user.click(
+      screen.getByRole("menuitem", { name: "Copy as Markdown" }),
+    );
+    await screen.findByText("Copied to clipboard");
+
+    await user.click(screen.getByRole("button", { name: "More options" }));
+
+    expect(screen.queryByText("Copied to clipboard")).toBeNull();
+  });
+
+  it("closes only the menu on the first Escape, and the chat on the second", async () => {
+    const { user, onClose } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+
+    await user.keyboard("{Escape}");
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(onClose).not.toHaveBeenCalled();
+
+    await user.keyboard("{Escape}");
+    expect(onClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("ignores an Escape that something else already handled", () => {
+    const { onClose } = renderWindow();
+    // A listener on body runs before the chat's listener on document.
+    const handle = (event: Event) => event.preventDefault();
+    document.body.addEventListener("keydown", handle);
+
+    fireEvent.keyDown(document.body, { key: "Escape" });
+
+    document.body.removeEventListener("keydown", handle);
+    expect(onClose).not.toHaveBeenCalled();
+  });
+
+  it("uses the translated labels", async () => {
+    const { locales } = await import("../../locales");
+    const { user } = renderWindow({ translations: locales.fr });
+    await user.click(screen.getByRole("button", { name: "Plus d'options" }));
+    expect(
+      screen.getByRole("menuitem", { name: "Copier en Markdown" }),
+    ).toBeInTheDocument();
+  });
+
+  it("tabs out of the open menu to the close button, closing the menu", async () => {
+    const { user } = renderWindow();
+    await user.click(screen.getByRole("button", { name: "More options" }));
+    await user.keyboard("{End}");
+    expect(
+      screen.getByRole("menuitem", { name: "Download as JSON" }),
+    ).toHaveFocus();
+
+    await user.keyboard("{Tab}");
+
+    expect(screen.queryByRole("menu")).toBeNull();
+    expect(screen.getByRole("button", { name: "Close chat" })).toHaveFocus();
+  });
+
+  it("keeps the focus trap wrapping now that the menu trigger is the first control", async () => {
+    const { user } = renderWindow();
+    const trigger = screen.getByRole("button", { name: "More options" });
+    trigger.focus();
+
+    await user.keyboard("{Shift>}{Tab}{/Shift}");
+
+    // Wrapped to the dialog's last focusable control, not out of the dialog.
+    expect(trigger).not.toHaveFocus();
+    expect(screen.getByRole("dialog")).toContainElement(
+      document.activeElement as HTMLElement,
+    );
+  });
+});

From e91b492b34cccb8206aaca29079f47b8fbda55da Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:05:06 -0400
Subject: [PATCH 14/28] feat(widget): conversationExport in ClaudiusConfig and
 <claudius-chat>

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 widget/src/__tests__/embed.test.tsx | 66 +++++++++++++++++++++++++++++
 widget/src/embed.tsx                |  9 ++++
 widget/src/main.tsx                 |  7 ++-
 3 files changed, 81 insertions(+), 1 deletion(-)

diff --git a/widget/src/__tests__/embed.test.tsx b/widget/src/__tests__/embed.test.tsx
index 2ffd848..7238c95 100644
--- a/widget/src/__tests__/embed.test.tsx
+++ b/widget/src/__tests__/embed.test.tsx
@@ -126,3 +126,69 @@ describe("embed voice option", () => {
     ).toBeInTheDocument();
   });
 });
+
+describe("embed conversationExport option", () => {
+  beforeEach(() => {
+    vi.resetModules();
+    document.body.innerHTML = "";
+    window.sessionStorage.clear();
+    window.ClaudiusConfig = undefined;
+  });
+
+  afterEach(() => {
+    document.body.innerHTML = "";
+    window.ClaudiusConfig = undefined;
+  });
+
+  async function openChat() {
+    (await screen.findByRole("button", { name: /open chat/i })).click();
+    await screen.findByRole("dialog");
+  }
+
+  function mountElement(attributes: Record<string, string>) {
+    const el = document.createElement("claudius-chat");
+    el.setAttribute("api-url", "https://test.example/api");
+    for (const [name, value] of Object.entries(attributes)) {
+      el.setAttribute(name, value);
+    }
+    document.body.appendChild(el);
+  }
+
+  it("enables the header menu from ClaudiusConfig", async () => {
+    window.ClaudiusConfig = {
+      apiUrl: "https://test.example/api",
+      conversationExport: true,
+    };
+    await import("../embed");
+    await openChat();
+    expect(
+      screen.getByRole("button", { name: "More options" }),
+    ).toBeInTheDocument();
+  });
+
+  it("stays off for a templated string in ClaudiusConfig", async () => {
+    window.ClaudiusConfig = {
+      apiUrl: "https://test.example/api",
+      conversationExport: "false" as unknown as boolean,
+    };
+    await import("../embed");
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+
+  it("enables it via the web component attribute", async () => {
+    await import("../embed");
+    mountElement({ "conversation-export": "" });
+    await openChat();
+    expect(
+      screen.getByRole("button", { name: "More options" }),
+    ).toBeInTheDocument();
+  });
+
+  it('stays off for conversation-export="false", and when absent', async () => {
+    await import("../embed");
+    mountElement({ "conversation-export": "false" });
+    await openChat();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  });
+});
diff --git a/widget/src/embed.tsx b/widget/src/embed.tsx
index 0b9b1bb..7d1279a 100644
--- a/widget/src/embed.tsx
+++ b/widget/src/embed.tsx
@@ -31,6 +31,7 @@ interface ClaudiusConfig {
   triggers?: Trigger[];
   attachments?: boolean | AttachmentsOptions;
   voice?: boolean | VoiceOptions;
+  conversationExport?: boolean;
 }
 
 declare global {
@@ -74,6 +75,7 @@ function init() {
       triggers={config.triggers}
       attachments={config.attachments}
       voice={config.voice}
+      conversationExport={config.conversationExport}
     />,
   );
 }
@@ -97,6 +99,7 @@ class ClaudiusChat extends HTMLElement {
       "accent-color",
       "position",
       "attachments",
+      "conversation-export",
       "voice",
       "voice-mode",
       "voice-auto-submit",
@@ -150,6 +153,11 @@ class ClaudiusChat extends HTMLElement {
     const attachments =
       attachmentsAttr === null ? undefined : attachmentsAttr !== "false";
 
+    // `conversation-export` / `="true"` enables it; "false" or absent does not.
+    const exportAttr = this.getAttribute("conversation-export");
+    const conversationExport =
+      exportAttr === null ? undefined : exportAttr !== "false";
+
     this.root.render(
       <ChatWidget
         apiUrl={apiUrl}
@@ -172,6 +180,7 @@ class ClaudiusChat extends HTMLElement {
           (this.getAttribute("position") as WidgetPosition) ?? undefined
         }
         attachments={attachments}
+        conversationExport={conversationExport}
         voice={voiceOptionsFromAttributes((name) => this.getAttribute(name))}
       />,
     );
diff --git a/widget/src/main.tsx b/widget/src/main.tsx
index d17e267..0295104 100644
--- a/widget/src/main.tsx
+++ b/widget/src/main.tsx
@@ -5,6 +5,11 @@ import "./styles.css";
 
 createRoot(document.getElementById("root")!).render(
   <StrictMode>
-    <ChatWidget apiUrl="http://localhost:8787" attachments voice />
+    <ChatWidget
+      apiUrl="http://localhost:8787"
+      attachments
+      voice
+      conversationExport
+    />
   </StrictMode>,
 );

From b6e434757b2cf7bbda72ec814bdc7e208799f967 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:06:19 -0400
Subject: [PATCH 15/28] feat(scripts): conversationExport in client config
 schema, validation, and snippets

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
---
 clients/_schema.json                          |  4 ++
 .../conversation-export-config.test.ts        | 69 +++++++++++++++++++
 scripts/lib/config.ts                         | 11 +++
 scripts/lib/snippet.ts                        |  7 ++
 4 files changed, 91 insertions(+)
 create mode 100644 scripts/lib/__tests__/conversation-export-config.test.ts

diff --git a/clients/_schema.json b/clients/_schema.json
index 8e76e01..8c13213 100644
--- a/clients/_schema.json
+++ b/clients/_schema.json
@@ -79,6 +79,10 @@
               }
             }
           ]
+        },
+        "conversationExport": {
+          "type": "boolean",
+          "description": "Let visitors copy the conversation as Markdown, or download it as Markdown or JSON, from a menu in the chat header. Off by default. Nothing is sent to the worker."
         }
       }
     },
diff --git a/scripts/lib/__tests__/conversation-export-config.test.ts b/scripts/lib/__tests__/conversation-export-config.test.ts
new file mode 100644
index 0000000..6343ec4
--- /dev/null
+++ b/scripts/lib/__tests__/conversation-export-config.test.ts
@@ -0,0 +1,69 @@
+import { describe, it, expect } from "vitest";
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { validateConfig } from "../config.js";
+import type { ClientConfig, ValidationError } from "../config.js";
+import { generateScriptSnippet, generateWebComponentSnippet } from "../snippet.js";
+
+function base(overrides: Partial<ClientConfig> = {}): Record<string, unknown> {
+  return {
+    name: "Test Client",
+    slug: "test-client",
+    apiUrl: "https://api.example.com",
+    allowedDomains: ["example.com"],
+    ...overrides,
+  };
+}
+
+function fields(errors: ValidationError[]): string[] {
+  return errors.map((e) => e.field);
+}
+
+const SCRIPT_URL = "https://cdn.example.com/claudius.js";
+
+describe("validateConfig: conversationExport", () => {
+  it("accepts a boolean", () => {
+    expect(validateConfig(base({ widget: { conversationExport: true } }), "test-client")).toEqual(
+      []
+    );
+    expect(
+      validateConfig(base({ widget: { conversationExport: false } }), "test-client")
+    ).toEqual([]);
+  });
+
+  it("rejects anything else, naming the field", () => {
+    for (const value of ["true", 1, {}, null]) {
+      const errors = validateConfig(
+        base({ widget: { conversationExport: value as never } }),
+        "test-client"
+      );
+      expect(fields(errors)).toEqual(["widget.conversationExport"]);
+      expect(errors[0].message).toBe("widget.conversationExport must be a boolean");
+    }
+  });
+});
+
+describe("snippets: conversationExport", () => {
+  it("is emitted only when it is true", () => {
+    const on = base({ widget: { conversationExport: true } }) as unknown as ClientConfig;
+    expect(generateScriptSnippet(on, SCRIPT_URL)).toContain('"conversationExport": true');
+    expect(generateWebComponentSnippet(on, SCRIPT_URL)).toContain(
+      'conversation-export="true"'
+    );
+
+    for (const widget of [{ conversationExport: false }, {}]) {
+      const off = base({ widget }) as unknown as ClientConfig;
+      expect(generateScriptSnippet(off, SCRIPT_URL)).not.toContain("conversationExport");
+      expect(generateWebComponentSnippet(off, SCRIPT_URL)).not.toContain("conversation-export");
+    }
+  });
+});
+
+describe("_schema.json: conversationExport", () => {
+  it("declares widget.conversationExport as a boolean", () => {
+    const schema = JSON.parse(
+      readFileSync(resolve(__dirname, "../../../clients/_schema.json"), "utf-8")
+    );
+    expect(schema.properties.widget.properties.conversationExport.type).toBe("boolean");
+  });
+});
diff --git a/scripts/lib/config.ts b/scripts/lib/config.ts
index f30df84..bd94997 100644
--- a/scripts/lib/config.ts
+++ b/scripts/lib/config.ts
@@ -27,6 +27,7 @@ export interface WidgetConfig {
   accentColor?: string;
   attachments?: boolean | WidgetAttachmentsConfig;
   voice?: boolean | WidgetVoiceConfig;
+  conversationExport?: boolean;
 }
 
 export interface WorkerAttachmentsConfig {
@@ -285,6 +286,16 @@ export function validateConfig(
         });
       }
     }
+
+    if (
+      widget.conversationExport !== undefined &&
+      typeof widget.conversationExport !== "boolean"
+    ) {
+      errors.push({
+        field: "widget.conversationExport",
+        message: "widget.conversationExport must be a boolean",
+      });
+    }
   }
 
   // worker (optional)
diff --git a/scripts/lib/snippet.ts b/scripts/lib/snippet.ts
index cda3d91..a11ce1a 100644
--- a/scripts/lib/snippet.ts
+++ b/scripts/lib/snippet.ts
@@ -40,6 +40,10 @@ export function generateScriptSnippet(
     if (config.widget.voice !== undefined && config.widget.voice !== false) {
       configObj.voice = config.widget.voice;
     }
+    // Opt-in, so only `true` is worth emitting.
+    if (config.widget.conversationExport === true) {
+      configObj.conversationExport = true;
+    }
   }
 
   // Build indented JSON: each line of the JSON body is indented to align under
@@ -94,6 +98,9 @@ export function generateWebComponentSnippet(
         if (voice.lang !== undefined) attrs.push(["voice-lang", voice.lang]);
       }
     }
+    if (config.widget.conversationExport === true) {
+      attrs.push(["conversation-export", "true"]);
+    }
   }
 
   const attrLines = attrs.map(([key, val]) => `  ${key}="${val}"`).join("\n");

From a3e5d03b4f9b7bfa1c1cc4092b348c46a3675b69 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:17:46 -0400
Subject: [PATCH 16/28] test(widget): e2e for conversation export

A real download for both formats, the real clipboard in Chromium, and Escape closing the menu before the chat.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 widget/e2e/export.spec.ts | 105 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 105 insertions(+)
 create mode 100644 widget/e2e/export.spec.ts

diff --git a/widget/e2e/export.spec.ts b/widget/e2e/export.spec.ts
new file mode 100644
index 0000000..8212033
--- /dev/null
+++ b/widget/e2e/export.spec.ts
@@ -0,0 +1,105 @@
+import { test, expect, type Page } from "@playwright/test";
+import { readFile } from "node:fs/promises";
+import { mockChatApi } from "./helpers";
+
+/**
+ * Conversation export in a real browser: an actual file download, the real
+ * clipboard where the permission can be granted, and Escape. Serialization
+ * edge cases are covered by the unit tests in src/utils/__tests__.
+ */
+async function haveConversation(page: Page) {
+  const api = await mockChatApi(page);
+  api.enqueueReply("Plans start at $10.");
+  await page.goto("/");
+  await page.getByRole("button", { name: /open chat/i }).click();
+  const input = page.getByLabel(/type your message/i);
+  await input.fill("What are your prices?");
+  await input.press("Enter");
+  await expect(
+    page.getByRole("log").getByText("Plans start at $10."),
+  ).toBeVisible();
+}
+
+test.describe("conversation export", () => {
+  test("downloads the conversation as Markdown", async ({ page }) => {
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    const downloading = page.waitForEvent("download");
+    await page.getByRole("menuitem", { name: "Download as Markdown" }).click();
+    const download = await downloading;
+
+    expect(download.suggestedFilename()).toMatch(
+      /^chat-transcript-\d{4}-\d{2}-\d{2}\.md$/,
+    );
+    const text = await readFile(await download.path(), "utf8");
+    expect(text).toContain("# Chat transcript");
+    expect(text).toMatch(/## User · .+\n\nWhat are your prices\?/);
+    expect(text).toMatch(/## Assistant · .+\n\nPlans start at \$10\./);
+  });
+
+  test("downloads the conversation as JSON", async ({ page }) => {
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    const downloading = page.waitForEvent("download");
+    await page.getByRole("menuitem", { name: "Download as JSON" }).click();
+    const download = await downloading;
+
+    expect(download.suggestedFilename()).toMatch(/\.json$/);
+    const messages = JSON.parse(await readFile(await download.path(), "utf8"));
+    expect(messages.map((m: { role: string }) => m.role)).toEqual([
+      "user",
+      "assistant",
+    ]);
+    expect(messages[0].createdAt).toMatch(/^\d{4}-\d{2}-\d{2}T/);
+  });
+
+  test("copies the conversation as Markdown", async ({
+    page,
+    context,
+    browserName,
+  }) => {
+    test.skip(
+      browserName !== "chromium",
+      "Only Chromium lets a test grant clipboard permissions",
+    );
+    await context.grantPermissions(["clipboard-read", "clipboard-write"]);
+    await haveConversation(page);
+
+    await page.getByRole("button", { name: "More options" }).click();
+    await page.getByRole("menuitem", { name: "Copy as Markdown" }).click();
+
+    await expect(page.getByText("Copied to clipboard")).toBeVisible();
+    const copied = await page.evaluate(() => navigator.clipboard.readText());
+    expect(copied).toContain("Plans start at $10.");
+  });
+
+  test("Escape closes the menu first, then the chat", async ({ page }) => {
+    await haveConversation(page);
+    const trigger = page.getByRole("button", { name: "More options" });
+
+    await trigger.click();
+    await expect(page.getByRole("menu")).toBeVisible();
+    await page.keyboard.press("Escape");
+    await expect(page.getByRole("menu")).toBeHidden();
+    await expect(page.getByRole("dialog")).toBeVisible();
+    await expect(trigger).toBeFocused();
+
+    await page.keyboard.press("Escape");
+    await expect(page.getByRole("dialog")).toBeHidden();
+  });
+
+  test("the actions are unavailable until there is something to export", async ({
+    page,
+  }) => {
+    await mockChatApi(page);
+    await page.goto("/");
+    await page.getByRole("button", { name: /open chat/i }).click();
+
+    await page.getByRole("button", { name: "More options" }).click();
+    for (const item of await page.getByRole("menuitem").all()) {
+      await expect(item).toHaveAttribute("aria-disabled", "true");
+    }
+  });
+});

From 6e3c2075a1c3fcabeb5bef0f2b4c163b131c8e8d Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:34:55 -0400
Subject: [PATCH 17/28] test(widget): wait for the export menu items before
 asserting on them

locator.all() does not wait for elements to match, so the disabled-state loop could run zero times and pass without checking anything if the menu items rendered late. Assert the exact item count first, and tighten the JSON download filename assertion to match the Markdown test's rigor.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 widget/e2e/export.spec.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/widget/e2e/export.spec.ts b/widget/e2e/export.spec.ts
index 8212033..94411ee 100644
--- a/widget/e2e/export.spec.ts
+++ b/widget/e2e/export.spec.ts
@@ -46,7 +46,9 @@ test.describe("conversation export", () => {
     await page.getByRole("menuitem", { name: "Download as JSON" }).click();
     const download = await downloading;
 
-    expect(download.suggestedFilename()).toMatch(/\.json$/);
+    expect(download.suggestedFilename()).toMatch(
+      /^chat-transcript-\d{4}-\d{2}-\d{2}\.json$/,
+    );
     const messages = JSON.parse(await readFile(await download.path(), "utf8"));
     expect(messages.map((m: { role: string }) => m.role)).toEqual([
       "user",
@@ -98,7 +100,9 @@ test.describe("conversation export", () => {
     await page.getByRole("button", { name: /open chat/i }).click();
 
     await page.getByRole("button", { name: "More options" }).click();
-    for (const item of await page.getByRole("menuitem").all()) {
+    const items = page.getByRole("menuitem");
+    await expect(items).toHaveCount(3);
+    for (const item of await items.all()) {
       await expect(item).toHaveAttribute("aria-disabled", "true");
     }
   });

From f1ac2958b1b17536deae449565db9a964cb5d6dc Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:38:04 -0400
Subject: [PATCH 18/28] docs(plans): the export e2e spec waits for its menu
 items

Task review found the plan's last e2e test iterated locator.all() with no wait, so it could loop zero times and pass vacuously. The plan now matches the fix in 6e3c207.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 .../2026-09-19-conversation-export-implementation.md   | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/docs/plans/2026-09-19-conversation-export-implementation.md b/docs/plans/2026-09-19-conversation-export-implementation.md
index 73637f1..6cffb2b 100644
--- a/docs/plans/2026-09-19-conversation-export-implementation.md
+++ b/docs/plans/2026-09-19-conversation-export-implementation.md
@@ -3079,7 +3079,9 @@ test.describe("conversation export", () => {
     await page.getByRole("menuitem", { name: "Download as JSON" }).click();
     const download = await downloading;
 
-    expect(download.suggestedFilename()).toMatch(/\.json$/);
+    expect(download.suggestedFilename()).toMatch(
+      /^chat-transcript-\d{4}-\d{2}-\d{2}\.json$/,
+    );
     const messages = JSON.parse(await readFile(await download.path(), "utf8"));
     expect(messages.map((m: { role: string }) => m.role)).toEqual([
       "user",
@@ -3131,7 +3133,11 @@ test.describe("conversation export", () => {
     await page.getByRole("button", { name: /open chat/i }).click();
 
     await page.getByRole("button", { name: "More options" }).click();
-    for (const item of await page.getByRole("menuitem").all()) {
+    // locator.all() does not wait, so without this the loop could run zero
+    // times and the test would pass having checked nothing.
+    const items = page.getByRole("menuitem");
+    await expect(items).toHaveCount(3);
+    for (const item of await items.all()) {
       await expect(item).toHaveAttribute("aria-disabled", "true");
     }
   });

From 69a29312897b4f325565214c1fb8c3c2fc2c5c66 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 02:46:25 -0400
Subject: [PATCH 19/28] docs: conversation export guide

Enabling it in each embed style, what each format contains, and a privacy posture that says plainly what an export can carry and that a transcript is not evidence.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 CLAUDE.md                                     |  25 ++-
 .../src/content/docs/configuration/clients.md |   2 +-
 .../docs/configuration/conversation-export.md | 146 ++++++++++++++++++
 .../docs/configuration/localization.md        |   1 +
 docs/src/content/docs/configuration/widget.md |   7 +-
 docs/src/content/docs/faq.md                  |   4 +
 6 files changed, 181 insertions(+), 4 deletions(-)
 create mode 100644 docs/src/content/docs/configuration/conversation-export.md

diff --git a/CLAUDE.md b/CLAUDE.md
index 61e9ceb..4be3b17 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -109,11 +109,12 @@ pnpm test             # Run tests
 | `VoiceLevel` | Voice-activity indicator shown inside the input while listening |
 | `MessageSpeechControls` | Read aloud / pause / resume / stop buttons under assistant replies |
 | `AttachmentPreview` | Image thumbnail / file chip for pending and sent attachments |
+| `HeaderMenu` | Generic accessible overflow menu in the chat header; hosts the export actions |
 
 ### useChat Hook
 
 Manages chat state:
-- `messages` - Array of chat messages
+- `messages` - Array of chat messages, each stamped with an ISO `createdAt` when it enters the conversation
 - `isLoading` - Loading state during API calls
 - `isStreaming` - True while an assistant reply is streaming in
 - `streamingMessageId` - Id of the message currently receiving tokens
@@ -195,6 +196,28 @@ the worker, but browsers recognize speech on their vendor's servers by
 default. Do not describe it as on-device. Docs: configuration/voice.md;
 design: docs/plans/2026-09-18-voice-input-tts-design.md.
 
+### Conversation Export
+
+Widget-only and opt-in (`conversationExport` prop / `ClaudiusConfig` key /
+`<claudius-chat conversation-export>` / `widget.conversationExport` in client
+configs). It fails closed: only the literal `true` enables it, and nothing
+renders when it is off. A `HeaderMenu` in the chat header offers Copy as
+Markdown, Download as Markdown, and Download as JSON, all in the browser with
+no request to the worker.
+
+Pure serializers live in `widget/src/utils/exportConversation.ts`
+(`protectMessageText`, `conversationToMarkdown`, `conversationToJson`,
+`exportFilename`); clipboard and download side effects in
+`widget/src/utils/saveText.ts`; `useConversationExport` (owned by `ChatWindow`)
+turns messages into menu items plus a transient status. Markdown keeps message
+text as written but closes unclosed code fences, turns single newlines into
+hard breaks outside code, and escapes a line-leading `<`. JSON is the
+persisted `ChatMessage[]`, never with inline attachment bytes.
+
+Never assert on raw `Intl` output in tests: CI's Node 20 emits U+202F before
+"PM" and local Node 24 does not. Docs: configuration/conversation-export.md;
+design: docs/plans/2026-09-19-conversation-export-design.md.
+
 ### Chat Request/Response
 
 ```typescript
diff --git a/docs/src/content/docs/configuration/clients.md b/docs/src/content/docs/configuration/clients.md
index 2b3d27b..2f1c750 100644
--- a/docs/src/content/docs/configuration/clients.md
+++ b/docs/src/content/docs/configuration/clients.md
@@ -47,7 +47,7 @@ pnpm claudius snippet acme     # generate the embed snippet(s)
 | `slug` | Yes | URL-safe identifier; must match the filename |
 | `apiUrl` | Yes | The client's worker chat endpoint |
 | `allowedDomains` | Yes | Domains where the widget may be embedded |
-| `widget` | No | Appearance: `title`, `subtitle`, `welcomeMessage`, `placeholder`, `theme`, `position`, `accentColor`; `attachments` (`true` or `{ maxSizeBytes, maxCount, allowedTypes }`); `voice` (`true` or `{ input, output, mode, autoSubmit, lang }`, see [Voice](/configuration/voice/)) |
+| `widget` | No | Appearance: `title`, `subtitle`, `welcomeMessage`, `placeholder`, `theme`, `position`, `accentColor`; `attachments` (`true` or `{ maxSizeBytes, maxCount, allowedTypes }`); `voice` (`true` or `{ input, output, mode, autoSubmit, lang }`, see [Voice](/configuration/voice/)); `conversationExport` (`true` to enable, see [Conversation export](/configuration/conversation-export/)) |
 | `worker` | No | `model`, `maxTokens` (1–8192), `rateLimitMinute`, `rateLimitHour`, `systemPrompt` (path to a markdown file), `attachments` (`enabled`, `maxBytes`, `maxCount`, `maxRequestBytes`, `allowedTypes`, `storage`, `retentionHours`, `quotaIpBytesPerDay`, `quotaTenantBytesPerDay`) |
 
 `widget.attachments` flows into the generated embed snippet. `worker.attachments`
diff --git a/docs/src/content/docs/configuration/conversation-export.md b/docs/src/content/docs/configuration/conversation-export.md
new file mode 100644
index 0000000..e9aad36
--- /dev/null
+++ b/docs/src/content/docs/configuration/conversation-export.md
@@ -0,0 +1,146 @@
+---
+title: Conversation export
+description: Let visitors copy or download the conversation as Markdown or JSON, and understand what an export contains.
+sidebar:
+  order: 9
+---
+
+Conversation export adds a **More options** menu to the chat header with three
+actions:
+
+- **Copy as Markdown** puts a transcript on the clipboard.
+- **Download as Markdown** saves the same transcript as a `.md` file.
+- **Download as JSON** saves the raw message array as a `.json` file.
+
+Visitors use it to share an answer with a teammate, attach a transcript to a
+support ticket, or keep a record. It is **off by default**. Everything happens
+in the visitor's browser, and nothing is sent to your worker.
+
+## Enabling it
+
+```tsx
+<ChatWidget apiUrl="https://api.example.com" conversationExport />
+```
+
+```html
+<script>
+  window.ClaudiusConfig = {
+    apiUrl: "https://api.example.com",
+    conversationExport: true,
+  };
+</script>
+```
+
+```html
+<claudius-chat api-url="https://api.example.com" conversation-export></claudius-chat>
+```
+
+In a [client config](/configuration/clients/), set
+`"widget": { "conversationExport": true }` and regenerate the snippet.
+
+Only the literal `true` enables it. A value such as the string `"false"`, which
+a CMS template can easily produce, leaves it off. On the web component,
+`conversation-export="false"` also leaves it off.
+
+The actions are greyed out while the conversation is empty and while a reply
+is still arriving, so a transcript never ends in a half-finished answer.
+
+## The Markdown transcript
+
+````markdown
+# Chat transcript
+
+Exported Sep 19, 2026, 3:32 PM (GMT+01:00)
+
+## User · Sep 19, 2026, 3:03 PM
+
+What does the error in this screenshot mean?
+
+Attachments:
+
+- `error_v2.png` (image/png, 48 KB)
+
+## Assistant · Sep 19, 2026, 3:03 PM
+
+The response body is not valid JSON. Guard the parse:
+
+```js
+const data = JSON.parse(text);
+```
+
+Sources:
+
+1. [Parsing JSON](https://example.com/docs/json)
+````
+
+- The transcript is written in the widget's [language](/configuration/localization/),
+  and dates follow the visitor's regional format and time zone. The zone is
+  given once, as a UTC offset.
+- Message text is exported as written, so code blocks, lists, and links
+  survive. A code block that a stopped reply left open is closed, so it cannot
+  swallow the messages after it. Line breaks are kept as the visitor saw them.
+- Citations become a numbered list of links. A source whose URL is not
+  `http:` or `https:` keeps its title and loses its link.
+- Attachments are listed by name, type, and size. The file itself is never
+  included, and neither is its download link.
+- Tools the assistant used are named. Their inputs and results are not.
+- Messages from a conversation that began before you upgraded have no
+  timestamp, and are exported without one.
+
+## The JSON file
+
+A pretty-printed array of `ChatMessage` objects, exactly as the widget
+[keeps them in `sessionStorage`](/api/widget/#message-persistence):
+
+```json
+[
+  {
+    "id": "msg-1",
+    "role": "user",
+    "content": "What are your prices?",
+    "createdAt": "2026-09-19T14:03:00.000Z"
+  },
+  {
+    "id": "msg-2",
+    "role": "assistant",
+    "content": "Plans start at $10.",
+    "createdAt": "2026-09-19T14:03:04.120Z",
+    "sources": [
+      { "url": "https://example.com/pricing", "title": "Pricing", "type": "page" }
+    ]
+  }
+]
+```
+
+Inline attachment bytes are never included. `createdAt` is new in this
+release; it is sent to the worker along with the rest of each message, and the
+worker ignores it.
+
+## Privacy posture
+
+- **Export runs entirely in the browser.** No request is made, and your worker
+  never learns that a conversation was exported.
+- **A transcript contains whatever the conversation contains.** That includes
+  anything a visitor typed that the [PII plugin](/plugins/) did not redact.
+  Once it is a file or on the clipboard, it is outside the widget's control.
+- **The JSON can include attachment storage details.** With the
+  [R2 attachment backend](/configuration/attachments/), each stored attachment
+  carries its storage key and a signed URL that works until it expires. The
+  Markdown transcript leaves both out.
+- **A transcript is not evidence.** It is an editable text file, and a visitor
+  can type text into a message that looks like an assistant heading. If you
+  need a reliable record of what the assistant said, keep it on the worker
+  side.
+
+This is why the option exists and is off by default: leave it off for
+deployments where conversations should not leave the chat window.
+
+## Limitations
+
+- Copying needs a secure (HTTPS) page. In an `<iframe>`, the frame also needs
+  `allow="clipboard-write"`. Where copying is refused, the widget says so and
+  suggests downloading instead.
+- Some in-app browsers (the ones inside social media apps) silently block
+  downloads. The page cannot detect that. Copy still works there.
+- A Markdown viewer decides how raw HTML in a message is shown. The transcript
+  escapes HTML that could hide later messages, and leaves the rest as written.
diff --git a/docs/src/content/docs/configuration/localization.md b/docs/src/content/docs/configuration/localization.md
index 5c078e3..5b0ba56 100644
--- a/docs/src/content/docs/configuration/localization.md
+++ b/docs/src/content/docs/configuration/localization.md
@@ -50,6 +50,7 @@ window.ClaudiusConfig = {
 | Toggle / bubble | `openChat`, `dismissGreeting` |
 | Errors | `errorGeneric`, `errorConnection`, `errorTimeout`, `errorRateLimitMinute`, `errorRateLimitHour`, `errorRetry` |
 | [Voice](/configuration/voice/) | `voiceInput`, `voiceInputHold`, `voiceListening`, `voicePermissionDenied`, `voiceNoSpeech`, `voiceNoMicrophone`, `voiceUnavailable`, `readAloud`, `pauseReading`, `resumeReading`, `stopReading` |
+| [Conversation export](/configuration/conversation-export/) | `moreOptions`, `copyAsMarkdown`, `downloadAsMarkdown`, `downloadAsJson`, `copiedToClipboard`, `copyFailed`, `transcriptTitle`, `transcriptExported`, `transcriptUser`, `transcriptAssistant`, `transcriptAttachments`, `transcriptSources` |
 
 Note these localize the widget UI only. The AI's reply language follows the
 conversation and your [system prompt](/configuration/worker/#system-prompt) —
diff --git a/docs/src/content/docs/configuration/widget.md b/docs/src/content/docs/configuration/widget.md
index 29440be..e427440 100644
--- a/docs/src/content/docs/configuration/widget.md
+++ b/docs/src/content/docs/configuration/widget.md
@@ -28,6 +28,7 @@ attributes on the `<claudius-chat>` web component.
 | `plugins` | `ClaudiusPlugin[]` | `undefined` | Message middleware run around each send (`onBeforeSend` / `onAfterReceive` / `onError`); see [Plugins](/plugins/) |
 | `attachments` | `boolean \| AttachmentsOptions` | `false` | Let visitors attach images and PDFs; `true` for the defaults (5 MB, 5 files) or an object with `maxSizeBytes`, `maxCount`, `allowedTypes`. See [Attachments](/configuration/attachments/) |
 | `voice` | `boolean \| VoiceOptions` | `false` | Mic button for dictation and a read-aloud button on replies, using the browser's Web Speech API; `true` for the defaults or an object with `input`, `output`, `mode`, `autoSubmit`, `lang`. See [Voice](/configuration/voice/) |
+| `conversationExport` | `boolean` | `false` | Header menu that copies the conversation as Markdown, or downloads it as Markdown or JSON. Runs in the browser; nothing is sent to the worker. See [Conversation export](/configuration/conversation-export/) |
 
 ## Web component attributes
 
@@ -35,9 +36,11 @@ attributes on the `<claudius-chat>` web component.
 `api-url`, `title`, `subtitle`, `welcome-message`, `placeholder`,
 `persist-messages`, `storage-key-prefix`, `request-timeout-ms`, `theme`,
 `accent-color`, `position`, `attachments` (`attachments` or
-`attachments="true"` enables the defaults), and `voice` with its companions
+`attachments="true"` enables the defaults), `voice` with its companions
 `voice-mode`, `voice-auto-submit`, `voice-input`, `voice-output`, and
-`voice-lang` (see [Voice](/configuration/voice/#enable-voice)).
+`voice-lang` (see [Voice](/configuration/voice/#enable-voice)), and
+`conversation-export` (see
+[Conversation export](/configuration/conversation-export/#enabling-it)).
 
 ```html
 <claudius-chat
diff --git a/docs/src/content/docs/faq.md b/docs/src/content/docs/faq.md
index 9bcac6e..1aa69e9 100644
--- a/docs/src/content/docs/faq.md
+++ b/docs/src/content/docs/faq.md
@@ -52,6 +52,10 @@ API key can access, and `MAX_TOKENS` to control response length (default
   none reaches your worker. The visitor's browser does the listening, and most
   browsers send that audio to their own vendor (Google, Apple) to be
   recognized. Details in [Voice](/configuration/voice/#privacy-posture).
+- **Conversation export** (optional, off by default): copying or downloading a
+  transcript happens entirely in the visitor's browser. Nothing is sent to your
+  worker. Details in
+  [Conversation export](/configuration/conversation-export/#privacy-posture).
 
 ## How big is the embed?
 

From 99c3e2fcb135aa00ba1ccc5acb84d47c386af5da Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 03:02:30 -0400
Subject: [PATCH 20/28] chore(widget): raise bundle budgets for conversation
 export

Measured against main with size-limit: claudius.iife.js +10531 B raw, +3810 B gzip (3.8 KB), +2882 B brotli; claudius.js +14434 B raw, +4030 B gzip (4.0 KB), +3361 B brotli; claudius.css +509 B raw, +95 B gzip (0.1 KB), +71 B brotli. The cost is the header menu, the transcript serializer, and twelve strings in four locales. Limits are the measured sizes plus 5%.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 widget/.size-limit.json | 18 +++++++++---------
 1 file changed, 9 insertions(+), 9 deletions(-)

diff --git a/widget/.size-limit.json b/widget/.size-limit.json
index d656633..86c1f77 100644
--- a/widget/.size-limit.json
+++ b/widget/.size-limit.json
@@ -3,51 +3,51 @@
     "name": "claudius.iife.js (raw)",
     "path": "dist/claudius.iife.js",
     "brotli": false,
-    "limit": "220718 B"
+    "limit": "233284 B"
   },
   {
     "name": "claudius.iife.js (gzip)",
     "path": "dist/claudius.iife.js",
     "gzip": true,
-    "limit": "70681 B"
+    "limit": "75250 B"
   },
   {
     "name": "claudius.iife.js (brotli)",
     "path": "dist/claudius.iife.js",
-    "limit": "62039 B"
+    "limit": "65587 B"
   },
   {
     "name": "claudius.js (raw)",
     "path": "dist/claudius.js",
     "brotli": false,
-    "limit": "102759 B"
+    "limit": "120020 B"
   },
   {
     "name": "claudius.js (gzip)",
     "path": "dist/claudius.js",
     "gzip": true,
-    "limit": "28094 B"
+    "limit": "33058 B"
   },
   {
     "name": "claudius.js (brotli)",
     "path": "dist/claudius.js",
-    "limit": "24120 B"
+    "limit": "28237 B"
   },
   {
     "name": "claudius.css (raw)",
     "path": "dist/claudius.css",
     "brotli": false,
-    "limit": "24839 B"
+    "limit": "25835 B"
   },
   {
     "name": "claudius.css (gzip)",
     "path": "dist/claudius.css",
     "gzip": true,
-    "limit": "5305 B"
+    "limit": "5436 B"
   },
   {
     "name": "claudius.css (brotli)",
     "path": "dist/claudius.css",
-    "limit": "4677 B"
+    "limit": "4784 B"
   }
 ]

From 75f02da7013b633b4828fe00719db5a0fd06e366 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:02:48 -0400
Subject: [PATCH 21/28] refactor(widget): harden the transcript serializer

The fence scanner accepted a closing fence at any indentation. A message
that shows Markdown inside Markdown, with a fenced block indented under a
list item, had its outer block ended at the inner fence: the code after it
was escaped and given trailing spaces, breaking "code inside a fence is
never modified", and the leftover fence opened a block that swallowed the
next message. A closer now has to sit within three columns of its opener,
as CommonMark requires, with both indents measured in columns and tabs
expanded to four-column stops. Openers still accept any indentation.

Alongside it, six smaller defects in the same module:

- a source title escaped \, [ and ] but not <, so a title could emit its
  own autolink or a raw tag in a viewer that does not sanitize;
- a URL ending in \ escaped the paren that closes the link;
- a line-leading autolink such as <https://example.com/docs> was escaped
  as an HTML block start, which an autolink can never be;
- serialization threw on history that is not what the types promise.
  sessionStorage is restored unvalidated, so a non-string content, a null
  message or a malformed source, attachment or tool use reached the host
  page as an uncaught error with the menu already closed. Values are now
  coerced, lists guarded, and a time zone the engine rejects falls back to
  an ISO date instead of throwing out of the retry;
- trailing whitespace was trimmed with /[ \t]+$/, which backtracks
  quadratically: 50,000 spaces mid-line took seven seconds. A short loop
  does it in linear time;
- the no-break space normalization was applied twice, once per formatter
  branch, and only the injected branch had a test. Both now go through one
  wrapper, so that test covers the production path too.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 .../__tests__/exportConversation.test.ts      | 208 ++++++++++++++++++
 widget/src/utils/exportConversation.ts        | 151 ++++++++++---
 2 files changed, 329 insertions(+), 30 deletions(-)

diff --git a/widget/src/utils/__tests__/exportConversation.test.ts b/widget/src/utils/__tests__/exportConversation.test.ts
index 23c0031..27a63f5 100644
--- a/widget/src/utils/__tests__/exportConversation.test.ts
+++ b/widget/src/utils/__tests__/exportConversation.test.ts
@@ -64,6 +64,49 @@ describe("protectMessageText", () => {
         "```js\nconst a = 1;\n```",
       );
     });
+
+    it("does not end a fence at a fence four columns further in", () => {
+      // Markdown about Markdown: the inner block belongs to the list item and
+      // is indented past it. CommonMark reads a run four or more columns
+      // beyond its container as code, so it cannot close the outer block.
+      const text = [
+        "```markdown",
+        "1. Add the snippet:",
+        "",
+        "    ```html",
+        "    <p>hi</p>",
+        "    ```",
+        "",
+        "<details>",
+        "<summary>More</summary>",
+        "```",
+      ].join("\n");
+      expect(protectMessageText(text)).toBe(text);
+    });
+
+    it("keeps scanning past a run of fence characters indented out of reach", () => {
+      expect(protectMessageText("```\ncode\n    ```\nmore\n```")).toBe(
+        "```\ncode\n    ```\nmore\n```",
+      );
+    });
+
+    it("ends a fence at a closer up to three columns further in", () => {
+      expect(protectMessageText("1. Run:\n\n   ```\n   npm i\n      ```")).toBe(
+        "1. Run:\n\n   ```\n   npm i\n      ```",
+      );
+    });
+
+    it("measures both indents in columns, with tabs at four-column stops", () => {
+      // One tab is four columns, so this closer is out of the opener's reach.
+      expect(protectMessageText("```\ncode\n\t```")).toBe(
+        "```\ncode\n\t```\n```",
+      );
+      // Seven spaces are three columns past a tab-indented opener, so they
+      // are still within it.
+      expect(protectMessageText("\t```\n\tcode\n       ```\nnext")).toBe(
+        "\t```\n\tcode\n       ```\nnext",
+      );
+    });
   });
 
   describe("hard line breaks", () => {
@@ -102,6 +145,26 @@ describe("protectMessageText", () => {
       );
       expect(protectMessageText("< 5 items")).toBe("< 5 items");
     });
+
+    it("leaves a line-leading autolink alone, which cannot open a block", () => {
+      expect(protectMessageText("<https://example.com/docs>")).toBe(
+        "<https://example.com/docs>",
+      );
+      expect(protectMessageText("<mailto:a@b.co>")).toBe("<mailto:a@b.co>");
+      expect(protectMessageText("<help@example.com>")).toBe(
+        "<help@example.com>",
+      );
+    });
+  });
+
+  it("trims trailing whitespace without backtracking over it", () => {
+    // A long run of spaces that is not at the end of the line makes a
+    // backtracking regex quadratic. The bound is generous on purpose: this
+    // pins the shape of the algorithm, not the speed of the machine.
+    const line = "a" + " ".repeat(50_000) + "b";
+    const started = performance.now();
+    expect(protectMessageText(`${line}   \nnext`)).toBe(`${line}  \nnext`);
+    expect(performance.now() - started).toBeLessThan(1000);
   });
 
   it("normalizes CRLF and drops trailing blank lines", () => {
@@ -333,6 +396,52 @@ describe("conversationToMarkdown", () => {
     );
   });
 
+  it("escapes a < in a title, so it cannot autolink or emit raw HTML", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "x",
+          sources: [
+            {
+              title: "<javascript:alert(1)>",
+              url: "https://ok.example/",
+              type: "page",
+            },
+            {
+              title: "<img src=x onerror=alert(1)>",
+              url: "https://ok.example/",
+              type: "page",
+            },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("1. [\\<javascript:alert(1)>](https://ok.example/)");
+    expect(md).toContain(
+      "2. [\\<img src=x onerror=alert(1)>](https://ok.example/)",
+    );
+  });
+
+  it("encodes a backslash in a URL, which would escape the closing paren", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "x",
+          sources: [
+            { title: "Docs", url: "https://example.com/a\\", type: "page" },
+          ],
+        },
+      ],
+      base,
+    );
+    expect(md).toContain("1. [Docs](https://example.com/a%5C)");
+  });
+
   it("drops the link, not the citation, when a URL is not http(s)", () => {
     const md = conversationToMarkdown(
       [
@@ -358,6 +467,105 @@ describe("conversationToMarkdown", () => {
   });
 });
 
+// `loadMessages` hands back whatever sessionStorage held, unvalidated, so
+// every shape JSON.parse can produce has to come out as a file, not a throw
+// on the host page.
+describe("history that is not what the types promise", () => {
+  const cases: Array<[string, unknown[]]> = [
+    ["a number for content", [{ id: "1", role: "user", content: 42 }]],
+    ["an object for content", [{ id: "1", role: "user", content: { a: 1 } }]],
+    ["an array for content", [{ id: "1", role: "user", content: ["a"] }]],
+    ["a null message", [null]],
+    ["a string for a whole message", ["hi"]],
+    [
+      "sources that are not a list",
+      [{ id: "1", role: "assistant", content: "x", sources: { length: 1 } }],
+    ],
+    [
+      "an empty source",
+      [{ id: "1", role: "assistant", content: "x", sources: [{}] }],
+    ],
+    [
+      "a null source",
+      [{ id: "1", role: "assistant", content: "x", sources: [null] }],
+    ],
+    [
+      "a number for a source title",
+      [
+        {
+          id: "1",
+          role: "assistant",
+          content: "x",
+          sources: [{ title: 5, url: "https://a.b" }],
+        },
+      ],
+    ],
+    [
+      "an empty attachment",
+      [{ id: "1", role: "user", content: "x", attachments: [{}] }],
+    ],
+    [
+      "a null attachment",
+      [{ id: "1", role: "user", content: "x", attachments: [null] }],
+    ],
+    [
+      "an empty tool use",
+      [{ id: "1", role: "assistant", content: "x", toolUses: [{}] }],
+    ],
+    [
+      "tool uses that are not a list",
+      [{ id: "1", role: "assistant", content: "x", toolUses: "abc" }],
+    ],
+  ];
+
+  it.each(cases)("exports %s", (_name, messages) => {
+    const list = messages as ChatMessage[];
+    expect(conversationToMarkdown(list, base)).toContain("# Chat transcript");
+    expect(JSON.parse(conversationToJson(list))).toBeInstanceOf(Array);
+  });
+
+  it("writes a content that is not a string as text", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: 42 } as unknown as ChatMessage],
+      base,
+    );
+    expect(md).toContain("## User\n\n42");
+  });
+
+  it("skips an entry that is not a message at all", () => {
+    const md = conversationToMarkdown(
+      [null, { id: "1", role: "user", content: "Hi" }] as ChatMessage[],
+      base,
+    );
+    expect(md).toContain("## User\n\nHi");
+    expect(md.match(/^## /gm)).toHaveLength(1);
+  });
+
+  it("lists an attachment whose fields are missing, with no bytes to show", () => {
+    const md = conversationToMarkdown(
+      [
+        {
+          id: "1",
+          role: "user",
+          content: "x",
+          attachments: [{}],
+        } as unknown as ChatMessage,
+      ],
+      base,
+    );
+    expect(md).toContain("Attachments:\n\n- ");
+    expect(md).toContain("0 B");
+  });
+
+  it("falls back to an ISO date where the engine rejects the time zone", () => {
+    const md = conversationToMarkdown(
+      [{ id: "1", role: "user", content: "Hi", createdAt: T }],
+      { ...base, timeZone: "Not/AZone" },
+    );
+    expect(md).toContain("## User · 2026-09-19T14:03:00.000Z");
+  });
+});
+
 describe("conversationToJson", () => {
   const messages: ChatMessage[] = [
     {
diff --git a/widget/src/utils/exportConversation.ts b/widget/src/utils/exportConversation.ts
index 20d882d..460fac5 100644
--- a/widget/src/utils/exportConversation.ts
+++ b/widget/src/utils/exportConversation.ts
@@ -32,15 +32,38 @@ export interface MarkdownExportOptions {
 
 interface OpenFence {
   indent: string;
+  /** The opener's indentation in columns, tabs expanded. */
+  indentColumns: number;
   char: string;
   length: number;
 }
 
 const FENCE_OPEN = /^([ \t]*)(`{3,}|~{3,})(.*)$/;
 // A line-leading "<" that CommonMark could read as the start of an HTML block.
-const HTML_BLOCK_START = /^( {0,3})<(?=[A-Za-z!?/])/;
+// An autolink (<scheme:host/path> or <user@host>) never opens one, and
+// escaping it would show the brackets and link the wrong destination.
+const HTML_BLOCK_START =
+  /^( {0,3})<(?![A-Za-z][A-Za-z0-9+.-]{1,31}:[^<>\s]*>|[^\s<>@]+@[^\s<>]+>)(?=[A-Za-z!?/])/;
 const INDENTED = /^(?: {4}|\t)/;
 
+/** Leading whitespace as columns, with tabs at four-column stops. */
+function indentColumns(line: string): number {
+  let columns = 0;
+  for (const ch of line) {
+    if (ch === " ") columns += 1;
+    else if (ch === "\t") columns += 4 - (columns % 4);
+    else break;
+  }
+  return columns;
+}
+
+/** `line` without its trailing spaces and tabs. Linear, unlike a regex. */
+function trimTrailingSpace(line: string): string {
+  let end = line.length;
+  while (end > 0 && (line[end - 1] === " " || line[end - 1] === "\t")) end -= 1;
+  return end === line.length ? line : line.slice(0, end);
+}
+
 /**
  * CommonMark fences, except that any indentation is accepted: models indent
  * fences inside list items all the time and almost never write indented code.
@@ -52,17 +75,27 @@ function parseFenceOpen(line: string): OpenFence | null {
   // A backtick fence's info string cannot contain a backtick. Such a line is
   // inline code that happens to start the line.
   if (run[0] === "`" && info.includes("`")) return null;
-  return { indent, char: run[0], length: run.length };
+  return {
+    indent,
+    indentColumns: indentColumns(indent),
+    char: run[0],
+    length: run.length,
+  };
 }
 
-/** A closer is the opener's character alone, at least as many times. */
+/**
+ * A closer is the opener's character alone, at least as many times, and
+ * indented at most three columns beyond the opener. CommonMark reads a run
+ * four or more columns past its container as code, so without the indent
+ * limit a fence inside a Markdown example would end the block around it.
+ */
 function closesFence(line: string, fence: OpenFence): boolean {
   const trimmed = line.trim();
   if (trimmed.length < fence.length) return false;
   for (const ch of trimmed) {
     if (ch !== fence.char) return false;
   }
-  return true;
+  return indentColumns(line) <= fence.indentColumns + 3;
 }
 
 /**
@@ -112,7 +145,7 @@ export function protectMessageText(text: string): string {
       !INDENTED.test(line) &&
       // Already a hard break.
       !line.endsWith("\\");
-    if (breakable) result = result.replace(/[ \t]+$/, "") + "  ";
+    if (breakable) result = trimTrailingSpace(result) + "  ";
     out.push(result);
   }
 
@@ -127,7 +160,7 @@ export function protectMessageText(text: string): string {
     // Pop trailing blank lines, then trim trailing spaces from the new last line.
     while (out.length > 0 && out[out.length - 1].trim() === "") out.pop();
     if (out.length > 0) {
-      out[out.length - 1] = out[out.length - 1].replace(/[ \t]+$/, "");
+      out[out.length - 1] = trimTrailingSpace(out[out.length - 1]);
     }
   }
 
@@ -138,11 +171,10 @@ export function protectMessageText(text: string): string {
 // space but breaks string comparison and some plain-text tools.
 const NO_BREAK_SPACES = /[\u00a0\u202f]/g;
 
-function makeDateFormatter(
+function rawDateFormatter(
   options: MarkdownExportOptions,
 ): (date: Date) => string {
-  const custom = options.formatDate;
-  if (custom) return (date) => custom(date).replace(NO_BREAK_SPACES, " ");
+  if (options.formatDate) return options.formatDate;
 
   const build = (locale?: string) =>
     new Intl.DateTimeFormat(locale, {
@@ -150,13 +182,34 @@ function makeDateFormatter(
       timeStyle: "short",
       timeZone: options.timeZone,
     });
-  let formatter: Intl.DateTimeFormat;
+  let built: Intl.DateTimeFormat | null = null;
   try {
-    formatter = build(options.locale);
+    built = build(options.locale);
   } catch {
-    formatter = build(undefined);
+    try {
+      // The tag was rejected. The retry can fail in its turn, on an engine
+      // that does not know the time zone, and a date is not worth a throw.
+      built = build(undefined);
+    } catch {
+      built = null;
+    }
   }
-  return (date) => formatter.format(date).replace(NO_BREAK_SPACES, " ");
+  const formatter = built;
+  return formatter
+    ? (date) => formatter.format(date)
+    : (date) => date.toISOString();
+}
+
+/**
+ * Both the built-in and the injected formatter go through one wrapper, so
+ * the no-break space normalization is applied, and covered by its test,
+ * whichever one is in use.
+ */
+function makeDateFormatter(
+  options: MarkdownExportOptions,
+): (date: Date) => string {
+  const format = rawDateFormatter(options);
+  return (date) => format(date).replace(NO_BREAK_SPACES, " ");
 }
 
 /**
@@ -198,25 +251,46 @@ const URL_ESCAPES: Record<string, string> = {
   ")": "%29",
   "<": "%3C",
   ">": "%3E",
+  "\\": "%5C",
 };
 
 function sourceLine(source: Source, index: number): string {
-  // The title must not close the link text or span lines.
-  const title = (source.title || source.url)
+  // The title must not close the link text, span lines, start an autolink,
+  // or open a tag a viewer would render.
+  const title = asText(source.title || source.url)
     .replace(/\s+/g, " ")
     .trim()
-    .replace(/[\\[\]]/g, "\\$&");
-  const safe = sanitizeUrl(source.url);
+    .replace(/[\\[\]<]/g, "\\$&");
+  const safe = sanitizeUrl(asText(source.url));
   if (!safe) return `${index + 1}. ${title}`;
-  // Nor may the URL end the link destination.
+  // Nor may the URL end the link destination, or escape the paren that does.
   const url = safe
-    .replace(/[()<>]/g, (ch) => URL_ESCAPES[ch])
+    .replace(/[()<>\\]/g, (ch) => URL_ESCAPES[ch])
     .replace(/\s/g, "%20");
   return `${index + 1}. [${title}](${url})`;
 }
 
 function attachmentLine(attachment: ChatAttachment): string {
-  return `- ${codeSpan(attachment.name)} (${attachment.mediaType}, ${formatBytes(attachment.size)})`;
+  const name = codeSpan(asText(attachment.name));
+  const size = formatBytes(Number(attachment.size));
+  return `- ${name} (${asText(attachment.mediaType)}, ${size})`;
+}
+
+/**
+ * A value as text. Persisted history is restored from `sessionStorage`
+ * without validation, so any field can hold anything `JSON.parse` produces,
+ * and an export must still be a file rather than a throw on the host page.
+ */
+function asText(value: unknown): string {
+  return typeof value === "string" ? value : String(value ?? "");
+}
+
+/** The entries of a field that should hold a list of objects. */
+function objectsIn<T>(value: unknown): T[] {
+  if (!Array.isArray(value)) return [];
+  return value.filter(
+    (entry) => entry !== null && typeof entry === "object",
+  ) as T[];
 }
 
 /**
@@ -240,6 +314,8 @@ export function conversationToMarkdown(
   ];
 
   for (const message of messages) {
+    if (message === null || typeof message !== "object") continue;
+
     const role = message.role === "user" ? labels.user : labels.assistant;
     const created = message.createdAt ? new Date(message.createdAt) : null;
     const time =
@@ -248,24 +324,29 @@ export function conversationToMarkdown(
         : "";
     blocks.push(`## ${role}${time}`);
 
-    const text = protectMessageText(message.content ?? "");
-    if (text) blocks.push(text);
+    const body = protectMessageText(asText(message.content));
+    if (body) blocks.push(body);
 
-    if (message.attachments?.length) {
+    const attachments = objectsIn<ChatAttachment>(message.attachments);
+    if (attachments.length) {
       blocks.push(
         labels.attachments,
-        message.attachments.map(attachmentLine).join("\n"),
+        attachments.map(attachmentLine).join("\n"),
       );
     }
-    if (message.toolUses?.length) {
+    const toolUses = objectsIn<{ name?: string }>(message.toolUses);
+    if (toolUses.length) {
       blocks.push(
-        message.toolUses
-          .map((toolUse) => `${labels.toolUsed} ${codeSpan(toolUse.name)}`)
+        toolUses
+          .map(
+            (toolUse) => `${labels.toolUsed} ${codeSpan(asText(toolUse.name))}`,
+          )
           .join("  \n"),
       );
     }
-    if (message.sources?.length) {
-      blocks.push(labels.sources, message.sources.map(sourceLine).join("\n"));
+    const sources = objectsIn<Source>(message.sources);
+    if (sources.length) {
+      blocks.push(labels.sources, sources.map(sourceLine).join("\n"));
     }
   }
 
@@ -277,7 +358,17 @@ export function conversationToMarkdown(
  * means without inline attachment bytes.
  */
 export function conversationToJson(messages: readonly ChatMessage[]): string {
-  return JSON.stringify(stripAttachmentData([...messages]), null, 2) + "\n";
+  const usable = messages
+    .filter((message) => message !== null && typeof message === "object")
+    .map((message) =>
+      message.attachments === undefined
+        ? message
+        : {
+            ...message,
+            attachments: objectsIn<ChatAttachment>(message.attachments),
+          },
+    );
+  return JSON.stringify(stripAttachmentData(usable), null, 2) + "\n";
 }
 
 /** `chat-transcript-YYYY-MM-DD.<extension>`, by the visitor's local date. */

From c1fbf0040a1df89db4b395e456b0519fc9f3c975 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:03:52 -0400
Subject: [PATCH 22/28] refactor(widget): keep a blur with no relatedTarget
 from closing the menu

Pressing the trigger while the menu is open reopened it in WebKit, so the
menu could not be closed that way. WebKit does not focus a button when it
is clicked, so the press blurs the focused item with relatedTarget null;
onMenuBlur read that as focus leaving the menu and closed it, React
re-rendered, and the click then saw open === false and opened it again.
The handler now returns on a null relatedTarget and only judges a real
next target. Outside presses were already the pointerdown listener's job,
so the only behaviour given up is closing when focus leaves the page.

The test replays that event order by hand, because jsdom and user-event
both focus a button on click, the way Chrome does, and the Playwright spec
runs only in chromium-desktop.

Also rewords the comment beside the menu's tabIndex -1. It said the focus
trap skips tabindex -1, which is true of the role="menu" div but reads as
if it were about the item buttons, and the trap's selector does match
those. What makes them safe is that they are never the dialog's first or
last focusable control.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 widget/src/components/HeaderMenu.tsx            | 17 +++++++++++++----
 .../components/__tests__/HeaderMenu.test.tsx    | 17 +++++++++++++++++
 2 files changed, 30 insertions(+), 4 deletions(-)

diff --git a/widget/src/components/HeaderMenu.tsx b/widget/src/components/HeaderMenu.tsx
index 2e9da29..e79a650 100644
--- a/widget/src/components/HeaderMenu.tsx
+++ b/widget/src/components/HeaderMenu.tsx
@@ -130,12 +130,18 @@ export function HeaderMenu({ label, items, onOpen }: HeaderMenuProps) {
   };
 
   const onMenuBlur = (event: FocusEvent<HTMLDivElement>) => {
+    const next = event.relatedTarget as Node | null;
+    // No relatedTarget means focus went somewhere this handler cannot judge.
+    // In WebKit that is what pressing the trigger looks like, because it does
+    // not focus a button on click: closing here would let the press that
+    // followed reopen the menu in onClick. Outside presses are the
+    // pointerdown listener's job, so the only thing given up is closing when
+    // focus leaves the page altogether, which no one is waiting for.
+    if (!next) return;
     // Focus left the menu entirely: a Tab, or a click on another control.
     // Moving to the trigger does not count, or a click on it would close the
     // menu here and then reopen it in onClick.
-    if (!rootRef.current?.contains(event.relatedTarget as Node | null)) {
-      setOpen(false);
-    }
+    if (!rootRef.current?.contains(next)) setOpen(false);
   };
 
   return (
@@ -170,7 +176,10 @@ export function HeaderMenu({ label, items, onOpen }: HeaderMenuProps) {
           role="menu"
           aria-labelledby={triggerId}
           // Focusable by script only, as an element with handlers must be.
-          // The focus trap skips tabindex -1.
+          // The dialog's focus trap does not count it, because it looks for
+          // buttons. It does count the items below, which is harmless: they
+          // are never the dialog's first or last focusable control, and that
+          // is all the trap looks at.
           tabIndex={-1}
           onKeyDown={onMenuKeyDown}
           onBlur={onMenuBlur}
diff --git a/widget/src/components/__tests__/HeaderMenu.test.tsx b/widget/src/components/__tests__/HeaderMenu.test.tsx
index 60d1595..be00423 100644
--- a/widget/src/components/__tests__/HeaderMenu.test.tsx
+++ b/widget/src/components/__tests__/HeaderMenu.test.tsx
@@ -174,4 +174,21 @@ describe("HeaderMenu", () => {
     await user.click(trigger);
     expect(screen.queryByRole("menu")).toBeNull();
   });
+
+  it("closes on a second press of a trigger that the press does not focus", () => {
+    // WebKit does not focus a button when it is clicked, so pressing the
+    // trigger blurs the focused item with no relatedTarget. user-event and
+    // jsdom both focus a button the way Chrome does, so that order has to be
+    // replayed by hand.
+    const { trigger } = setup();
+    fireEvent.click(trigger);
+    const copy = screen.getByRole("menuitem", { name: "Copy" });
+    expect(copy).toHaveFocus();
+
+    fireEvent.pointerDown(trigger);
+    fireEvent.blur(copy);
+    fireEvent.click(trigger);
+
+    expect(screen.queryByRole("menu")).toBeNull();
+  });
 });

From a6bb80598fd1e82c8f2d9b8e95b383d3afef3fff Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:04:44 -0400
Subject: [PATCH 23/28] refactor(widget): let the clipboard fallback fail
 without throwing

Only execCommand was inside legacyCopy's try. The DOM calls before it were
not, and copyText's `return legacyCopy(text)` sits outside copyText's own
try, so a document that refuses createElement, appendChild, focus or select
turned a copy into an unhandled rejection on the host page and left the
hidden textarea in the DOM with the visitor's focus inside it. The whole
body is now in the try, so the function always answers with a boolean, and
the textarea is removed and focus restored in a finally.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 widget/src/utils/__tests__/saveText.test.ts | 16 +++++++
 widget/src/utils/saveText.ts                | 47 ++++++++++++---------
 2 files changed, 43 insertions(+), 20 deletions(-)

diff --git a/widget/src/utils/__tests__/saveText.test.ts b/widget/src/utils/__tests__/saveText.test.ts
index bd62445..3e07be2 100644
--- a/widget/src/utils/__tests__/saveText.test.ts
+++ b/widget/src/utils/__tests__/saveText.test.ts
@@ -76,6 +76,22 @@ describe("copyText", () => {
     await expect(copyText("hello")).resolves.toBe(false);
   });
 
+  it("resolves false and tidies up when the DOM itself refuses", async () => {
+    const button = document.createElement("button");
+    document.body.appendChild(button);
+    button.focus();
+    // A locked-down document can refuse any step of the fallback, not just
+    // the copy command.
+    vi.spyOn(HTMLTextAreaElement.prototype, "select").mockImplementation(() => {
+      throw new Error("blocked");
+    });
+    (document as Doc).execCommand = vi.fn(() => true);
+
+    await expect(copyText("hello")).resolves.toBe(false);
+    expect(document.querySelector("textarea")).toBeNull();
+    expect(document.activeElement).toBe(button);
+  });
+
   it("returns focus to where it was after the fallback", async () => {
     const button = document.createElement("button");
     document.body.appendChild(button);
diff --git a/widget/src/utils/saveText.ts b/widget/src/utils/saveText.ts
index 380697a..0d176e6 100644
--- a/widget/src/utils/saveText.ts
+++ b/widget/src/utils/saveText.ts
@@ -1,28 +1,35 @@
-/** Copy through a hidden textarea, for where the async API is unavailable. */
+/**
+ * Copy through a hidden textarea, for where the async API is unavailable.
+ * Every step is inside the try, not just the copy command: a locked-down
+ * document can refuse any of them, and this is the caller's last resort, so
+ * it answers with `false` rather than throwing on the host page.
+ */
 function legacyCopy(text: string): boolean {
   const previous = document.activeElement as HTMLElement | null;
-  const area = document.createElement("textarea");
-  area.value = text;
-  area.setAttribute("readonly", "");
-  area.setAttribute("aria-hidden", "true");
-  area.style.position = "fixed";
-  area.style.top = "0";
-  area.style.left = "0";
-  area.style.opacity = "0";
-  document.body.appendChild(area);
-  // select() alone does not focus the field everywhere (iOS Safari), and the
-  // copy command acts on the focused element's selection.
-  area.focus({ preventScroll: true });
-  area.select();
-  let ok = false;
+  let area: HTMLTextAreaElement | null = null;
   try {
-    ok = document.execCommand("copy");
+    area = document.createElement("textarea");
+    area.value = text;
+    area.setAttribute("readonly", "");
+    area.setAttribute("aria-hidden", "true");
+    area.style.position = "fixed";
+    area.style.top = "0";
+    area.style.left = "0";
+    area.style.opacity = "0";
+    document.body.appendChild(area);
+    // select() alone does not focus the field everywhere (iOS Safari), and the
+    // copy command acts on the focused element's selection.
+    area.focus({ preventScroll: true });
+    area.select();
+    return document.execCommand("copy");
   } catch {
-    ok = false;
+    return false;
+  } finally {
+    // In a finally, so a refusal cannot leave the textarea on the page or
+    // the visitor's focus inside it.
+    area?.remove();
+    previous?.focus();
   }
-  area.remove();
-  previous?.focus();
-  return ok;
 }
 
 /**

From c776849329db4a6abbd554d8a70c95481f6ee219 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:05:48 -0400
Subject: [PATCH 24/28] refactor(widget): prove what the mounted guard actually
 prevents

The test named "does not set state after unmount" could not fail: React
18.3.1 has no warning for a state update on an unmounted component, and
removing the guard left the test green. What the guard really prevents is
a four-second status timer armed on a page whose chat window has already
closed. The test now resolves the copy after unmount under fake timers and
asserts vi.getTimerCount() is 0, which does fail with the guard removed,
and its name says so.

Also records why the effect re-arms mounted.current instead of relying on
the ref's initial value: React 18 Strict Mode mounts, cleans up, and mounts
again, and without the reassignment the flag would stay false.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 widget/src/hooks/__tests__/useConversationExport.test.ts | 7 ++++++-
 widget/src/hooks/useConversationExport.ts                | 3 +++
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/widget/src/hooks/__tests__/useConversationExport.test.ts b/widget/src/hooks/__tests__/useConversationExport.test.ts
index 7cb8ba4..6847d85 100644
--- a/widget/src/hooks/__tests__/useConversationExport.test.ts
+++ b/widget/src/hooks/__tests__/useConversationExport.test.ts
@@ -156,7 +156,11 @@ describe("useConversationExport", () => {
     expect(result.current.status).toBe("In die Zwischenablage kopiert");
   });
 
-  it("does not set state after unmount", async () => {
+  it("arms no status timer when the copy settles after unmount", async () => {
+    // React 18 does not warn about a state update on an unmounted component,
+    // so what the mounted guard really prevents is a four-second timer left
+    // running on a page whose chat window has closed.
+    vi.useFakeTimers({ toFake: ["setTimeout", "clearTimeout"] });
     let resolve!: (ok: boolean) => void;
     vi.mocked(copyText).mockReturnValue(new Promise((r) => (resolve = r)));
     const { result, unmount } = renderHook(() => useConversationExport(base));
@@ -166,5 +170,6 @@ describe("useConversationExport", () => {
     await act(async () => resolve(true));
 
     expect(result.current.status).toBeNull();
+    expect(vi.getTimerCount()).toBe(0);
   });
 });
diff --git a/widget/src/hooks/useConversationExport.ts b/widget/src/hooks/useConversationExport.ts
index 507a400..48cb269 100644
--- a/widget/src/hooks/useConversationExport.ts
+++ b/widget/src/hooks/useConversationExport.ts
@@ -46,6 +46,9 @@ export function useConversationExport({
   const mounted = useRef(true);
 
   useEffect(() => {
+    // Set here, not only at the ref's creation: React 18 Strict Mode mounts,
+    // runs the cleanup, and mounts again, which would otherwise leave this
+    // false for the whole life of the component.
     mounted.current = true;
     return () => {
       mounted.current = false;

From 59b6e854aced8987e4dc3f929eeadf3902948bb3 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:08:42 -0400
Subject: [PATCH 25/28] refactor(widget): accept only true for the
 conversation-export attribute

The attribute enabled the feature on any value but the exact string
"false", copying `attachments`. That is wrong for a privacy switch: a
Python or Jinja template renders a false value as "False", and "0" and
"no" are just as plausible, and all three switched export on. It now
enables only when the attribute is present and its value, trimmed and
lowercased, is "" or "true". `attachments` and `voice` are unchanged.

The embed tests could not see any of this. Mutating embed.tsx so an
ABSENT attribute enabled the feature left all ten of them green, although
"off means nothing changes" is the feature's first requirement. There are
now cases for the attribute absent and for the key absent from
ClaudiusConfig, plus every accepted and rejected value, and the test whose
title claimed "and when absent" while mounting only "false" is split.

Each negative assertion is now anchored by the open dialog, in the embed
tests and in ChatWidget.export.test.tsx: without it they would have passed
just as happily if the chat had never opened. ChatWindow's "puts the menu
in the header" checked indexOf("More options") === indexOf("Close chat")
- 1, which -1 === 0 - 1 satisfies when neither button is there, so it now
asserts both are present first.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 widget/src/__tests__/embed.test.tsx           | 59 ++++++++++++++-----
 .../__tests__/ChatWidget.export.test.tsx      | 10 +++-
 .../__tests__/ChatWindow.export.test.tsx      |  4 ++
 widget/src/embed.tsx                          | 10 +++-
 4 files changed, 64 insertions(+), 19 deletions(-)

diff --git a/widget/src/__tests__/embed.test.tsx b/widget/src/__tests__/embed.test.tsx
index 7238c95..da4ae7a 100644
--- a/widget/src/__tests__/embed.test.tsx
+++ b/widget/src/__tests__/embed.test.tsx
@@ -154,6 +154,12 @@ describe("embed conversationExport option", () => {
     document.body.appendChild(el);
   }
 
+  /** The open dialog, so an absent menu cannot be a chat that never opened. */
+  function expectNoMenu() {
+    expect(screen.getByRole("dialog")).toBeInTheDocument();
+    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+  }
+
   it("enables the header menu from ClaudiusConfig", async () => {
     window.ClaudiusConfig = {
       apiUrl: "https://test.example/api",
@@ -166,6 +172,13 @@ describe("embed conversationExport option", () => {
     ).toBeInTheDocument();
   });
 
+  it("stays off when ClaudiusConfig does not mention it", async () => {
+    window.ClaudiusConfig = { apiUrl: "https://test.example/api" };
+    await import("../embed");
+    await openChat();
+    expectNoMenu();
+  });
+
   it("stays off for a templated string in ClaudiusConfig", async () => {
     window.ClaudiusConfig = {
       apiUrl: "https://test.example/api",
@@ -173,22 +186,38 @@ describe("embed conversationExport option", () => {
     };
     await import("../embed");
     await openChat();
-    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
-  });
-
-  it("enables it via the web component attribute", async () => {
+    expectNoMenu();
+  });
+
+  // The attribute is stricter than `attachments` and `voice`, which take any
+  // value but "false": a privacy switch has to fail closed for whatever a
+  // template renders, and "False" is what Python and Jinja produce.
+  it.each([[""], ["true"], ["TRUE"], [" true "]])(
+    "enables it for conversation-export=%j",
+    async (value) => {
+      await import("../embed");
+      mountElement({ "conversation-export": value });
+      await openChat();
+      expect(
+        screen.getByRole("button", { name: "More options" }),
+      ).toBeInTheDocument();
+    },
+  );
+
+  it.each([["false"], ["False"], ["0"], ["no"], ["yes"], ["1"]])(
+    "stays off for conversation-export=%j",
+    async (value) => {
+      await import("../embed");
+      mountElement({ "conversation-export": value });
+      await openChat();
+      expectNoMenu();
+    },
+  );
+
+  it("stays off when the attribute is absent", async () => {
     await import("../embed");
-    mountElement({ "conversation-export": "" });
+    mountElement({});
     await openChat();
-    expect(
-      screen.getByRole("button", { name: "More options" }),
-    ).toBeInTheDocument();
-  });
-
-  it('stays off for conversation-export="false", and when absent', async () => {
-    await import("../embed");
-    mountElement({ "conversation-export": "false" });
-    await openChat();
-    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    expectNoMenu();
   });
 });
diff --git a/widget/src/components/__tests__/ChatWidget.export.test.tsx b/widget/src/components/__tests__/ChatWidget.export.test.tsx
index 0578a18..28204d5 100644
--- a/widget/src/components/__tests__/ChatWidget.export.test.tsx
+++ b/widget/src/components/__tests__/ChatWidget.export.test.tsx
@@ -10,11 +10,17 @@ async function openChat() {
   await userEvent.setup().click(screen.getByRole("button"));
 }
 
+/** The open dialog, so an absent menu cannot be a chat that never opened. */
+function expectNoMenu() {
+  expect(screen.getByRole("dialog")).toBeInTheDocument();
+  expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+}
+
 describe("ChatWidget conversationExport option", () => {
   it("is off by default", async () => {
     render(<ChatWidget apiUrl="https://test.workers.dev" locale="en" />);
     await openChat();
-    expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+    expectNoMenu();
   });
 
   it("shows the header menu when enabled", async () => {
@@ -42,7 +48,7 @@ describe("ChatWidget conversationExport option", () => {
         />,
       );
       await openChat();
-      expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
+      expectNoMenu();
     },
   );
 
diff --git a/widget/src/components/__tests__/ChatWindow.export.test.tsx b/widget/src/components/__tests__/ChatWindow.export.test.tsx
index b565330..673ac5e 100644
--- a/widget/src/components/__tests__/ChatWindow.export.test.tsx
+++ b/widget/src/components/__tests__/ChatWindow.export.test.tsx
@@ -30,6 +30,7 @@ function renderWindow(
 describe("ChatWindow conversation export", () => {
   it("renders no menu and no extra status region by default", () => {
     renderWindow({ conversationExport: false });
+    expect(screen.getByRole("dialog")).toBeInTheDocument();
     expect(screen.queryByRole("button", { name: "More options" })).toBeNull();
     expect(screen.queryByRole("status")).toBeNull();
   });
@@ -38,6 +39,9 @@ describe("ChatWindow conversation export", () => {
     renderWindow();
     const buttons = within(screen.getByRole("dialog")).getAllByRole("button");
     const names = buttons.map((b) => b.getAttribute("aria-label"));
+    // Both present first: two absent buttons would also satisfy -1 === 0 - 1.
+    expect(names.indexOf("More options")).toBeGreaterThanOrEqual(0);
+    expect(names.indexOf("Close chat")).toBeGreaterThanOrEqual(0);
     expect(names.indexOf("More options")).toBe(names.indexOf("Close chat") - 1);
   });
 
diff --git a/widget/src/embed.tsx b/widget/src/embed.tsx
index 7d1279a..5c0e463 100644
--- a/widget/src/embed.tsx
+++ b/widget/src/embed.tsx
@@ -153,10 +153,16 @@ class ClaudiusChat extends HTMLElement {
     const attachments =
       attachmentsAttr === null ? undefined : attachmentsAttr !== "false";
 
-    // `conversation-export` / `="true"` enables it; "false" or absent does not.
+    // Stricter than `attachments` above, which takes any value but "false".
+    // Only `conversation-export` on its own or `="true"` enables it: a
+    // privacy switch has to fail closed for whatever a template renders, and
+    // "False" is what a Python or Jinja template writes for a false value.
     const exportAttr = this.getAttribute("conversation-export");
+    const exportValue = exportAttr?.trim().toLowerCase();
     const conversationExport =
-      exportAttr === null ? undefined : exportAttr !== "false";
+      exportAttr === null
+        ? undefined
+        : exportValue === "" || exportValue === "true";
 
     this.root.render(
       <ChatWidget

From 9301008ddac80e41d537d31f5b2075538d6ed5cd Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:09:11 -0400
Subject: [PATCH 26/28] refactor(widget): shorten the German copy-failure
 message

"Kopieren nicht moeglich. Laden Sie die Unterhaltung stattdessen
herunter." wrapped to two lines inside the status pill, which is fully
rounded and sized for one. The shorter wording says the same thing in the
same formal register and fits. Nothing asserted the old text; the locale
parity test only requires the key to be non-empty.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 widget/src/locales/de.ts | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/widget/src/locales/de.ts b/widget/src/locales/de.ts
index c50e9c6..25776d8 100644
--- a/widget/src/locales/de.ts
+++ b/widget/src/locales/de.ts
@@ -53,8 +53,7 @@ export const de: ClaudiusTranslations = {
   downloadAsMarkdown: "Als Markdown herunterladen",
   downloadAsJson: "Als JSON herunterladen",
   copiedToClipboard: "In die Zwischenablage kopiert",
-  copyFailed:
-    "Kopieren nicht möglich. Laden Sie die Unterhaltung stattdessen herunter.",
+  copyFailed: "Kopieren nicht möglich. Bitte stattdessen herunterladen.",
   transcriptTitle: "Chat-Protokoll",
   transcriptExported: "Exportiert am {date}",
   transcriptUser: "Nutzer",

From 552fe99ca84952e669709fa7fa0c5ce1e4df5cb2 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:10:39 -0400
Subject: [PATCH 27/28] docs: correct the fence and attribute rules the code
 now follows

The design said "any amount of leading whitespace is accepted" for fences.
That is right for an opener and wrong for a closer: without the CommonMark
limit of three columns past the opener, a message showing Markdown inside
Markdown has its outer block ended by the example's indented fence. The
protection now spells out which end is lenient and why.

The Public API bullet said the web component attribute followed the same
rule as `attachments`, enabling on any value but "false". It no longer
does, and the bullet and the user-facing "Enabling it" section now state
the accepted values exactly.

Out of scope gains the three residual divergences between the scanner and
a real parser: a list-item fence closed at column 0, which CommonMark
reads as a new opener; fences inside blockquotes, which are not recognised;
and a fence whose opener is itself indented four columns, which CommonMark
reads as code. Re-indenting under-indented closers was measured against a
differential fuzz and helped as often as it hurt, so it is not attempted.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 .../2026-09-19-conversation-export-design.md  | 32 ++++++++++++++++---
 .../docs/configuration/conversation-export.md |  8 +++--
 2 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/docs/plans/2026-09-19-conversation-export-design.md b/docs/plans/2026-09-19-conversation-export-design.md
index 4ad5668..f471e01 100644
--- a/docs/plans/2026-09-19-conversation-export-design.md
+++ b/docs/plans/2026-09-19-conversation-export-design.md
@@ -110,8 +110,12 @@ createdAt?: string; // ISO 8601
   Widening to `boolean | ConversationExportOptions` later is not a breaking
   change.
 - Not named `export`: a reserved word cannot be destructured from props.
-- `<claudius-chat>` gains `conversation-export`. Present, or any value other
-  than `"false"`, enables it, the same rule as `attachments`.
+- `<claudius-chat>` gains `conversation-export`. It enables the feature only
+  when the attribute is present and its value, trimmed and lowercased, is
+  `""` or `"true"`. Every other value, `"False"`, `"0"`, `"no"`, `"yes"`,
+  leaves it off. This is deliberately stricter than `attachments`, which takes
+  any value but `"false"`: a Python or Jinja template renders a false value as
+  `"False"`, and a privacy switch must not be turned on by it.
 - `clients/_schema.json`, CLI validation, and both snippet generators accept
   `widget.conversationExport`. Snippets emit it only when it is `true`.
 
@@ -226,9 +230,16 @@ rendered file match what the visitor saw.
    three or more backticks or tildes; it is closed only by the same character,
    at least as long, with nothing after it; a backtick fence's info string
    cannot contain a backtick. So a four-backtick block that contains
-   three-backtick lines survives intact. Unlike CommonMark, any amount of
-   leading whitespace is accepted, because models routinely indent fences
-   inside list items and almost never write indented code blocks. The closing
+   three-backtick lines survives intact. Indentation is treated differently at
+   each end. An opener accepts any amount of leading whitespace, unlike
+   CommonMark, because models routinely indent fences inside list items and
+   almost never write indented code blocks. A closer does not: it must not be
+   indented more than three columns beyond its opener, which is the CommonMark
+   rule. Without that limit, a message that shows Markdown inside Markdown has
+   its outer block ended by the indented fence of the example, and the
+   example's own code is then escaped and given trailing spaces, breaking the
+   rule below that code inside a fence is never modified. Both indents are
+   measured in columns, with tabs expanded to four-column stops. The closing
    fence that gets added copies the opener's indentation so it stays inside
    the same list item.
 2. **Single newlines become hard line breaks** (fact 4). Outside fenced code,
@@ -441,3 +452,14 @@ deltas against `main`, per CONTRIBUTING.
 - Escaping inline HTML, which needs a code-span-aware scanner. A Markdown
   viewer is responsible for sanitizing what it renders, as with any file.
 - Exporting the welcome message.
+- Three residual divergences between the fence scanner and a real parser,
+  each of which leaves the transcript worse than it needs to be for a message
+  no test has ever produced. A fence opened inside a list item but closed at
+  column 0 still swallows the messages after it, because CommonMark reads
+  that closer as a new opener rather than as the end of the block;
+  re-indenting an under-indented closer was measured against a differential
+  fuzz and made as many transcripts worse as better, so it is deliberately
+  not attempted. Fences inside a blockquote are not recognised at all, so
+  their code gains the trailing spaces of protection 2. And a fence whose own
+  opener is indented four columns or more is code to CommonMark, so the
+  scanner protects a block the renderer does not see.
diff --git a/docs/src/content/docs/configuration/conversation-export.md b/docs/src/content/docs/configuration/conversation-export.md
index e9aad36..f9c6a45 100644
--- a/docs/src/content/docs/configuration/conversation-export.md
+++ b/docs/src/content/docs/configuration/conversation-export.md
@@ -39,8 +39,12 @@ In a [client config](/configuration/clients/), set
 `"widget": { "conversationExport": true }` and regenerate the snippet.
 
 Only the literal `true` enables it. A value such as the string `"false"`, which
-a CMS template can easily produce, leaves it off. On the web component,
-`conversation-export="false"` also leaves it off.
+a CMS template can easily produce, leaves it off. The web component attribute
+is stricter than the others for the same reason: it enables export only when
+`conversation-export` is present with no value or set to `"true"` (case and
+surrounding spaces do not matter). Every other value leaves it off, including
+`"False"`, which a Python or Jinja template writes for a false value, and
+`"0"` and `"no"`.
 
 The actions are greyed out while the conversation is empty and while a reply
 is still arriving, so a transcript never ends in a half-finished answer.

From 40308b4ffca0955efc51e7011a79cbee0dab5188 Mon Sep 17 00:00:00 2001
From: PMullz <paul@pmds.info>
Date: Sun, 20 Sep 2026 04:27:52 -0400
Subject: [PATCH 28/28] docs(plans): the plan quotes the German copy-failure
 string as shipped

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
---
 docs/plans/2026-09-19-conversation-export-implementation.md | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/docs/plans/2026-09-19-conversation-export-implementation.md b/docs/plans/2026-09-19-conversation-export-implementation.md
index 6cffb2b..cf55b15 100644
--- a/docs/plans/2026-09-19-conversation-export-implementation.md
+++ b/docs/plans/2026-09-19-conversation-export-implementation.md
@@ -1547,8 +1547,7 @@ Each block goes after the `stopReading` line and before `// Errors`. Spanish is
   downloadAsMarkdown: "Als Markdown herunterladen",
   downloadAsJson: "Als JSON herunterladen",
   copiedToClipboard: "In die Zwischenablage kopiert",
-  copyFailed:
-    "Kopieren nicht möglich. Laden Sie die Unterhaltung stattdessen herunter.",
+  copyFailed: "Kopieren nicht möglich. Bitte stattdessen herunterladen.",
   transcriptTitle: "Chat-Protokoll",
   transcriptExported: "Exportiert am {date}",
   transcriptUser: "Nutzer",