polymorph-ui-components-mcp 0.3.1 → 0.3.2
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/build/docs/CHANGELOG.md
CHANGED
|
@@ -2,9 +2,12 @@
|
|
|
2
2
|
based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to
|
|
3
3
|
[Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
|
4
4
|
|
|
5
|
-
## [Unreleased](https://github.com/sinha-sahil/polymorph-ui-components/compare/0.6.
|
|
5
|
+
## [Unreleased](https://github.com/sinha-sahil/polymorph-ui-components/compare/0.6.1...HEAD)
|
|
6
6
|
|
|
7
|
-
-
|
|
7
|
+
- passing attachments to ChatMessageList and ChatMessage components
|
|
8
|
+
- updated documentation
|
|
9
|
+
|
|
10
|
+
## [0.6.1](https://github.com/sinha-sahil/polymorph-ui-components/compare/0.6.0...0.6.1) - 5 August 2026
|
|
8
11
|
|
|
9
12
|
## [0.6.0](https://github.com/sinha-sahil/polymorph-ui-components/compare/0.5.0...0.6.0) - 5 August 2026
|
|
10
13
|
|
package/build/docs/Chat.md
CHANGED
|
@@ -77,6 +77,24 @@ Markdown is intentionally not bundled: pass pre-sanitized HTML on a message's `h
|
|
|
77
77
|
|
|
78
78
|
**Roles.** Messages use the two-party primitive `role` — `sender` / `responder` (see `ChatMessage`). The controller emits those, and `partyOf(role)` resolves any role (including the `user`/`assistant`/`system` extensions) to its party. Map the primitive to your provider's roles inside the transport, where the API-specific terms belong: `history.map((m) => ({ role: partyOf(m.role) === 'sender' ? 'user' : 'assistant', content: m.content }))`.
|
|
79
79
|
|
|
80
|
+
## Your own UI inside a message
|
|
81
|
+
|
|
82
|
+
Two snippets, and the difference matters. `message` replaces the whole message — you own the bubble, alignment, streaming indicator, and you lose the built-in copy / retry / feedback wiring. `messageAttachments` renders **below** the bubble and keeps all of that, so reach for it first.
|
|
83
|
+
|
|
84
|
+
It receives the whole `ChatMessageData`, so render on whatever field you like — a custom field of your own, or `attachments`, which `ChatController` fills from a transport's `handlers.onAttachment(...)`:
|
|
85
|
+
|
|
86
|
+
```svelte
|
|
87
|
+
<Chat {messages} bind:value allowCopy onretry={() => chat.retry()} {onsend}>
|
|
88
|
+
{#snippet messageAttachments(msg)}
|
|
89
|
+
{#each msg.attachments ?? [] as item, index (index)}
|
|
90
|
+
<YourComponent data={item} />
|
|
91
|
+
{/each}
|
|
92
|
+
{/snippet}
|
|
93
|
+
</Chat>
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
The snippet is invoked for every message, so branch inside it to target specific ones. Rendering nothing costs no layout — the container collapses when empty.
|
|
97
|
+
|
|
80
98
|
## Layout — fullscreen & floating
|
|
81
99
|
|
|
82
100
|
`Chat` is position- and size-agnostic: its root fills its container (`--chat-height` / `--chat-width` default to `100%`), with the message list on `flex: 1` and the composer pinned to the bottom. The only requirement is a **bounded-height parent** — the flexing list needs something to fill. Positioning (fixed, floating, modal) is the consumer's job; the component never assumes a layout context.
|
|
@@ -163,7 +181,8 @@ The fixed-height `.chat-panel` gives `Chat` its bounds; add a slide/scale transi
|
|
|
163
181
|
| headerAvatar | `Snippet` | No | `-` | Brand/avatar mark in the header (takes precedence over `image`). |
|
|
164
182
|
| headerActions | `Snippet` | No | `-` | Extra inline header actions. |
|
|
165
183
|
| headerContent | `Snippet` | No | `-` | Extra content as a full-width second row in the header (toolbar, status…). |
|
|
166
|
-
| message | `Snippet<[ChatMessageData]>` | No | `-` | Custom per-message rendering.
|
|
184
|
+
| message | `Snippet<[ChatMessageData]>` | No | `-` | Custom per-message rendering. Replaces the default bubble entirely. |
|
|
185
|
+
| messageAttachments | `Snippet<[ChatMessageData]>` | No | `-` | Your own UI rendered below each bubble, keeping the default bubble and its actions. |
|
|
167
186
|
| empty | `Snippet` | No | `-` | Empty-state content. |
|
|
168
187
|
| composerLeading | `Snippet` | No | `-` | Content before the composer input. |
|
|
169
188
|
| sendIcon / stopIcon / voiceIcon / attachIcon | `Snippet` | No | `-` | Custom composer icons; each falls back to a built-in asset. |
|
|
@@ -29,7 +29,7 @@ A single chat bubble. The primitive is the **party** — every message is from o
|
|
|
29
29
|
| status | `'sending' \| 'sent' \| 'error'` | No | `-` | `error` tints the bubble with the error color. |
|
|
30
30
|
| avatar | `Snippet` | No | `-` | Avatar shown beside the bubble. |
|
|
31
31
|
| header | `Snippet` | No | `-` | Header row above the bubble (author name, timestamp, etc.). |
|
|
32
|
-
| attachments | `Snippet`
|
|
32
|
+
| attachments | `Snippet \| null` | No | `-` | Content rendered below the bubble. Collapses to no layout when it renders nothing. |
|
|
33
33
|
| allowCopy | `boolean` | No | `false` | Show a built-in copy button in the hover actions row. |
|
|
34
34
|
| actions | `Snippet` | No | `-` | Extra custom actions appended to the actions row. |
|
|
35
35
|
| copyLabel / retryLabel / feedbackUpLabel / feedbackDownLabel | `string` | No | `…` | Aria-labels for the action buttons. |
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# ChatMessageList
|
|
2
2
|
|
|
3
|
-
A scrollable, auto-scrolling container for a conversation. It renders each message with `ChatMessage` by default
|
|
3
|
+
A scrollable, auto-scrolling container for a conversation. It renders each message with `ChatMessage` by default. To add your own UI below a bubble, pass `messageAttachments` — it receives each `ChatMessageData` and keeps the default bubble along with its copy/retry/feedback actions. Use the `message` snippet only when you want to replace a message entirely, which forgoes that default rendering. When there are no messages, the `empty` snippet is shown. **Smart auto-scroll** keeps the latest content in view only while you're already near the bottom — if you scroll up to read history it won't yank you down, and a **jump-to-latest** button appears instead. Opt-in message actions (`allowCopy`, `onretry`, `onfeedback`) are applied to the default-rendered messages: copy and feedback on assistant messages, retry on the most recent assistant message. Implemented with a Svelte action (no effects), respecting `prefers-reduced-motion`.
|
|
4
4
|
|
|
5
5
|
## Usage
|
|
6
6
|
|
|
@@ -24,6 +24,7 @@ A scrollable, auto-scrolling container for a conversation. It renders each messa
|
|
|
24
24
|
| messages | `ChatMessageData[]` | Yes | `-` | Messages to render. |
|
|
25
25
|
| autoscroll | `boolean` | No | `true` | Auto-scroll to the latest message as content changes. |
|
|
26
26
|
| message | `Snippet<[ChatMessageData]>` | No | `-` | Custom per-message rendering; overrides the default bubble. |
|
|
27
|
+
| messageAttachments | `Snippet<[ChatMessageData]>` | No | `-` | Own UI below each bubble; keeps the default bubble and actions. |
|
|
27
28
|
| empty | `Snippet` | No | `-` | Shown when there are no messages. |
|
|
28
29
|
| jumpLabel | `string` | No | `'Jump to latest'` | Aria-label for the jump-to-latest button. |
|
|
29
30
|
| jumpIcon | `Snippet` | No | `-` | Custom jump-to-latest icon. Falls back to a built-in asset. |
|
package/build/docs/_index.json
CHANGED
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
},
|
|
38
38
|
{
|
|
39
39
|
"name": "Chat",
|
|
40
|
-
"description": "A full chat surface composing ChatHeader, ChatMessageList, ChatSuggestions, ChatToolStatus, and ChatComposer. Fully controlled (pass `messages`, handle `onsend`) with no baked-in transport. Opt-in features: header image, stop-generation, voice mic, file attachments, prompt suggestions, smart autoscroll, and per-message copy/retry/feedback. Pair with the decoupled `ChatController` runes class — message state, streaming, typewriter reveal, retry, and session threading — which delegates the network call to a pluggable `ChatTransport` (adapt SSE, WebSocket, or polling). Markdown is not bundled — pass pre-sanitized HTML on a message's `html` field."
|
|
40
|
+
"description": "A full chat surface composing ChatHeader, ChatMessageList, ChatSuggestions, ChatToolStatus, and ChatComposer. Fully controlled (pass `messages`, handle `onsend`) with no baked-in transport. Opt-in features: header image, stop-generation, voice mic, file attachments, prompt suggestions, smart autoscroll, and per-message copy/retry/feedback. Render your own UI below any bubble with the `messageAttachments` snippet. Pair with the decoupled `ChatController` runes class — message state, streaming, typewriter reveal, retry, and session threading — which delegates the network call to a pluggable `ChatTransport` (adapt SSE, WebSocket, or polling). Markdown is not bundled — pass pre-sanitized HTML on a message's `html` field."
|
|
41
41
|
},
|
|
42
42
|
{
|
|
43
43
|
"name": "ChatBubble",
|
|
@@ -57,7 +57,7 @@
|
|
|
57
57
|
},
|
|
58
58
|
{
|
|
59
59
|
"name": "ChatMessageList",
|
|
60
|
-
"description": "A scrollable conversation container with smart auto-scroll: it sticks to the bottom only while you're already near it, and shows a jump-to-latest button when you've scrolled up. Renders each message with ChatMessage by default or a
|
|
60
|
+
"description": "A scrollable conversation container with smart auto-scroll: it sticks to the bottom only while you're already near it, and shows a jump-to-latest button when you've scrolled up. Renders each message with ChatMessage by default, adds your own UI below any bubble via the per-message `messageAttachments` snippet, or replaces a message entirely with the `message` snippet, shows an `empty` snippet when there are no messages, and forwards opt-in message actions (allowCopy, onretry, onfeedback). Uses a Svelte action (no effects), respecting reduced-motion."
|
|
61
61
|
},
|
|
62
62
|
{
|
|
63
63
|
"name": "ChatSuggestions",
|
package/package.json
CHANGED