@wirestate/react-mobx [monorepo] [docs]

MobX React reactivity binding for Wirestate React services.

Use this package together with @wirestate/mobx: create observable service state with @wirestate/mobx, then render React components through mobx-react-lite.

Install

npm install @wirestate/core @wirestate/react @wirestate/mobx @wirestate/react-mobx

Start

import { Injectable } from "@wirestate/core";
import { Action, Observable, makeObservable } from "@wirestate/mobx";

@Injectable()
class CounterService {
  @Observable()
  public count = 0;

  public constructor() {
    makeObservable(this);
  }

  @Action()
  public increment(): void {
    this.count++;
  }
}

import { useInjection } from "@wirestate/react";
import { observer } from "@wirestate/react-mobx";

export const Counter = observer(() => {
  const counter = useInjection(CounterService);

  return <button onClick={() => counter.increment()}>{counter.count}</button>;
});

What Is Included

• Re-exports from mobx-react-lite (observer, Observer, useObserver, useLocalObservable, and related helpers). mobx-react-lite ships as a bundled dependency, so you do not install it directly.

Observable definitions and decorator aliases (Observable, Action, Computed, and others) live in @wirestate/mobx.

Learn More

• React MobX guide
• API reference
• MobX React docs

License

MIT