@anam-ai/agent-widget 0.3.1 → 0.4.0

package/README.md

@@ -126,6 +126,9 @@ The widget dispatches custom DOM events on the `<anam-agent>` element:
 | `anam-agent:error` | `{ code, message }` | Error occurred |
 | `anam-agent:mic-muted` | `{}` | Microphone muted |
 | `anam-agent:mic-unmuted` | `{}` | Microphone unmuted |
+| `anam-agent:tool-call-started` | `{ toolName, toolCallId, toolType, toolSubtype?, arguments }` | Agent invoked a tool |
+| `anam-agent:tool-call-completed` | `{ toolName, toolCallId, toolType, toolSubtype?, result, executionTime, documentsAccessed? }` | Tool call finished (`executionTime` in ms; `documentsAccessed` is RAG-only) |
+| `anam-agent:tool-call-failed` | `{ toolName, toolCallId, toolType, toolSubtype?, errorMessage, executionTime }` | Tool call failed (`executionTime` in ms) |
 
 ```javascript
 document.querySelector('anam-agent').addEventListener('anam-agent:session-started', (e) => {
@@ -133,6 +136,23 @@ document.querySelector('anam-agent').addEventListener('anam-agent:session-starte
 });
 ```
 
+### Reacting to tool calls
+
+When your agent invokes a client-side tool (e.g. `redirect`, `add_to_cart`), the
+widget surfaces it as a DOM event so your page can act on it — no SDK wiring
+required. The `toolType` field distinguishes client-side tools from server-side
+ones, so you can react only to the ones meant for the browser:
+
+```javascript
+document.querySelector('anam-agent').addEventListener('anam-agent:tool-call-started', (e) => {
+  const { toolName, toolType, arguments: args } = e.detail;
+  if (toolType !== 'client') return; // server-side tools run on Anam's side
+  if (toolName === 'redirect') {
+    window.location.href = args.url;
+  }
+});
+```
+
 ## Development
 
 ### Prerequisites