@economic/agents-react 0.1.0
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 +63 -0
- package/dist/index.d.mts +25 -0
- package/dist/index.mjs +38 -0
- package/package.json +37 -0
package/README.md
ADDED
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
# @economic/agents-react
|
|
2
|
+
|
|
3
|
+
React hooks for connecting to AI chat agents.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install @economic/agents-react
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Usage
|
|
12
|
+
|
|
13
|
+
```tsx
|
|
14
|
+
import { useAIChatAgent } from "@economic/agents-react";
|
|
15
|
+
|
|
16
|
+
const { agent, chat } = useAIChatAgent({
|
|
17
|
+
agent: "my-agent",
|
|
18
|
+
host: "https://my-agent.workers.dev",
|
|
19
|
+
chatId: "session-123",
|
|
20
|
+
toolContext: {
|
|
21
|
+
currentDateTime: new Date().toISOString(),
|
|
22
|
+
},
|
|
23
|
+
connectionParams: {
|
|
24
|
+
userId: "user-id",
|
|
25
|
+
token: "auth-token",
|
|
26
|
+
},
|
|
27
|
+
onConnectionStatusChange: (status) => {
|
|
28
|
+
console.log("Connection status:", status);
|
|
29
|
+
},
|
|
30
|
+
});
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
## API
|
|
34
|
+
|
|
35
|
+
### `useAIChatAgent(options)`
|
|
36
|
+
|
|
37
|
+
Returns `{ agent, chat }` where:
|
|
38
|
+
|
|
39
|
+
- `agent` - The agent connection from `useAgent`
|
|
40
|
+
- `chat` - The chat interface from `useAgentChat`
|
|
41
|
+
|
|
42
|
+
#### Options
|
|
43
|
+
|
|
44
|
+
| Option | Type | Description |
|
|
45
|
+
| -------------------------- | ----------------------------------------- | ---------------------------------------- |
|
|
46
|
+
| `agent` | `string` | Agent name |
|
|
47
|
+
| `host` | `string` | Agent host URL |
|
|
48
|
+
| `chatId` | `string` | Unique chat session ID |
|
|
49
|
+
| `basePath` | `string?` | Optional base path |
|
|
50
|
+
| `toolContext` | `Record<string, unknown>?` | Optional context passed to tools |
|
|
51
|
+
| `connectionParams` | `Record<string, string>?` | Optional query parameters for connection |
|
|
52
|
+
| `onConnectionStatusChange` | `(status: AgentConnectionStatus) => void` | Callback for connection status changes |
|
|
53
|
+
| `onOpen` | `(event: Event) => void` | WebSocket open handler |
|
|
54
|
+
| `onClose` | `(event: CloseEvent) => void` | WebSocket close handler |
|
|
55
|
+
| `onError` | `(event: ErrorEvent) => void` | WebSocket error handler |
|
|
56
|
+
|
|
57
|
+
### `AgentConnectionStatus`
|
|
58
|
+
|
|
59
|
+
```ts
|
|
60
|
+
type AgentConnectionStatus = "connecting" | "connected" | "disconnected" | "unauthorized";
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
Initial publish.
|
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { useAgentChat } from "@cloudflare/ai-chat/react";
|
|
2
|
+
import { useAgent } from "agents/react";
|
|
3
|
+
import { UIMessage } from "ai";
|
|
4
|
+
|
|
5
|
+
//#region src/index.d.ts
|
|
6
|
+
type AgentConnectionStatus = "connecting" | "connected" | "disconnected" | "unauthorized";
|
|
7
|
+
interface UseAIChatAgentOptions {
|
|
8
|
+
agent: string;
|
|
9
|
+
host: string;
|
|
10
|
+
basePath?: string;
|
|
11
|
+
chatId: string;
|
|
12
|
+
toolContext?: Record<string, unknown>;
|
|
13
|
+
connectionParams?: Record<string, string>;
|
|
14
|
+
onConnectionStatusChange?: (status: AgentConnectionStatus) => void;
|
|
15
|
+
onOpen?: (event: Event) => void;
|
|
16
|
+
onClose?: (event: CloseEvent) => void;
|
|
17
|
+
onError?: (event: ErrorEvent) => void;
|
|
18
|
+
}
|
|
19
|
+
type UseAIChatAgentResult = {
|
|
20
|
+
agent: ReturnType<typeof useAgent>;
|
|
21
|
+
chat: ReturnType<typeof useAgentChat<unknown, UIMessage>>;
|
|
22
|
+
};
|
|
23
|
+
declare function useAIChatAgent(options: UseAIChatAgentOptions): UseAIChatAgentResult;
|
|
24
|
+
//#endregion
|
|
25
|
+
export { AgentConnectionStatus, UseAIChatAgentOptions, useAIChatAgent };
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { useAgentChat } from "@cloudflare/ai-chat/react";
|
|
2
|
+
import { useAgent } from "agents/react";
|
|
3
|
+
//#region src/index.ts
|
|
4
|
+
function useAIChatAgent(options) {
|
|
5
|
+
const { agent: agentName, host, basePath, chatId, toolContext, connectionParams, onConnectionStatusChange, onOpen: onOpenProp, onClose: onCloseProp, onError: onErrorProp } = options;
|
|
6
|
+
const agent = useAgent({
|
|
7
|
+
agent: agentName,
|
|
8
|
+
host,
|
|
9
|
+
basePath,
|
|
10
|
+
name: chatId,
|
|
11
|
+
query: connectionParams ?? {},
|
|
12
|
+
queryDeps: Object.keys(connectionParams ?? {}),
|
|
13
|
+
onOpen: (event) => {
|
|
14
|
+
onConnectionStatusChange?.("connected");
|
|
15
|
+
onOpenProp?.(event);
|
|
16
|
+
},
|
|
17
|
+
onClose: (event) => {
|
|
18
|
+
if (event.code >= 3e3) {
|
|
19
|
+
onConnectionStatusChange?.("unauthorized");
|
|
20
|
+
agent.close();
|
|
21
|
+
onCloseProp?.(event);
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
onConnectionStatusChange?.("disconnected");
|
|
25
|
+
onCloseProp?.(event);
|
|
26
|
+
},
|
|
27
|
+
onError: onErrorProp
|
|
28
|
+
});
|
|
29
|
+
return {
|
|
30
|
+
agent,
|
|
31
|
+
chat: useAgentChat({
|
|
32
|
+
agent,
|
|
33
|
+
body: toolContext ?? {}
|
|
34
|
+
})
|
|
35
|
+
};
|
|
36
|
+
}
|
|
37
|
+
//#endregion
|
|
38
|
+
export { useAIChatAgent };
|
package/package.json
ADDED
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@economic/agents-react",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"license": "MIT",
|
|
5
|
+
"files": [
|
|
6
|
+
"dist"
|
|
7
|
+
],
|
|
8
|
+
"type": "module",
|
|
9
|
+
"types": "./dist/index.d.mts",
|
|
10
|
+
"exports": {
|
|
11
|
+
".": "./dist/index.mjs",
|
|
12
|
+
"./package.json": "./package.json"
|
|
13
|
+
},
|
|
14
|
+
"scripts": {
|
|
15
|
+
"build": "tsdown",
|
|
16
|
+
"dev": "tsdown --watch",
|
|
17
|
+
"test": "vitest",
|
|
18
|
+
"typecheck": "tsc --noEmit",
|
|
19
|
+
"prepublishOnly": "npm run build"
|
|
20
|
+
},
|
|
21
|
+
"devDependencies": {
|
|
22
|
+
"@cloudflare/ai-chat": "^0.4.2",
|
|
23
|
+
"@cloudflare/workers-types": "^4.20260412.1",
|
|
24
|
+
"@types/node": "^25.6.0",
|
|
25
|
+
"@typescript/native-preview": "7.0.0-dev.20260412.1",
|
|
26
|
+
"ai": "^6.0.158",
|
|
27
|
+
"tsdown": "^0.21.7",
|
|
28
|
+
"typescript": "^6.0.2",
|
|
29
|
+
"vitest": "^4.1.4"
|
|
30
|
+
},
|
|
31
|
+
"peerDependencies": {
|
|
32
|
+
"@cloudflare/ai-chat": ">=0.1.0 <1.0.0",
|
|
33
|
+
"agents": "^0.10.1",
|
|
34
|
+
"ai": "^6.0.0",
|
|
35
|
+
"react": "^19.2.5"
|
|
36
|
+
}
|
|
37
|
+
}
|