Skip to content

Function: ContainerProvider()

ts
function ContainerProvider(props: ContainerProviderProps): ReactElement;

Defined in: src/wirestate-react/provision/container-provider.ts:98

Provides a root Wirestate container to a React subtree.

Parameters

ParameterTypeDescription
propsContainerProviderPropsProvider props.

Returns

ReactElement

React context provider for the active container.

Remarks

Two modes:

  • External container: passed through, provisioned, never disposed.
  • Managed config: created by the provider, provisioned, disposed on unmount.

Managed containers activate all bindings by default. Pass activate: false to keep them lazy.

Managed config is construction-only: it is read once when the provider mounts, and later changes are ignored. Pass a React key to the provider to recreate the container explicitly.

Throws

WirestateError if props are invalid or provider mode changes.

Example

tsx
import { Injectable } from "@wirestate/core";
import { ContainerProvider } from "@wirestate/react";
import { useMemo } from "react";

@Injectable()
class CounterService {}

export function Application() {
  const config = useMemo(() => ({ bindings: [CounterService] }), []);

  return (
    <ContainerProvider config={config}>
      <Counter />
    </ContainerProvider>
  );
}