@bloqz/relay 2.0.1 → 2.0.2
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 +34 -28
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
# @bloqz/relay
|
|
2
2
|
|
|
3
|
-
The `@bloqz/relay` package provides a lightweight, RxJS-powered event bus for enabling communication between different parts of an application. It uses a flexible subscription model
|
|
3
|
+
The `@bloqz/relay` package provides a lightweight, RxJS-powered event bus for enabling communication between different parts of an application. It uses a flexible subscription model and supports TypeScript generics for full type safety.
|
|
4
4
|
|
|
5
5
|
## Core Concepts
|
|
6
6
|
|
|
7
7
|
- **Relay**: An event bus that allows for emitting and listening to events.
|
|
8
8
|
- **Topics**: Named channels for events (e.g., 'user', 'cart'), allowing for targeted communication.
|
|
9
|
-
- **Events**: The data payload associated with a topic
|
|
10
|
-
- **Pattern Matching**: A simple yet powerful syntax for subscribing to events based on their topic and type.
|
|
9
|
+
- **Events**: The data payload associated with a topic. All events must be objects and are recommended to have a `type` property.
|
|
11
10
|
|
|
12
11
|
## Installation
|
|
13
12
|
|
|
@@ -15,7 +14,7 @@ This package is part of the Bloqz monorepo. To use it, add it as a dependency in
|
|
|
15
14
|
|
|
16
15
|
```json
|
|
17
16
|
"dependencies": {
|
|
18
|
-
"@bloqz/relay": "
|
|
17
|
+
"@bloqz/relay": "2.0.2"
|
|
19
18
|
}
|
|
20
19
|
```
|
|
21
20
|
|
|
@@ -32,53 +31,60 @@ import { createRelay } from '@bloqz/relay';
|
|
|
32
31
|
const appRelay = createRelay();
|
|
33
32
|
```
|
|
34
33
|
|
|
34
|
+
### Type Safety
|
|
35
|
+
|
|
36
|
+
You can define the events available in your relay to get full TypeScript support.
|
|
37
|
+
|
|
38
|
+
```typescript
|
|
39
|
+
import { createRelay, RelayEventsMap } from '@bloqz/relay';
|
|
40
|
+
|
|
41
|
+
interface AppEvents extends RelayEventsMap {
|
|
42
|
+
user: { type: 'login'; userId: string } | { type: 'logout' };
|
|
43
|
+
cart: { type: 'add'; productId: string };
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
const appRelay = createRelay<AppEvents>();
|
|
47
|
+
|
|
48
|
+
// Types are checked here!
|
|
49
|
+
appRelay.emit('user', { type: 'login', userId: '123' });
|
|
50
|
+
```
|
|
51
|
+
|
|
35
52
|
### Emitting Events
|
|
36
53
|
|
|
37
|
-
You can emit an event to a specific topic using the `emit` method.
|
|
54
|
+
You can emit an event to a specific topic using the `emit` method.
|
|
38
55
|
|
|
39
56
|
```typescript
|
|
40
57
|
appRelay.emit('user', { type: 'login', userId: '123' });
|
|
41
58
|
appRelay.emit('notifications', { type: 'new', message: 'Welcome!' });
|
|
42
59
|
```
|
|
43
60
|
|
|
44
|
-
### Listening
|
|
61
|
+
### Listening for Events
|
|
62
|
+
|
|
63
|
+
You can listen for events on a specific topic or use the wildcard `*` to listen to all events. The `on` method returns an `unsubscribe` function.
|
|
64
|
+
|
|
65
|
+
#### Specific Topic
|
|
45
66
|
|
|
46
|
-
|
|
67
|
+
When listening to a specific topic, the handler receives the event object.
|
|
47
68
|
|
|
48
69
|
```typescript
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
console.log(`Received event '${event.type}' on topic '${topic}'`);
|
|
70
|
+
const unsubscribe = appRelay.on('user', (event) => {
|
|
71
|
+
console.log(`User event received: ${event.type}`);
|
|
52
72
|
});
|
|
53
73
|
|
|
54
74
|
// To stop listening
|
|
55
75
|
unsubscribe();
|
|
56
76
|
```
|
|
57
77
|
|
|
58
|
-
|
|
78
|
+
#### Wildcard
|
|
59
79
|
|
|
60
|
-
|
|
80
|
+
When listening with `*`, the handler receives both the topic name and the event object.
|
|
61
81
|
|
|
62
82
|
```typescript
|
|
63
|
-
const unsubscribe = appRelay.on((topic, event) => {
|
|
64
|
-
|
|
65
|
-
}, (topic, event) => {
|
|
66
|
-
console.log('User logged in:', event);
|
|
83
|
+
const unsubscribe = appRelay.on('*', (topic, event) => {
|
|
84
|
+
console.log(`Event '${event.type}' received on topic '${topic}'`);
|
|
67
85
|
});
|
|
68
86
|
```
|
|
69
87
|
|
|
70
|
-
### Pattern Matching Syntax
|
|
71
|
-
|
|
72
|
-
The pattern matching syntax provides a concise way to subscribe to events:
|
|
73
|
-
|
|
74
|
-
| Pattern | Description |
|
|
75
|
-
| ----------------------- | ----------------------------------------------------- |
|
|
76
|
-
| `*` | Matches any topic and any event type. |
|
|
77
|
-
| `user` | Matches any event on the `user` topic. |
|
|
78
|
-
| `user|cart` | Matches any event on the `user` or `cart` topics. |
|
|
79
|
-
| `*.login` | Matches `login` events on any topic. |
|
|
80
|
-
| `user.{login|logout}` | Matches `login` or `logout` events on the `user` topic. |
|
|
81
|
-
|
|
82
88
|
### Disposing the Relay
|
|
83
89
|
|
|
84
90
|
When a relay is no longer needed, you can dispose of it to complete the underlying event stream and unsubscribe all listeners.
|