React Injection

Injection hooks let React components read services and values from the active container.

Required Injection

Use useInjection when the value must exist.

import { useInjection } from "@wirestate/react";
import { CounterService } from "./CounterService";

export function Counter() {
  const counter = useInjection(CounterService);

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

useInjection throws when the token cannot be resolved.

Optional Injection

Pass optional when a missing binding is valid - the hook returns undefined instead of throwing when the token is not bound. It still throws when the component is not rendered under a <ContainerProvider>: optional covers an unbound token, not a missing container.

import { useInjection } from "@wirestate/react";

function Diagnostics() {
  const logger = useInjection(LoggerService, { optional: true });

  return <span>{logger ? "Logging enabled" : "Logging disabled"}</span>;
}

Provide a fallback, which implies optional, for the unbound case. The fallback can be a raw value or a (container) => value factory.

// Raw value: used as-is when the token is not bound.
const name = useInjection(UserName, { fallback: "guest" });

// Factory: lazy, receives the container, runs only when the token is missing.
const logger = useInjection(FileLogger, { fallback: (container) => container.get(ConsoleLogger) });

Memoization

useInjection memoizes the lookup on the active container, the token, and optional. Rebinding the same token on the same container does not refresh an already rendered component, and a fallback is captured on the first miss. Remount the provider with a React key when the component must re-resolve.

Container

useContainer returns the active container. Use it when a component needs container-level operations.

import { useContainer } from "@wirestate/react";

function DebugFlag() {
  const container = useContainer();

  return <span>{String(container.has(DebugService))}</span>;
}

Messaging

Injection also resolves the message buses. To send, inject the bus and call it (useInjection(CommandBus).execute(...)). To subscribe, use the lifecycle-managed useOnCommand / useOnQuery / useOnEvents hooks. See Commands, Queries, and Events.

API Reference

useInjection, useContainer.