Variable: RetreeProvider#

const RetreeProvider: (props) => ReactElement = defaultRetreeContext.Provider;

Defined in: context.ts:193

Default untyped provider for a per-tree container of Retree roots.

Parameters#

Parameter	Type
`props`	`RetreeProviderProps`<`unknown`>

Returns#

ReactElement

Remarks#

create runs exactly once per mounted provider instance (like useRoot semantics), so each server request in an SSR app — and each test render — gets its own roots instead of sharing module singletons. See createRetreeContext for the full SSR rationale.

This default pair stores the container untyped; pair it with useRootContext and a type argument. When you want the container type to flow with no type arguments, create a dedicated context with createRetreeContext instead.

Example#

import { Retree } from "@retreejs/core";
import { RetreeProvider, useRootContext, useNode } from "@retreejs/react";

const createRoots = () => ({ counter: Retree.root({ count: 0 }) });

function Counter() {
    const { counter } = useRootContext<ReturnType<typeof createRoots>>();
    const state = useNode(counter);
    return <button onClick={() => (state.count += 1)}>{state.count}</button>;
}

export function App() {
    return (
        <RetreeProvider create={createRoots}>
            <Counter />
        </RetreeProvider>
    );
}