@melony/react 0.2.0 → 0.2.1
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 +16 -19
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# @melony/react
|
|
2
2
|
|
|
3
|
-
React UI + providers/hooks for building chat experiences on top of **Melony’s event stream
|
|
3
|
+
React UI + providers/hooks for building chat experiences on top of **Melony’s event stream**.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
@@ -49,29 +49,26 @@ function Controls() {
|
|
|
49
49
|
|
|
50
50
|
- **`MelonyProvider`** + **`useMelony()`**
|
|
51
51
|
- Connects to a Melony runtime endpoint.
|
|
52
|
-
- Exposes `events`, `
|
|
52
|
+
- Exposes `events`, `isLoading`, `error`, and `sendEvent()`.
|
|
53
53
|
|
|
54
|
-
##
|
|
54
|
+
## Event Stream & UI
|
|
55
55
|
|
|
56
|
-
|
|
56
|
+
Melony React provides the foundation for building interactive agent UIs. You can listen to the event stream via `useMelony()` and render your own components based on the event types.
|
|
57
57
|
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
};
|
|
58
|
+
```tsx
|
|
59
|
+
const { events } = useMelony();
|
|
60
|
+
|
|
61
|
+
return (
|
|
62
|
+
<div>
|
|
63
|
+
{events.map(event => {
|
|
64
|
+
if (event.type === "text") return <Text key={event.id} content={event.data.content} />;
|
|
65
|
+
if (event.type === "custom-ui") return <MyCustomUI key={event.id} {...event.data} />;
|
|
66
|
+
return null;
|
|
67
|
+
})}
|
|
68
|
+
</div>
|
|
69
|
+
);
|
|
71
70
|
```
|
|
72
71
|
|
|
73
|
-
Frontend: no extra work — it shows up in the message stream.
|
|
74
|
-
|
|
75
72
|
## Development
|
|
76
73
|
|
|
77
74
|
```bash
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@melony/react",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.1",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
"react": ">=18"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"melony": "^0.2.
|
|
36
|
+
"melony": "^0.2.1"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
39
|
"@types/react": "^19.1.12",
|