@assemble-inc/chat-widget 0.1.2 → 0.1.4
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 +37 -61
- package/dist/Widget.d.ts +69 -3
- package/dist/embed.d.ts +25 -0
- package/dist/index.d.ts +2 -3
- package/dist/index.js +10023 -3227
- package/dist/server.cjs +31 -8
- package/dist/server.d.cts +29 -5
- package/dist/server.d.ts +29 -5
- package/dist/server.js +31 -8
- package/package.json +3 -2
- package/dist/index.css +0 -1
package/README.md
CHANGED
|
@@ -65,7 +65,7 @@ app.post(
|
|
|
65
65
|
}),
|
|
66
66
|
);
|
|
67
67
|
|
|
68
|
-
app.listen(
|
|
68
|
+
app.listen(3006);
|
|
69
69
|
```
|
|
70
70
|
|
|
71
71
|
### 3. Environment variables
|
|
@@ -109,58 +109,34 @@ npm run build:embed # outputs dist/embed.js
|
|
|
109
109
|
|
|
110
110
|
All configuration is passed as a single `config` prop. Every field is optional.
|
|
111
111
|
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
|
115
|
-
|
|
|
116
|
-
| `
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
|
123
|
-
|
|
|
124
|
-
| `
|
|
125
|
-
| `
|
|
126
|
-
| `
|
|
127
|
-
| `
|
|
128
|
-
| `temperature` | `number` | Response creativity, 0–1. |
|
|
129
|
-
|
|
130
|
-
#### Conversation
|
|
131
|
-
|
|
132
|
-
| Field | Type | Description |
|
|
133
|
-
| ----------------- | -------------------------- | ------------------------------------------------------------------ |
|
|
134
|
-
| `initialMessages` | `Array<{ role, content }>` | Seed messages shown when the widget first opens. |
|
|
135
|
-
| `persist` | `boolean` | Save the conversation to `sessionStorage` across page navigations. |
|
|
136
|
-
|
|
137
|
-
#### User Identity
|
|
138
|
-
|
|
139
|
-
| Field | Type | Description |
|
|
140
|
-
| ------ | ----------------------- | --------------------------------------------------------------------------- |
|
|
141
|
-
| `user` | `{ id?, name?, role? }` | Forwarded in every request body for server-side personalisation or logging. |
|
|
142
|
-
|
|
143
|
-
#### UI
|
|
144
|
-
|
|
145
|
-
| Field | Type | Default | Description |
|
|
146
|
-
| ---------------- | --------------------------------- | ---------------- | --------------------------------- |
|
|
147
|
-
| `title` | `string` | `'Ask ASMBL'` | Header title. |
|
|
148
|
-
| `logo` | `string` | Built-in logo | URL to a custom logo image. |
|
|
149
|
-
| `welcomeHeading` | `string` | — | Heading shown in the empty state. |
|
|
150
|
-
| `placeholder` | `string` | — | Textarea placeholder text. |
|
|
151
|
-
| `position` | `'bottom-right' \| 'bottom-left'` | `'bottom-right'` | Widget anchor corner. |
|
|
112
|
+
| Field | Type | Default | Description |
|
|
113
|
+
| ----------------- | --------------------------------- | ---------------- | -------------------------------------------------------------------------------------------------------------- |
|
|
114
|
+
| `endpoint` | `string` | `'/api/chat'` | Backend chat endpoint URL. |
|
|
115
|
+
| `systemPrompt` | `string` | — | System prompt for this embed. Forwarded to the server; server-side value wins when both are set. |
|
|
116
|
+
| `context` | `string` | — | Additional context appended after the system prompt (e.g. current page, user role). Forwarded to the server. |
|
|
117
|
+
| `mcpServerUrl` | `string` | — | MCP server URL for this embed. Must appear in the server's `mcpCredentials` allowlist; falls back to default. |
|
|
118
|
+
| `model` | `string` | — | Claude model ID (e.g. `'claude-opus-4-5'`). Forwarded to the server; server-side value wins when both are set. |
|
|
119
|
+
| `temperature` | `number` | — | Response creativity, 0–1. Forwarded to the server; server-side value wins when both are set. |
|
|
120
|
+
| `initialMessages` | `Array<{ role, content }>` | — | Seed messages shown when the widget first opens. |
|
|
121
|
+
| `persist` | `boolean` | `false` | Save the conversation to `sessionStorage` across page navigations. |
|
|
122
|
+
| `user` | `{ id?, name?, role? }` | — | Forwarded in every request body for server-side personalisation or logging. |
|
|
123
|
+
| `title` | `string` | `'Ask ASMBL'` | Header title. |
|
|
124
|
+
| `logo` | `string` | Built-in logo | URL to a custom logo image. |
|
|
125
|
+
| `welcomeHeading` | `string` | — | Heading shown in the empty state. |
|
|
126
|
+
| `placeholder` | `string` | — | Textarea placeholder text. |
|
|
127
|
+
| `position` | `'bottom-right' \| 'bottom-left'` | `'bottom-right'` | Widget anchor corner. |
|
|
152
128
|
|
|
153
129
|
### `WidgetProps`
|
|
154
130
|
|
|
155
|
-
| Prop | Type
|
|
156
|
-
| -------------- |
|
|
157
|
-
| `config` | `WidgetConfig`
|
|
158
|
-
| `
|
|
159
|
-
| `
|
|
160
|
-
| `
|
|
161
|
-
| `
|
|
162
|
-
| `
|
|
163
|
-
| `
|
|
131
|
+
| Prop | Type | Default | Description |
|
|
132
|
+
| -------------- | -------------------------------------------------- | ------- | ------------------------------------------------------------------------------------ |
|
|
133
|
+
| `config` | `WidgetConfig` | — | All widget configuration (see above). |
|
|
134
|
+
| `open` | `boolean` | — | Controls open/close state from outside (controlled mode). |
|
|
135
|
+
| `defaultOpen` | `boolean` | `false` | Initial open state when uncontrolled. |
|
|
136
|
+
| `onOpenChange` | `(open: boolean) => void` | — | Called whenever the widget opens or closes. |
|
|
137
|
+
| `onMessage` | `(msg: { role: string; content: string }) => void` | — | Called after each new assistant message is received. |
|
|
138
|
+
| `onError` | `(error: Error) => void` | — | Called when a stream error occurs. |
|
|
139
|
+
| `children` | `ReactNode` | — | Custom content shown in the empty state. Replaces the built-in empty state entirely. |
|
|
164
140
|
|
|
165
141
|
---
|
|
166
142
|
|
|
@@ -170,15 +146,15 @@ These fields are forwarded to the server on every request. **Server-side values
|
|
|
170
146
|
|
|
171
147
|
Returns an Express-compatible `(req, res) => Promise<void>` request handler that streams Claude responses via your MCP server.
|
|
172
148
|
|
|
173
|
-
| Option | Type | Required | Description
|
|
174
|
-
| ---------------- | ------------------------ | -------- |
|
|
175
|
-
| `apiKey` | `string` | Yes | Anthropic API key.
|
|
176
|
-
| `mcpServerUrl` | `string` | Yes | Default
|
|
177
|
-
| `mcpBearerToken` | `string` | No | Bearer token for the default MCP server.
|
|
178
|
-
| `model` | `string` | No | Claude model ID.
|
|
179
|
-
| `systemPrompt` | `string` | No | Operator system prompt.
|
|
180
|
-
| `temperature` | `number` | No | Model temperature.
|
|
181
|
-
| `mcpCredentials` | `Record<string, string>` | No |
|
|
149
|
+
| Option | Type | Required | Description |
|
|
150
|
+
| ---------------- | ------------------------ | -------- | --------------------------------------------------------------------------------------------------------------------------- |
|
|
151
|
+
| `apiKey` | `string` | Yes | Anthropic API key. |
|
|
152
|
+
| `mcpServerUrl` | `string` | Yes | Default MCP server URL. Used when no per-embed URL is provided or the requested URL is not in the allowlist. |
|
|
153
|
+
| `mcpBearerToken` | `string` | No | Bearer token for the default MCP server. |
|
|
154
|
+
| `model` | `string` | No | Claude model ID. Takes precedence over any model sent by the widget. Defaults to `claude-sonnet-4-5`. |
|
|
155
|
+
| `systemPrompt` | `string` | No | Operator system prompt. Takes precedence over any system prompt sent by the widget. |
|
|
156
|
+
| `temperature` | `number` | No | Model temperature (0–1). Takes precedence over any temperature sent by the widget. |
|
|
157
|
+
| `mcpCredentials` | `Record<string, string>` | No | Allowlist of additional MCP server URLs → bearer tokens. Enables per-embed MCP routing. Credentials never leave the server. |
|
|
182
158
|
|
|
183
159
|
#### Precedence rules
|
|
184
160
|
|
|
@@ -265,11 +241,11 @@ npm install
|
|
|
265
241
|
# Copy and fill in environment variables
|
|
266
242
|
cp .env.example .env
|
|
267
243
|
|
|
268
|
-
# Start the Vite dev server (port 3003) + Express API server (port
|
|
244
|
+
# Start the Vite dev server (port 3003) + Express API server (port 3006)
|
|
269
245
|
npm run dev
|
|
270
246
|
```
|
|
271
247
|
|
|
272
|
-
The Vite dev server proxies `/api/*` to `http://localhost:
|
|
248
|
+
The Vite dev server proxies `/api/*` to `http://localhost:3006`.
|
|
273
249
|
|
|
274
250
|
```bash
|
|
275
251
|
npm run lint # type-check without emitting
|
package/dist/Widget.d.ts
CHANGED
|
@@ -1,6 +1,72 @@
|
|
|
1
|
-
export interface
|
|
2
|
-
/**
|
|
1
|
+
export interface WidgetConfig {
|
|
2
|
+
/** Chat endpoint. Defaults to '/api/chat'. */
|
|
3
3
|
endpoint?: string;
|
|
4
|
+
/**
|
|
5
|
+
* Full system prompt for this embed.
|
|
6
|
+
* Used when the server has no systemPrompt in ChatHandlerConfig.
|
|
7
|
+
* The server-side value wins when both are set.
|
|
8
|
+
*/
|
|
9
|
+
systemPrompt?: string;
|
|
10
|
+
/** Additional context appended after the resolved system prompt. */
|
|
11
|
+
context?: string;
|
|
12
|
+
/**
|
|
13
|
+
* MCP server URL for this embed.
|
|
14
|
+
* Must appear in the server's mcpCredentials allowlist.
|
|
15
|
+
* Falls back to the server's default when omitted.
|
|
16
|
+
*/
|
|
17
|
+
mcpServerUrl?: string;
|
|
18
|
+
/**
|
|
19
|
+
* Claude model to use (e.g. 'claude-opus-4-5').
|
|
20
|
+
* Server config value wins when set.
|
|
21
|
+
*/
|
|
22
|
+
model?: string;
|
|
23
|
+
/**
|
|
24
|
+
* Model temperature (0–1). Server config value wins when set.
|
|
25
|
+
*/
|
|
26
|
+
temperature?: number;
|
|
27
|
+
/** Pre-populated messages shown when the widget first opens. */
|
|
28
|
+
initialMessages?: Array<{
|
|
29
|
+
role: 'user' | 'assistant';
|
|
30
|
+
content: string;
|
|
31
|
+
}>;
|
|
32
|
+
/** Persist conversation in sessionStorage across page navigations. */
|
|
33
|
+
persist?: boolean;
|
|
34
|
+
user?: {
|
|
35
|
+
id?: string;
|
|
36
|
+
name?: string;
|
|
37
|
+
role?: string;
|
|
38
|
+
};
|
|
39
|
+
/** Header title. Defaults to 'Ask ASMBL'. */
|
|
40
|
+
title?: string;
|
|
41
|
+
/** URL to a custom logo image. */
|
|
42
|
+
logo?: string;
|
|
43
|
+
/** Heading shown in the empty state. Omit to show nothing. */
|
|
44
|
+
welcomeHeading?: string;
|
|
45
|
+
/** Textarea placeholder text. */
|
|
46
|
+
placeholder?: string;
|
|
47
|
+
/** Widget anchor corner. Defaults to 'bottom-right'. */
|
|
48
|
+
position?: 'bottom-right' | 'bottom-left';
|
|
49
|
+
}
|
|
50
|
+
export interface WidgetProps {
|
|
51
|
+
config?: WidgetConfig;
|
|
52
|
+
/** Control the open/close state from outside (controlled mode). */
|
|
53
|
+
open?: boolean;
|
|
54
|
+
/** Initial open state when uncontrolled. Defaults to false. */
|
|
55
|
+
defaultOpen?: boolean;
|
|
56
|
+
/** Called whenever the widget opens or closes. */
|
|
57
|
+
onOpenChange?: (open: boolean) => void;
|
|
58
|
+
/** Called after each new assistant message is received. */
|
|
59
|
+
onMessage?: (message: {
|
|
60
|
+
role: string;
|
|
61
|
+
content: string;
|
|
62
|
+
}) => void;
|
|
63
|
+
/** Called when a stream error occurs. */
|
|
64
|
+
onError?: (error: Error) => void;
|
|
65
|
+
/**
|
|
66
|
+
* Rendered in the content area when no messages exist yet.
|
|
67
|
+
* Replaces the built-in empty state entirely.
|
|
68
|
+
*/
|
|
69
|
+
children?: React.ReactNode;
|
|
4
70
|
}
|
|
5
|
-
declare const Widget: ({
|
|
71
|
+
declare const Widget: ({ config, open: controlledOpen, defaultOpen, onOpenChange, onMessage, onError, children, }: WidgetProps) => import("react/jsx-runtime").JSX.Element;
|
|
6
72
|
export default Widget;
|
package/dist/embed.d.ts
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { WidgetConfig } from './Widget';
|
|
2
|
+
/**
|
|
3
|
+
* Mount the chat widget into the page without a React build step.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* ```html
|
|
7
|
+
* <script src="https://cdn.example.com/asm-widget/embed.js"></script>
|
|
8
|
+
* <script>
|
|
9
|
+
* AsmWidget.init({
|
|
10
|
+
* title: 'Help',
|
|
11
|
+
* systemPrompt: 'You are a helpful assistant.',
|
|
12
|
+
* endpoint: 'https://my-server.com/api/chat',
|
|
13
|
+
* })
|
|
14
|
+
* </script>
|
|
15
|
+
* ```
|
|
16
|
+
*/
|
|
17
|
+
declare function init(config?: WidgetConfig, targetId?: string): void;
|
|
18
|
+
declare global {
|
|
19
|
+
interface Window {
|
|
20
|
+
AsmWidget: {
|
|
21
|
+
init: typeof init;
|
|
22
|
+
};
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
export {};
|
package/dist/index.d.ts
CHANGED
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
export { default as Widget
|
|
2
|
-
export type {
|
|
3
|
-
export { default } from './Widget';
|
|
1
|
+
export { default as Widget } from './Widget';
|
|
2
|
+
export type { WidgetConfig, WidgetProps } from './Widget';
|