Wox Inject is not state management (yet)

Reactive bindings are currently not part of the library. Right now Wox Inject behaves more similar to the React context API than to any other state manager. It only allows you to drive your application logic sepperated from your view logic and intertwin them in a very controlled way. But it doesn't provide any reactivity out of the box.

We recommend using Preact signals (opens in a new tab) to act as glue for this missing feature. It works suprisingly well with Wox Inject.

Signals are reactive primitives for managing application state.

import { Injectable } from '@wox-team/wox-inject';
import { signal } from '@preact/signals-react';
 
@Injectable()
class Controller {
	counterState = signal(0);
	double = computed(() => this.counterState.value * 2);
 
	incriment() {
		this.counter.value++;
	}
}
 
function Counter() {
  const controller = useResolve(Controller);
 
  return (
    <div>
      <p>Count: {double.counterState}</p>
      <p>Double: {double.viewModel}</p>
      <button type="button" onClick={() => controller.incriment()}>click me</button>
    </div>
  );
}