@runtypelabs/persona 3.25.0 → 3.27.0

package/README.md

@@ -92,7 +92,8 @@ const docked = initAgentWidget({
 | `target` | `string \| HTMLElement` | CSS selector or element where widget mounts. |
 | `config` | `AgentWidgetConfig` | Widget configuration object (see [Configuration reference](#configuration-reference) below). |
 | `useShadowDom` | `boolean` | Use Shadow DOM for style isolation (default: `true`). |
-| `onReady` | `() => void` | Callback fired when widget is initialized. |
+| `onChatReady` | `() => void` | Callback fired when the widget is initialized and its API is callable. |
+| `onReady` | `() => void` | **Deprecated** alias of `onChatReady`; still works, removed in the next major. |
 | `windowKey` | `string` | If provided, stores the controller on `window[windowKey]` for global access. Automatically cleaned up on `destroy()`. |
 
 When `config.launcher.mountMode` is `'docked'`, `target` is treated as the page container that Persona should wrap. Use a concrete element such as `#workspace-main`; `body` and `html` are rejected.
@@ -354,7 +355,7 @@ window.chatController.submitMessage("Test message")
 window.chatController.startVoiceRecognition()
 ```
 
-When using the automatic installer script (`install.global.js`), see [Programmatic access with the installer](#programmatic-access-with-the-installer) for additional approaches including the `onReady` callback and `persona:ready` event.
+When using the automatic installer script (`install.global.js`), see [Programmatic access with the installer](#programmatic-access-with-the-installer) for additional approaches including the `onChatReady` callback and `persona:chat-ready` event.
 
 #### Message Types
 
@@ -525,6 +526,31 @@ inside the subtree is still pierced.
 > provenance and update steps. Once upstream republishes correctly this can revert to a
 > normal optional peer dependency.
 
+### WebMCP page tools
+
+When `webmcp: { enabled: true }` is set, the widget consumes tools the page
+registers on `document.modelContext` (the [WebMCP](https://github.com/webmachinelearning/webmcp)
+producer surface), snapshots them into each request as `clientTools[]`, runs the
+agent's calls on the page, and gates each behind a confirm bubble (override with
+`autoApprove` / `onConfirm`).
+
+```ts
+initAgentWidget({
+  // ...config
+  webmcp: {
+    enabled: true,
+    autoApprove: (info) => READ_ONLY_TOOLS.has(info.toolName),
+  },
+});
+```
+
+**Using WebMCP against a non-Runtype backend (e.g. the Vercel AI SDK)?** The
+widget's WebMCP loop expects Runtype's proxy wire protocol (a `step_await` pause
+→ `/resume` round-trip). See
+[`docs/webmcp-without-runtype.md`](../../docs/webmcp-without-runtype.md) for the
+exact contract and two integration paths, with a runnable Next.js example at
+[`examples/ai-sdk-webmcp/`](../../examples/ai-sdk-webmcp/).
+
 ### DOM Events
 
 The widget dispatches custom DOM events that you can listen to for integration with your application:
@@ -594,19 +620,30 @@ window.dispatchEvent(new CustomEvent('persona:focusInput', {
 
 **Instance scoping:** Same as `persona:showEventStream` — use `detail.instanceId` to target a specific widget. Without `instanceId`, all instances receive the event.
 
-#### `persona:ready`
+#### `persona:chat-ready`
 
-Dispatched on `window` by the automatic installer script (`install.global.js`) after the widget is initialized. The `event.detail` contains the `AgentWidgetInitHandle` (the same object returned by `initAgentWidget()`).
+Dispatched on `window` by the automatic installer script (`install.global.js`) when the widget is initialized and its controller API is callable. The `event.detail` contains the `AgentWidgetInitHandle` (the same object returned by `initAgentWidget()`). In a deferred install (the default floating-launcher case) this fires after the user first opens the panel; in an eager install it fires on page load.
 
 ```ts
-window.addEventListener('persona:ready', (e) => {
+window.addEventListener('persona:chat-ready', (e) => {
   const handle = e.detail;
   handle.on('message:sent', (msg) => console.log(msg));
   handle.open();
 });
 ```
 
-> **Note:** This event is only dispatched by the automatic installer script. Direct calls to `initAgentWidget()` return the handle synchronously and do not fire this event.
+The installer also dispatches sibling lifecycle events for diagnostics and analytics:
+
+| Event | `detail` | Fires |
+| --- | --- | --- |
+| `persona:script-load` | `{ version }` | the installer script executed (before any loading) |
+| `persona:launcher-shown` | `{ deferred, element? }` | the floating launcher painted on the page (page-load time) |
+| `persona:chat-ready` | the widget handle | the widget is initialized and its API is callable |
+| `persona:error` | `{ phase, error }` | a load step (`css` / `bundle` / `init`) failed |
+
+> **Note:** These events are only dispatched by the automatic installer script. Direct calls to `initAgentWidget()` return the handle synchronously and do not fire them.
+>
+> `persona:ready` is still dispatched as a **deprecated** alias of `persona:chat-ready` and will be removed in the next major.
 
 ### Controller Events
 
@@ -1528,7 +1565,11 @@ The easiest way is to use the automatic installer script. It handles loading CSS
 - `previewQueryParam` - Query parameter key that gates widget loading; widget only loads when the parameter is present and truthy
 - `useShadowDom` - Use Shadow DOM for style isolation (default: `false`)
 - `windowKey` - If provided, stores the widget handle on `window[windowKey]` for programmatic access
-- `onReady` - Callback fired with the widget handle after initialization; signature: `(handle) => void`
+- `onScriptLoad` - Fired as soon as the installer script executes, before it loads or gates anything (diagnostics / timing); signature: `({ version }) => void`
+- `onLauncherShown` - Fired when the floating launcher is painted on the page (page-load time — for "widget appeared" analytics); signature: `({ deferred, element? }) => void`
+- `onChatReady` - Fired when the widget is initialized and its controller API is callable (after first open in a deferred install); signature: `(handle) => void`
+- `onError` - Fired when a load step fails (`css` / `bundle` / `init`), so ad-blocked / timed-out installs don't fail silently; signature: `({ phase, error }) => void`
+- `onReady` - **Deprecated** alias of `onChatReady`; still works, removed in the next major; signature: `(handle) => void`
 
 **Example with version pinning:**
 
@@ -1549,14 +1590,14 @@ The easiest way is to use the automatic installer script. It handles loading CSS
 
 The installer is fully asynchronous (it waits for framework hydration, then loads CSS and JS). To interact with the widget after it initializes, use one of these approaches:
 
-**`onReady` callback** — best when config and access logic live in the same script:
+**`onChatReady` callback** — best when config and access logic live in the same script:
 
 ```html
 <script>
   window.siteAgentConfig = {
     clientToken: 'YOUR_TOKEN',
     windowKey: 'myChat',
-    onReady(handle) {
+    onChatReady(handle) {
       handle.on('message:sent', (e) => console.log('sent:', e));
       handle.on('message:received', (e) => console.log('received:', e));
     }
@@ -1565,11 +1606,11 @@ The installer is fully asynchronous (it waits for framework hydration, then load
 <script src="https://cdn.jsdelivr.net/npm/@runtypelabs/persona@latest/dist/install.global.js"></script>
 ```
 
-**`persona:ready` event** — best for decoupled integration (e.g. tag managers, separate scripts):
+**`persona:chat-ready` event** — best for decoupled integration (e.g. tag managers, separate scripts):
 
 ```html
 <script>
-  window.addEventListener('persona:ready', (e) => {
+  window.addEventListener('persona:chat-ready', (e) => {
     const handle = e.detail;
     handle.on('message:sent', (e) => console.log('sent:', e));
   });
@@ -1582,7 +1623,7 @@ The installer is fully asynchronous (it waits for framework hydration, then load
 <script src="https://cdn.jsdelivr.net/npm/@runtypelabs/persona@latest/dist/install.global.js"></script>
 ```
 
-**`windowKey`** — stores the handle on `window[windowKey]` for persistent global access. Combine with `onReady` or `persona:ready` to know when it's available:
+**`windowKey`** — stores the handle on `window[windowKey]` for persistent global access. Combine with `onChatReady` or `persona:chat-ready` to know when it's available:
 
 ```html
 <script>
@@ -1594,7 +1635,7 @@ The installer is fully asynchronous (it waits for framework hydration, then load
 <script src="https://cdn.jsdelivr.net/npm/@runtypelabs/persona@latest/dist/install.global.js"></script>
 
 <script>
-  window.addEventListener('persona:ready', () => {
+  window.addEventListener('persona:chat-ready', () => {
     // window.myChat is now available and persists until destroy()
     window.myChat.open();
   });

package/dist/animations/glyph-cycle.d.cts

@@ -1,4 +1,4 @@
-import { S as StreamAnimationPlugin } from './types-BZVr1YOV.cjs';
+import { S as StreamAnimationPlugin } from './types-CxvHw0X6.cjs';
 
 declare const glyphCycle: StreamAnimationPlugin;
 

package/dist/animations/glyph-cycle.d.ts

@@ -1,4 +1,4 @@
-import { S as StreamAnimationPlugin } from './types-BZVr1YOV.js';
+import { S as StreamAnimationPlugin } from './types-CxvHw0X6.js';
 
 declare const glyphCycle: StreamAnimationPlugin;