use-custom-event

A simple utility to create custom event emitter, listener (subscriber) and React hook for listening. Make the event payload strictly typed using zod

Installation

npm install use-custom-event

Usage

import { z } from 'zod';
import { createEventEmitter } from 'use-custom-event';

const { emit, useEventListener } = createEventEmitter(
  'my-event',
  z.object({
    name: z.string(),
  })
);

function App() {
  useEventListener(
    useCallback((data) => {
      console.log(data.name);
    }, [])
  );

  return (
    <button
      onClick={() => {
        emit({
          name: 'drenther',
        });
      }}
    >
      Trigger Event
    </button>
  );
}

Use it for whatever you like and drop us a star!