@taylor-ben/rxjs-hooks
TypeScript icon, indicating that this package has built-in type declarations

1.0.1 • Public • Published

@taylor-ben/rxjs-hooks

This npm package provides easy-to-use React hooks for working with RxJS subjects and behavior subjects.

Installation

To install this package, run the following command:

npm install @taylor-ben/rxjs-hooks

Usage

To use this package, simply import the hooks you need into your React component:

import { useSubject, useBehaviorSubject } from "@taylor-ben/rxjs-hooks";

useSubject

The useSubject hook allows you to subscribe to an existing subject and fire events to all subscribers. It takes two inputs: the subject to subscribe to, and a callback function that will be fired on each event. It does not have a current value, but it does return a function to fire new events to all subscribers.

Here's an example of how to use it:

import { useSubject } from "@taylor-ben/rxjs-hooks";

const mySubject = new Subject();

function MyComponent() {
  const fireNextEvent = useSubject(mySubject, (event) => {
    console.log(event);
  });

  function handleClick() {
    fireNextEvent("Hello, world!");
  }

  return (
    <div>
      <button onClick={handleClick}>Emit Event</button>
    </div>
  );
}

useBehaviorSubject

The useBehaviorSubject hook allows you to subscribe to an existing behavior subject and maintain a current state. It takes two inputs: the behavior subject to subscribe to, and a callback function that will be fired on each event. It returns the current value of the behavior subject, as well as a function to update the current value.

Here's an example of how to use it:

import { useBehaviorSubject } from "@taylor-ben/rxjs-hooks";

const myBehaviorSubject = new BehaviorSubject("initial value");

function MyComponent() {
  const [value, setValue] = useBehaviorSubject(myBehaviorSubject, (event) => {
    console.log(event);
  });

  function handleClick() {
    setValue("new value");
  }

  return (
    <div>
      <button onClick={handleClick}>Change State</button>
    </div>
  );
}

Differences Between Subjects and Behavior Subjects

While both subjects and behavior subjects can be used to emit and subscribe to events, there is a key difference between the two:

  • Subjects are point-in-time events, meaning they are emitted and then immediately forgotten. They do not maintain a current state.
  • Behavior subjects are periods between two points, or states. They maintain a current state that can be updated and subscribed to.

License

This package is licensed under the MIT License. See the LICENSE file for more information.

Package Sidebar

Install

npm i @taylor-ben/rxjs-hooks

Weekly Downloads

2

Version

1.0.1

License

MIT

Unpacked Size

6.25 kB

Total Files

5

Last publish

Collaborators

  • taylor-ben