@evit/react

0.1.0 • Public • Published

@evit/react

React bindings for @evit/core — type-safe event subscriptions via useEventEffect.


Features

  • useEventEffect hook for event-driven side effects
  • Fully type-safe payloads and tags
  • Works seamlessly with @evit/core events
  • Lightweight, no external dependencies (except @evit/core)

Installation

You can use any package manager (npm/yarn/pnpm):

pnpm add @evit/react

Peer dependency:

pnpm add @evit/core

Examples

Single event:

import { defineEvent, withPayload } from '@evit/core'
import { useEventEffect } from '@evit/react'

const userCreated = defineEvent('user.created', withPayload<{ id: number }>())

function MyComponent() {
    useEventEffect(userCreated, (payload, tag) => {
        console.log('User ID:', payload.id)
    })

    return null
}

Multiple events:

import { defineEvent, withPayload } from '@evit/core'
import { useEventEffect } from '@evit/react'

const userCreated = defineEvent('user.created', withPayload<{ id: number }>())
const userUpdated = defineEvent('user.updated', withPayload<{ id: number, name: string, age: number }>())

function MyComponent() {
    useEventEffect([userCreated, userUpdated], (payload, tag) => {
        switch (tag) {
            case userCreated.tag: {
                console.log('User ID:', payload.id)
                break
            }

            case userUpdated.tag: {
                console.log('User ID:', payload.id)
                console.log('User name:', payload.name)
                console.log('User age:', payload.age)
                break
            }
        }
    })

    return null
}

License

MIT

Package Sidebar

Install

npm i @evit/react

Weekly Downloads

117

Version

0.1.0

License

MIT

Unpacked Size

12.3 kB

Total Files

9

Last publish

Collaborators

  • rasulomaroff