@threadplane/chat 0.0.56 → 0.0.58
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +44 -5
- package/fesm2022/threadplane-chat.mjs +2327 -1076
- package/fesm2022/threadplane-chat.mjs.map +1 -1
- package/package.json +2 -2
- package/types/threadplane-chat.d.ts +574 -274
package/README.md
CHANGED
|
@@ -149,6 +149,9 @@ interface Citation {
|
|
|
149
149
|
title?: string;
|
|
150
150
|
url?: string;
|
|
151
151
|
snippet?: string;
|
|
152
|
+
sourceType?: string; // 'web' | 'file' | 'app' | 'memory' | custom
|
|
153
|
+
iconUrl?: string; // provider-supplied favicon/logo URL or data URI
|
|
154
|
+
publishedAt?: string | number | Date;
|
|
152
155
|
extra?: unknown; // adapter-specific fields
|
|
153
156
|
}
|
|
154
157
|
```
|
|
@@ -167,6 +170,7 @@ Use `<chat-citations>` to render a collapsible sources panel under assistant mes
|
|
|
167
170
|
Inline citation markers are rendered automatically by `MarkdownCitationReferenceComponent` inside streaming markdown output — superscript indices link to the corresponding card in the sources panel.
|
|
168
171
|
|
|
169
172
|
`CitationsResolverService` resolves raw `Citation` references into `ResolvedCitation` objects with full source metadata.
|
|
173
|
+
Citation display helpers derive the visible source type badge from `sourceType` and fall back to `web` when a URL is present.
|
|
170
174
|
|
|
171
175
|
**Adapter integration:**
|
|
172
176
|
- **LangGraph** — reads from `message.additional_kwargs.citations` (preferred) or `.sources` (fallback).
|
|
@@ -174,13 +178,13 @@ Inline citation markers are rendered automatically by `MarkdownCitationReference
|
|
|
174
178
|
|
|
175
179
|
### GenUI / A2UI surfaces
|
|
176
180
|
|
|
177
|
-
`<chat-generative-ui>` renders A2UI
|
|
181
|
+
`<chat-generative-ui>` renders A2UI v0.9 surfaces emitted by agents. `<a2ui-surface>` is the underlying host that maps a surface to Angular catalog components (`A2uiButtonComponent`, `A2uiTextFieldComponent`, `A2uiChoicePickerComponent`, etc.).
|
|
178
182
|
|
|
179
|
-
|
|
183
|
+
Actions from catalog components flow back to the agent as structured `A2uiActionMessage`s (built via `buildA2uiActionMessage(...)`).
|
|
180
184
|
|
|
181
185
|
The built-in catalog ships via `a2uiBasicCatalog`. Compose a custom catalog with `withViews()` and pass it to the surface.
|
|
182
186
|
|
|
183
|
-
**Icons.** The catalog `Icon` component renders [Material Symbols](https://fonts.google.com/icons) by name (the A2UI canonical icon set —
|
|
187
|
+
**Icons.** The catalog `Icon` component renders [Material Symbols](https://fonts.google.com/icons) by name (the A2UI canonical icon set — the v0.9 catalog's camelCase names such as `check`, `trendingUp`, `star` map to the matching ligature). For glyphs to render, include the Material Symbols Outlined stylesheet in your app's `<head>` (the library does not inject any web font):
|
|
184
188
|
|
|
185
189
|
```html
|
|
186
190
|
<link
|
|
@@ -189,7 +193,7 @@ The built-in catalog ships via `a2uiBasicCatalog`. Compose a custom catalog with
|
|
|
189
193
|
/>
|
|
190
194
|
```
|
|
191
195
|
|
|
192
|
-
Without the font, the icon name falls back to plain text. Icons inherit `currentColor
|
|
196
|
+
Without the font, the icon name falls back to plain text. Icons inherit `currentColor`; an inline `{ svgPath }` name renders a raw SVG path instead of a ligature.
|
|
193
197
|
|
|
194
198
|
### Streaming markdown
|
|
195
199
|
|
|
@@ -227,6 +231,41 @@ Without `katex` installed, or without the stylesheet, math degrades gracefully
|
|
|
227
231
|
|
|
228
232
|
### Theming
|
|
229
233
|
|
|
234
|
+
Chat compositions and primitives expose a `--tplane-chat-*` CSS variable API for colors, typography, spacing, radii, and z-index layers. Override those variables on `:root`, on the `<chat>` host, or on any ancestor:
|
|
235
|
+
|
|
236
|
+
```css
|
|
237
|
+
:root {
|
|
238
|
+
--tplane-chat-primary: #2563eb;
|
|
239
|
+
--tplane-chat-on-primary: #ffffff;
|
|
240
|
+
--tplane-chat-radius-bubble: 12px;
|
|
241
|
+
}
|
|
242
|
+
```
|
|
243
|
+
|
|
244
|
+
If your app already has design-system tokens, keep them as the source of truth and bridge them into the chat API:
|
|
245
|
+
|
|
246
|
+
```css
|
|
247
|
+
:root {
|
|
248
|
+
--ds-canvas: #ffffff;
|
|
249
|
+
--ds-surface: #f8fafc;
|
|
250
|
+
--ds-border: #e2e8f0;
|
|
251
|
+
--ds-text-primary: #0f172a;
|
|
252
|
+
--ds-text-muted: #64748b;
|
|
253
|
+
--ds-accent: #2563eb;
|
|
254
|
+
--ds-font-sans: Inter, system-ui, sans-serif;
|
|
255
|
+
|
|
256
|
+
--tplane-chat-bg: var(--ds-canvas);
|
|
257
|
+
--tplane-chat-surface: var(--ds-surface);
|
|
258
|
+
--tplane-chat-surface-alt: var(--ds-surface);
|
|
259
|
+
--tplane-chat-separator: var(--ds-border);
|
|
260
|
+
--tplane-chat-text: var(--ds-text-primary);
|
|
261
|
+
--tplane-chat-text-muted: var(--ds-text-muted);
|
|
262
|
+
--tplane-chat-primary: var(--ds-accent);
|
|
263
|
+
--tplane-chat-font-family: var(--ds-font-sans);
|
|
264
|
+
}
|
|
265
|
+
```
|
|
266
|
+
|
|
267
|
+
Use app tokens for app layout and `--tplane-chat-*` tokens at chat boundaries or custom chat-adjacent views. That keeps chat's public theming surface stable even if your app design-system token names change.
|
|
268
|
+
|
|
230
269
|
`<a2ui-surface>` declares ~50 `--a2ui-*` CSS custom properties at `:host` with dark-theme defaults covering color, spacing, typography, shape radius, focus ring, motion, and elevation. Catalog components consume them via `var(--a2ui-*)`.
|
|
231
270
|
|
|
232
271
|
**Built-in presets** — import one in your global stylesheet:
|
|
@@ -240,7 +279,7 @@ Without `katex` installed, or without the stylesheet, math degrades gracefully
|
|
|
240
279
|
|
|
241
280
|
Material presets map M3 color tokens to the `--a2ui-*` vocabulary with no `@angular/material` runtime dependency.
|
|
242
281
|
|
|
243
|
-
**Agent-driven theming.** Agents
|
|
282
|
+
**Agent-driven theming.** Agents set the surface theme per the A2UI v0.9 wire format via `createSurface.theme`: `primaryColor` (hex `#RRGGBB`) flows to `<a2ui-surface>` as the inline `--a2ui-primary` custom property and takes precedence over `:root` defaults for that surface. (`theme.iconUrl` and `theme.agentDisplayName` identify the agent that owns the surface.)
|
|
244
283
|
|
|
245
284
|
**Custom themes.** Override any token at `:root`:
|
|
246
285
|
|