@classic-homes/agent-chat 0.2.0 → 0.3.0

package/dist/components/UserMessage.svelte

@@ -0,0 +1,46 @@
+<!--
+  @component
+  The user's turn: attachments and context above a right-aligned muted bubble, then the action bar.
+-->
+<script lang="ts">
+  import { Icon } from '@classic-homes/theme-svelte';
+  import type { UserMessage } from '../reducer.js';
+  import { fileIcon, formatBytes } from '../message-format.js';
+  import MessageActions from './MessageActions.svelte';
+
+  interface Props {
+    message: UserMessage;
+    last?: boolean;
+  }
+  let { message, last = false }: Props = $props();
+</script>
+
+<div class="group/message flex flex-col items-end gap-1 px-4 py-2" data-role="user">
+  {#if message.attachments.length || message.contextLabel}
+    <ul class="flex max-w-[85%] flex-wrap justify-end gap-1.5" aria-label="Attached">
+      {#if message.contextLabel}
+        <li
+          class="inline-flex items-center gap-1 rounded-md border border-border px-2 py-1 text-xs text-muted-foreground"
+        >
+          <Icon name="link" size={12} />
+          {message.contextLabel}
+        </li>
+      {/if}
+      {#each message.attachments as file (file.fileId)}
+        <li
+          class="inline-flex max-w-60 items-center gap-1.5 rounded-md border border-border bg-background px-2 py-1 text-xs"
+        >
+          <Icon name={fileIcon(file.mimeType)} size={14} class="shrink-0 text-muted-foreground" />
+          <span class="truncate text-foreground">{file.name}</span>
+          <span class="shrink-0 text-muted-foreground">{formatBytes(file.bytes)}</span>
+        </li>
+      {/each}
+    </ul>
+  {/if}
+  <div
+    class="max-w-[85%] whitespace-pre-wrap rounded-2xl rounded-br-md bg-muted px-4 py-2.5 text-foreground [overflow-wrap:anywhere]"
+  >
+    {message.text}
+  </div>
+  <MessageActions text={message.text} createdAt={message.createdAt} visible={last} align="end" />
+</div>

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

@@ -0,0 +1,10 @@
+import type { UserMessage } from '../reducer.js';
+interface Props {
+    message: UserMessage;
+    last?: boolean;
+}
+/** The user's turn: attachments and context above a right-aligned muted bubble, then the action bar. */
+declare const UserMessage: import("svelte").Component<Props, {}, "">;
+type UserMessage = ReturnType<typeof UserMessage>;
+export default UserMessage;
+//# sourceMappingURL=UserMessage.svelte.d.ts.map

package/dist/components/UserMessage.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UserMessage.svelte.d.ts","sourceRoot":"","sources":["../../src/lib/components/UserMessage.svelte.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAK/C,UAAU,KAAK;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAqCH,wGAAwG;AACxG,QAAA,MAAM,WAAW,2CAAwC,CAAC;AAC1D,KAAK,WAAW,GAAG,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAClD,eAAe,WAAW,CAAC"}

package/dist/components/live-fixes.svelte.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=live-fixes.svelte.test.d.ts.map

package/dist/components/live-fixes.svelte.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"live-fixes.svelte.test.d.ts","sourceRoot":"","sources":["../../src/lib/components/live-fixes.svelte.test.ts"],"names":[],"mappings":""}

package/dist/components/live-fixes.svelte.test.js

@@ -0,0 +1,127 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { cleanup, render, screen, waitFor } from '@testing-library/svelte';
+import userEvent from '@testing-library/user-event';
+import TwoSheets from '../../test-fixtures/TwoSheets.svelte';
+import { releaseStuckBodyLock } from '../body-lock.js';
+import { parseMarkdown } from '../markdown.js';
+import { ChatSession } from '../session.svelte.js';
+import AgentChat from './AgentChat.svelte';
+import ConversationSidebar from './ConversationSidebar.svelte';
+import Markdown from './Markdown.svelte';
+const wait = (ms) => new Promise((r) => setTimeout(r, ms));
+afterEach(() => {
+    cleanup();
+    document.body.removeAttribute('style');
+});
+/** A client whose streamChat replays `events` (all in one tick) and reports done. */
+function fakeClient(events) {
+    return {
+        fileUrl: (id) => `#${id}`,
+        uploadFile: vi.fn(),
+        cancel: vi.fn(),
+        getConversation: vi.fn(),
+        resumeTurn: vi.fn(),
+        streamChat: vi.fn(async (req, opts) => {
+            events(req.requestId).forEach((e, seq) => opts.onEvent({ requestId: req.requestId, seq, ...e }));
+            return { kind: 'done' };
+        }),
+    };
+}
+const scope = { agent: 'classic-agent', runId: 'run-1' };
+const turn = (requestId) => [
+    { type: 'start', conversationId: 'c-1', mode: 'live' },
+    { type: 'delta', text: 'Here it is.' },
+    {
+        type: 'artifact',
+        ...scope,
+        artifactId: 'a1',
+        op: 'open',
+        mediaType: 'text/markdown',
+        title: 'Memo',
+    },
+    { type: 'artifact', ...scope, artifactId: 'a1', op: 'delta', text: '# Memo' },
+    { type: 'artifact', ...scope, artifactId: 'a1', op: 'close' },
+    { type: 'done', finishReason: 'stop' },
+].map((e) => ({ ...e, requestId }));
+describe('body lock guard', () => {
+    it('clears the lock the bits-ui race leaves behind once no modal is open', async () => {
+        // Reproduces the race: A closes and B opens in the same tick, then B closes.
+        const { rerender } = render(TwoSheets, { props: { a: true, b: false } });
+        await wait(100);
+        await rerender({ a: false, b: false });
+        await wait(0);
+        await rerender({ a: false, b: true });
+        await wait(300);
+        await rerender({ a: false, b: false });
+        await wait(600);
+        expect(document.body.style.pointerEvents).toBe('none');
+        releaseStuckBodyLock(0);
+        await wait(10);
+        expect(document.body.style.pointerEvents).toBe('');
+        expect(document.body.style.overflow).toBe('');
+    });
+    it('leaves the lock alone while a modal is open', async () => {
+        render(TwoSheets, { props: { a: true } });
+        await wait(300);
+        releaseStuckBodyLock(0);
+        await wait(10);
+        expect(document.body.style.pointerEvents).toBe('none');
+    });
+});
+describe('ChatSession onTurnEnd', () => {
+    it('reports the finished turn with its conversation and status', async () => {
+        const onTurnEnd = vi.fn();
+        const client = fakeClient(turn);
+        const session = new ChatSession({ client: client, onTurnEnd });
+        await session.send('hi');
+        expect(onTurnEnd).toHaveBeenCalledOnce();
+        expect(onTurnEnd.mock.calls[0][0]).toMatchObject({ conversationId: 'c-1', status: 'done' });
+    });
+});
+describe('AgentChat artifacts', () => {
+    it('opens an artifact that starts and finishes within one tick', async () => {
+        const user = userEvent.setup();
+        const onturnend = vi.fn();
+        render(AgentChat, {
+            props: { client: fakeClient(turn), sandboxOrigin: 'https://frame.test', onturnend },
+        });
+        await user.type(screen.getByRole('textbox', { name: 'Message' }), 'memo{Enter}');
+        // jsdom has no wide viewport, so the artifact opens in the sheet.
+        expect(await screen.findByRole('dialog', { name: 'Memo' })).toBeTruthy();
+        await waitFor(() => expect(onturnend).toHaveBeenCalledOnce());
+    });
+});
+describe('rename dialog', () => {
+    it('starts in the title field with the title selected', async () => {
+        const user = userEvent.setup();
+        const now = new Date().toISOString();
+        render(ConversationSidebar, {
+            props: {
+                conversations: [
+                    {
+                        conversationId: 'c1',
+                        agent: 'classic-agent',
+                        title: 'Lot 12',
+                        createdAt: now,
+                        updatedAt: now,
+                    },
+                ],
+                onrename: vi.fn(),
+            },
+        });
+        await user.click(screen.getByRole('button', { name: 'Options for Lot 12' }));
+        await user.click(await screen.findByRole('menuitem', { name: /Rename/ }));
+        const field = await screen.findByRole('textbox', { name: 'Conversation title' });
+        await waitFor(() => expect(document.activeElement).toBe(field));
+        const input = field;
+        expect([input.selectionStart, input.selectionEnd]).toEqual([0, 'Lot 12'.length]);
+    });
+});
+describe('Markdown tables', () => {
+    it('keep words whole so wide tables scroll instead of breaking numbers', () => {
+        const { container } = render(Markdown, {
+            props: { html: parseMarkdown('| a | b |\n| - | - |\n| $1,075,000 | x |') },
+        });
+        expect(container.firstElementChild.className).toContain('[&_table]:[overflow-wrap:normal]');
+    });
+});

package/dist/components/messages.svelte.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=messages.svelte.test.d.ts.map

package/dist/components/messages.svelte.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"messages.svelte.test.d.ts","sourceRoot":"","sources":["../../src/lib/components/messages.svelte.test.ts"],"names":[],"mappings":""}

package/dist/components/messages.svelte.test.js

@@ -0,0 +1,202 @@
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/svelte';
+import userEvent from '@testing-library/user-event';
+import { parseMarkdown } from '../markdown.js';
+import { daySeparators, describeProposal, formatBytes, formatDay } from '../message-format.js';
+import { newAssistantMessage, newUserMessage } from '../reducer.js';
+import AssistantMessageView from './AssistantMessage.svelte';
+import Markdown from './Markdown.svelte';
+import MessageList from './MessageList.svelte';
+import UserMessageView from './UserMessage.svelte';
+afterEach(() => cleanup());
+const base = { sandboxOrigin: 'https://frame.test', fileUrl: (id) => `/files/${id}` };
+const assistant = (patch = {}) => ({
+    ...newAssistantMessage('r1', Date.UTC(2026, 10, 3, 15, 0)),
+    status: 'done',
+    ...patch,
+});
+const DAY = 86_400_000;
+describe('message formatting', () => {
+    it('formats sizes and relative days', () => {
+        expect(formatBytes(900)).toBe('900 B');
+        expect(formatBytes(2048)).toBe('2 KB');
+        expect(formatBytes(3 * 1048576)).toBe('3.0 MB');
+        const now = new Date(2026, 10, 3, 12).getTime();
+        expect(formatDay(now - 60_000, now)).toBe('Today');
+        expect(formatDay(now - DAY, now)).toBe('Yesterday');
+        expect(formatDay(now - 5 * DAY, now)).not.toMatch(/Today|Yesterday/);
+    });
+    it('marks the first message of each day', () => {
+        const t = new Date(2026, 10, 1, 10).getTime();
+        expect([...daySeparators([{ createdAt: t }, { createdAt: t + 60_000 }])]).toEqual([0]);
+        expect([...daySeparators([{ createdAt: t }, { createdAt: t + DAY }])]).toEqual([0, 1]);
+    });
+    it('describes proposals without applying them', () => {
+        const op = {
+            kind: 'excel.writeRange',
+            operationId: '00000000-0000-4000-8000-000000000001',
+            documentId: 'doc-1',
+            summary: 'Fill totals',
+            target: { sheet: 'Budget', address: 'B2:B4' },
+            write: { type: 'values', values: [[1], [2], [3]] },
+            precondition: { formulas: [[''], [''], ['']] },
+        };
+        expect(describeProposal(op)).toEqual({
+            action: 'Write values',
+            host: 'Excel',
+            target: 'Budget!B2:B4',
+        });
+    });
+});
+describe('markdown output', () => {
+    it('wraps tables in a scrolling container and never trusts a literal div', () => {
+        const html = parseMarkdown('| A | B |\n|---|---|\n| 1 | 2 |\n\n<div class="agent-x">hi</div>');
+        expect(html).toMatch(/<div class="agent-table-wrap"><table class="agent-table">/);
+        expect(html).toContain('&lt;div');
+        expect(html.match(/<div/g)).toHaveLength(1);
+    });
+    it('marks external links', () => {
+        expect(parseMarkdown('[docs](https://example.com/)')).toContain('class="agent-external-link"');
+    });
+});
+describe('Markdown code blocks', () => {
+    it('adds a language header whose button copies the code', async () => {
+        const writeText = vi.fn().mockResolvedValue(undefined);
+        Object.defineProperty(navigator, 'clipboard', { value: { writeText }, configurable: true });
+        render(Markdown, { props: { html: parseMarkdown('```ts\nconst a = 1;\n```') } });
+        const button = await screen.findByRole('button', { name: 'Copy ts code' });
+        expect(button.closest('.agent-codeblock')?.textContent).toContain('ts');
+        await fireEvent.click(button);
+        expect(writeText).toHaveBeenCalledWith('const a = 1;');
+        await waitFor(() => expect(button.textContent).toContain('Copied'));
+    });
+});
+describe('AssistantMessage', () => {
+    it('shows a retryable error with Try again', async () => {
+        const onretry = vi.fn();
+        render(AssistantMessageView, {
+            props: {
+                ...base,
+                last: true,
+                onretry,
+                message: assistant({
+                    status: 'error',
+                    error: { code: 'upstream_error', message: 'Model failed.', retryable: true },
+                }),
+            },
+        });
+        expect(screen.getByText(/The agent ran into a problem/)).toBeTruthy();
+        await userEvent.click(screen.getByRole('button', { name: /Try again/ }));
+        expect(onretry).toHaveBeenCalledOnce();
+    });
+    it('offers Continue on a cut-short or stopped last answer only', async () => {
+        const oncontinue = vi.fn();
+        const { rerender } = render(AssistantMessageView, {
+            props: { ...base, last: true, oncontinue, message: assistant({ status: 'incomplete' }) },
+        });
+        expect(screen.getByText('The answer was cut short.')).toBeTruthy();
+        await userEvent.click(screen.getByRole('button', { name: 'Continue' }));
+        expect(oncontinue).toHaveBeenCalledOnce();
+        await rerender({
+            ...base,
+            last: true,
+            oncontinue,
+            message: assistant({ status: 'cancelled' }),
+        });
+        expect(screen.getByText('Stopped')).toBeTruthy();
+        expect(screen.getByRole('button', { name: 'Continue' })).toBeTruthy();
+        await rerender({
+            ...base,
+            last: false,
+            oncontinue,
+            message: assistant({ status: 'cancelled' }),
+        });
+        expect(screen.queryByRole('button', { name: 'Continue' })).toBeNull();
+    });
+    it('renders artifacts, proposals and a thinking state', async () => {
+        const onopenartifact = vi.fn();
+        const { rerender } = render(AssistantMessageView, {
+            props: { ...base, streaming: true, message: assistant({ status: 'streaming' }) },
+        });
+        expect(screen.getByRole('status').textContent).toContain('Thinking');
+        await rerender({
+            ...base,
+            onopenartifact,
+            message: assistant({
+                artifacts: [
+                    { artifactId: 'a1', mediaType: 'text/html', title: 'Plans', text: '', open: false },
+                    { artifactId: 'a2', mediaType: 'text/markdown', title: 'Memo', text: '', open: true },
+                ],
+                proposals: [
+                    {
+                        kind: 'word.replaceSelection',
+                        operationId: '00000000-0000-4000-8000-000000000002',
+                        documentId: 'doc-1',
+                        summary: 'Tighten the intro',
+                        target: { targetId: 't1', expectedText: 'Old' },
+                        text: 'New',
+                    },
+                ],
+            }),
+        });
+        expect(screen.queryByText('Thinking')).toBeNull();
+        await userEvent.click(screen.getByRole('button', { name: 'Open Plans' }));
+        expect(onopenartifact).toHaveBeenCalledWith('a1');
+        expect(screen.getByRole('button', { name: 'Memo (writing)' })).toBeTruthy();
+        expect(screen.getByText('Tighten the intro')).toBeTruthy();
+        expect(screen.getByText('Apply from the Word add-in.')).toBeTruthy();
+    });
+    it('has a copy action once the answer is done', () => {
+        render(AssistantMessageView, {
+            props: { ...base, message: assistant({ text: 'Hello there' }) },
+        });
+        expect(screen.getByRole('button', { name: 'Copy message' })).toBeTruthy();
+    });
+});
+describe('UserMessage', () => {
+    it('shows the text in a bubble with its attachments', () => {
+        const message = newUserMessage('r1', 'See attached', {
+            attachments: [
+                {
+                    fileId: 'f1',
+                    name: 'plan.pdf',
+                    mimeType: 'application/pdf',
+                    bytes: 2048,
+                    status: 'uploaded',
+                },
+            ],
+        });
+        render(UserMessageView, { props: { message } });
+        expect(screen.getByText('See attached')).toBeTruthy();
+        expect(screen.getByText('plan.pdf')).toBeTruthy();
+        expect(screen.getByText('2 KB')).toBeTruthy();
+    });
+});
+describe('MessageList', () => {
+    it('labels days only when the transcript spans more than one', () => {
+        const t = Date.now();
+        const one = [newUserMessage('r1', 'hi', { now: t }), assistant({ createdAt: t })];
+        const { rerender } = render(MessageList, {
+            props: { ...base, streaming: false, messages: one },
+        });
+        expect(screen.queryByRole('separator')).toBeNull();
+        const two = [newUserMessage('r0', 'old', { now: t - 3 * DAY }), ...one];
+        void rerender({ ...base, streaming: false, messages: two });
+        return waitFor(() => expect(screen.getAllByRole('separator').map((s) => s.textContent?.trim())).toContain('Today'));
+    });
+    it('offers a jump to the latest once the reader scrolls up', async () => {
+        render(MessageList, {
+            props: { ...base, streaming: false, messages: [newUserMessage('r1', 'hi'), assistant()] },
+        });
+        const log = screen.getByRole('log');
+        Object.defineProperty(log, 'scrollHeight', { value: 2000, configurable: true });
+        Object.defineProperty(log, 'clientHeight', { value: 500, configurable: true });
+        log.scrollTop = 100;
+        await fireEvent.scroll(log);
+        const jump = await screen.findByRole('button', { name: 'Jump to the latest message' });
+        log.scrollTo = vi.fn();
+        await userEvent.click(jump);
+        expect(log.scrollTo).toHaveBeenCalled();
+        expect(screen.queryByRole('button', { name: /latest/ })).toBeNull();
+    });
+});

package/dist/index.d.ts

@@ -1,5 +1,7 @@
+export * from './body-lock.js';
 export * from './composer-keys.js';
 export * from './markdown.js';
+export * from './message-format.js';
 export * from './reducer.js';
 export * from './session.svelte.js';
 export * from './ui-frame-protocol.js';
@@ -13,4 +15,10 @@ export { default as ModeBanner } from './components/ModeBanner.svelte';
 export { default as ToolTimeline } from './components/ToolTimeline.svelte';
 export { default as UiFrame } from './components/UiFrame.svelte';
 export { default as ChatHeader } from './components/ChatHeader.svelte';
+export { default as AssistantMessage } from './components/AssistantMessage.svelte';
+export { default as UserMessage } from './components/UserMessage.svelte';
+export { default as MessageActions } from './components/MessageActions.svelte';
+export { default as ArtifactChip } from './components/ArtifactChip.svelte';
+export { default as MessageFiles } from './components/MessageFiles.svelte';
+export { default as ProposalCard } from './components/ProposalCard.svelte';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,yCAAyC,CAAC;AACzF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,oBAAoB,CAAC;AACnC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,wBAAwB,CAAC;AACvC,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,8BAA8B,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,yCAAyC,CAAC;AACzF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,gCAAgC,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACnF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,iCAAiC,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,oCAAoC,CAAC;AAC/E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kCAAkC,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,kCAAkC,CAAC"}

package/dist/index.js

@@ -1,5 +1,7 @@
+export * from './body-lock.js';
 export * from './composer-keys.js';
 export * from './markdown.js';
+export * from './message-format.js';
 export * from './reducer.js';
 export * from './session.svelte.js';
 export * from './ui-frame-protocol.js';
@@ -13,3 +15,9 @@ export { default as ModeBanner } from './components/ModeBanner.svelte';
 export { default as ToolTimeline } from './components/ToolTimeline.svelte';
 export { default as UiFrame } from './components/UiFrame.svelte';
 export { default as ChatHeader } from './components/ChatHeader.svelte';
+export { default as AssistantMessage } from './components/AssistantMessage.svelte';
+export { default as UserMessage } from './components/UserMessage.svelte';
+export { default as MessageActions } from './components/MessageActions.svelte';
+export { default as ArtifactChip } from './components/ArtifactChip.svelte';
+export { default as MessageFiles } from './components/MessageFiles.svelte';
+export { default as ProposalCard } from './components/ProposalCard.svelte';

package/dist/markdown.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../src/lib/markdown.ts"],"names":[],"mappings":"AAiEA,MAAM,WAAW,eAAe;IAC9B,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,uFAAuF;IACvF,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAID,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAK/C;AAED,uFAAuF;AACvF,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAO9C;AAMD,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,WAAsB,GAAG,OAAO,CAenF;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,cAAc,qBAAe,GAAG,OAAO,CAOjF;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,eAAoB,GAAG,MAAM,CA6DjF"}
+{"version":3,"file":"markdown.d.ts","sourceRoot":"","sources":["../src/lib/markdown.ts"],"names":[],"mappings":"AAkEA,MAAM,WAAW,eAAe;IAC9B,yFAAyF;IACzF,UAAU,CAAC,EAAE,MAAM,EAAE,CAAC;IACtB,uFAAuF;IACvF,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAQD,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAK/C;AAED,uFAAuF;AACvF,wBAAgB,SAAS,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAO9C;AAMD,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,WAAsB,GAAG,OAAO,CAenF;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,EAAE,cAAc,qBAAe,GAAG,OAAO,CAOjF;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,OAAO,GAAE,eAAoB,GAAG,MAAM,CAiEjF"}

package/dist/markdown.js

@@ -22,6 +22,7 @@ function ensureHook() {
 const DOMPURIFY_CONFIG = {
     ALLOWED_TAGS: [
         'p',
+        'div',
         'strong',
         'em',
         'a',
@@ -62,6 +63,9 @@ const DOMPURIFY_CONFIG = {
     ],
     ALLOWED_URI_REGEXP: /^(?:(?:https?|mailto):|[^a-z]|[a-z+.-]+(?:[^a-z+.\-:]|$))/i,
 };
+// Sentinels for the scrolling wrapper around tables (see parseMarkdown).
+const TABLE_OPEN = '\u0000TO\u0000';
+const TABLE_CLOSE = '\u0000TC\u0000';
 const DEFAULT_IMAGE_HOSTS = ['classichomes.com', '.classichomes.com'];
 export function escapeHtml(text) {
     return text.replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#039;' })[c]);
@@ -130,6 +134,10 @@ export function parseMarkdown(text, options = {}) {
     html = parseTables(html);
     html = parseLists(html);
     html = escapePreservingTags(html, [CODE, INLINE]);
+    // Table wrappers go in after escaping, so a literal `<div>` in the text is never trusted.
+    html = html
+        .replaceAll(TABLE_OPEN, '<div class="agent-table-wrap">')
+        .replaceAll(TABLE_CLOSE, '</div>');
     html = html.replace(/^[\t ]*(?:---+|\*\*\*+|___+)[\t ]*$/gm, '<hr>');
     html = html.replace(/^#### (.+)$/gm, '<h4>$1</h4>');
     html = html.replace(/^### (.+)$/gm, '<h4>$1</h4>');
@@ -153,12 +161,12 @@ export function parseMarkdown(text, options = {}) {
             return label;
         if (isInternalUrl(raw, options.internalOrigin))
             return `<a href="${url}" class="agent-internal-link" data-internal="true">${label}</a>`;
-        return `<a href="${url}" target="_blank" rel="noopener noreferrer">${label}</a>`;
+        return `<a href="${url}" class="agent-external-link" target="_blank" rel="noopener noreferrer">${label}</a>`;
     });
     codeBlocks.forEach((block, i) => (html = html.replace(`${CODE}${i}${CODE}`, block)));
     inlineCodes.forEach((code, i) => (html = html.replace(`${INLINE}${i}${INLINE}`, code)));
     html = html.replace(/\n\n+/g, '</p><p>');
-    html = html.replace(/(?<!<\/li>|<\/ul>|<\/ol>|<\/pre>|<\/h[1-4]>|<\/table>|<\/tr>|<\/td>|<\/th>|<\/blockquote>|<hr>)\n(?!<)/g, '<br>');
+    html = html.replace(/(?<!<\/li>|<\/ul>|<\/ol>|<\/pre>|<\/h[1-4]>|<\/table>|<\/div>|<\/tr>|<\/td>|<\/th>|<\/blockquote>|<hr>)\n(?!<)/g, '<br>');
     if (!html.startsWith('<'))
         html = `<p>${html}</p>`;
     html = html.replace(/<p>\s*<\/p>/g, '');
@@ -312,9 +320,9 @@ function parseTables(html) {
                 rows.push(cells(lines[j]));
                 j += 1;
             }
-            out.push(`<table class="agent-table"><thead><tr>${header.map((h) => `<th>${h}</th>`).join('')}</tr></thead><tbody>${rows
+            out.push(`${TABLE_OPEN}<table class="agent-table"><thead><tr>${header.map((h) => `<th>${h}</th>`).join('')}</tr></thead><tbody>${rows
                 .map((r) => `<tr>${r.map((c) => `<td>${c}</td>`).join('')}</tr>`)
-                .join('')}</tbody></table>`);
+                .join('')}</tbody></table>${TABLE_CLOSE}`);
             i = j;
             continue;
         }

package/dist/message-format.d.ts

@@ -0,0 +1,30 @@
+/**
+ * Pure formatting helpers for the message components: sizes, times, day separators, icons for
+ * artifacts and files, and read-only descriptions of proposed document edits.
+ */
+import type { ArtifactMediaType, ProposedOperation } from '@classic-homes/agent-contracts';
+import type { IconName } from '@classic-homes/theme-svelte';
+import type { ChatMessage } from './reducer.js';
+export declare function formatBytes(n: number): string;
+/** "3:42 PM" in the viewer's locale. */
+export declare function formatTime(ts: number, locale?: string): string;
+/** Full date and time, for tooltips. */
+export declare function formatDateTime(ts: number, locale?: string): string;
+/** "Today", "Yesterday", or a short date ("Mon, Nov 3"; the year only when it differs). */
+export declare function formatDay(ts: number, now?: number, locale?: string): string;
+/** Indexes of messages that start a new calendar day (the first message always does). */
+export declare function daySeparators(messages: Pick<ChatMessage, 'createdAt'>[]): Set<number>;
+export declare function artifactIcon(mediaType: ArtifactMediaType): IconName;
+export declare function artifactKind(mediaType: ArtifactMediaType): string;
+export declare function fileIcon(mimeType: string): IconName;
+export interface ProposalDescription {
+    /** What kind of edit, e.g. "Write values". */
+    action: string;
+    /** Which host applies it. */
+    host: 'Excel' | 'Word';
+    /** Where, when the operation names a readable target. */
+    target?: string;
+}
+/** Read-only description of a proposed document edit; applying happens in the Office add-in. */
+export declare function describeProposal(op: ProposedOperation): ProposalDescription;
+//# sourceMappingURL=message-format.d.ts.map

package/dist/message-format.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"message-format.d.ts","sourceRoot":"","sources":["../src/lib/message-format.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAC3F,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAEhD,wBAAgB,WAAW,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAI7C;AAED,wCAAwC;AACxC,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAE9D;AAED,wCAAwC;AACxC,wBAAgB,cAAc,CAAC,EAAE,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CASlE;AAQD,2FAA2F;AAC3F,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,EAAE,GAAG,SAAa,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAW/E;AAED,yFAAyF;AACzF,wBAAgB,aAAa,CAAC,QAAQ,EAAE,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC,EAAE,GAAG,GAAG,CAAC,MAAM,CAAC,CASrF;AAED,wBAAgB,YAAY,CAAC,SAAS,EAAE,iBAAiB,GAAG,QAAQ,CAcnE;AAED,wBAAgB,YAAY,CAAC,SAAS,EAAE,iBAAiB,GAAG,MAAM,CAejE;AAED,wBAAgB,QAAQ,CAAC,QAAQ,EAAE,MAAM,GAAG,QAAQ,CAQnD;AAED,MAAM,WAAW,mBAAmB;IAClC,8CAA8C;IAC9C,MAAM,EAAE,MAAM,CAAC;IACf,6BAA6B;IAC7B,IAAI,EAAE,OAAO,GAAG,MAAM,CAAC;IACvB,yDAAyD;IACzD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,gGAAgG;AAChG,wBAAgB,gBAAgB,CAAC,EAAE,EAAE,iBAAiB,GAAG,mBAAmB,CAgB3E"}