https://github.com/springtype-org/st-bus
~200 byte nano event bus library
https://github.com/springtype-org/st-bus
Last synced: 8 months ago
JSON representation
~200 byte nano event bus library
- Host: GitHub
- URL: https://github.com/springtype-org/st-bus
- Owner: springtype-org
- License: mit
- Created: 2021-02-03T23:32:15.000Z (about 5 years ago)
- Default Branch: main
- Last Pushed: 2021-02-04T01:38:23.000Z (about 5 years ago)
- Last Synced: 2025-02-05T12:17:38.009Z (about 1 year ago)
- Language: TypeScript
- Homepage:
- Size: 203 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
Awesome Lists containing this project
README
SpringType: st-bus
> Nano event bus library
[](https://gitter.im/springtype-official/springtype?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)
Purpose
This is an exremely tiny, yet powerful eventing library. `st-bus` makes it easy to decouple components. If one component wants to tell another component that something happend, `emit` is called. In another component, `on` is called to listen for such events.
Features
- ✅ Implements a socket.io-like publish/subscribe API
- ✅ Tiny: `136 byte` (best, brotli) - `267 byte` (worst, umd, gz)
- ✅ Zero dependencies
- ✅ First class TypeScript support
- ✅ 100% Unit Test coverage
How to
This is how `st-bus` is used:
```tsx
import { tsx, render, Ref } from 'springtype';
import { $ } from 'st-query';
import { bus } from 'st-bus';
interface ChatMessage {
user: string;
time: number;
text: string;
}
const TrollBox = () => {
const chatMessagesRef: Ref = {};
// local messages state
const msgs = [];
bus.on('chat:message', (event: ChatMessage) => {
// add message to local state
msgs.push(
{new Date(event.time).toUTCString()}
{event.user}:
{event.text}
,
);
// re-render all messages
$(chatMessagesRef.current).html(
{msgs});
});
return (
Chat room:
);
};
const TrollInput = () => {
const chatMessageInputRef: Ref = {};
const sendMessage = () => {
bus.emit('chat:message', {
user: 'Anonymous',
time: Date.now(),
text: $(chatMessageInputRef.current).val(),
});
// reset input
$(chatMessageInputRef.current).val('');
};
return (
{
if (evt.keyCode === 13) {
sendMessage();
}
}}
type="text"
/>
Send
);
};
const AlterEgoChat = () => (
);
render();
```
API
The following contract is made between the webapp and `st-bus`:
```typescript
export interface API {
subscribers: Array;
on(topic: string, handler: EventHandler): number;
off(subscriberId: number): void;
emit(topic: string, event: any): void;
}
```
Backers
Thank you so much for supporting us financially! 🙏🏻😎🥳👍
Maintainers
`st-bus` is brought to you by:
Contributing
Please help out to make this project even better and see your name added to the list of our
[CONTRIBUTORS.md](./CONTRIBUTORS.md) :tada:
