crux-wrapper/dist/react/CoreProvider.d.ts

A React provider for your crux application

import { wrap } from "../index.js";
import type { CoreConfig, Constructor, CruxEntity } from "../index.js";
import react from "react";
import { State, type Selector } from "./state.js";
import type { CoreViewModel } from "crux-wrapper/react";
import type { Request } from "../types.js";
type CruxApi = ReturnType<typeof wrap>;
type StoreApi = {
    dispatch: CruxApi["send"];
    logs: CruxApi["logs"];
    state?: State;
    /** whether the core has been loaded into memory and ready to be used */
    ready: boolean;
};
export declare const CoreContext: react.Context<StoreApi>;
type BaseProps = {
    children: React.ReactNode;
    coreConfig: CoreConfig<CoreViewModel, Request>;
};
type StatelessProps = BaseProps & {
    RenderEffect?: undefined;
    initialState?: undefined;
    mergeViewModel?: never;
};
type StatefulProps = BaseProps & {
    /**
     * Will allow the provider to expose the `useViewMode` hook and compute state updates for you
     */
    RenderEffect: Constructor<any>;
    /**
     * Initial state that is going to be loaded before any interaction with the core happens
     */
    initialState: CoreViewModel;
    /**
     * optional function that will be called when a new view model is given by a `render` effect.
     * This function could be used to optimize re-rendering and only update slices of the state that have changed on every render.
     * The main issue with Crux, is that a render will yield a completely new view model on every render. Which means that every object in the view model tree will be a new instance on every render.
     * So react will re-render every component that uses the view model, even if the data has not changed.
     *
     * This function allows you to take the old view model and the new one and merge them together trying to keep unchanged object references as stable as possible
     */
    mergeViewModel?: (newViewModel: CoreViewModel, oldViewModel: CoreViewModel) => CoreViewModel;
};
type Props = StatelessProps | StatefulProps;
/**
 * Provides a context that exposes the crux api.
 */
export declare function CoreProvider({ children, coreConfig, RenderEffect, initialState, mergeViewModel, }: Props): react.FunctionComponentElement<react.ProviderProps<StoreApi>>;
export declare function useDispatch(): (event: CruxEntity) => Promise<void>;
/**
 * Subscribe to changes to the crux viewModel.
 * This hooks only works if a RenderEffect class was given when mounting the `CruxProvider` component.
 * @param selector allows selecting a slice of the state and only subscribing to changes to that particular slice
 */
export declare function useViewModel<T = CoreViewModel>(selector?: Selector<T>): T;
/**
 * This hook will return a function that could give you the current loaded state.
 * It gives you direct access to the viewmodel state at instant T without subscribing to changes.
 */
export declare function useViewModelGetter<T = CoreViewModel>(selector?: Selector<T>): () => T;
/**
 * Will subscribe to logs from the core and return a reactive state containing the logs from the core.
 */
export declare function useLogs(): import("../eventSender.js").EventSenderLog[];
/**
 * This hook will return a function that could give you the current logs.
 * It gives you direct access to the logs at instant T without subscribing to changes.
 */
export declare function useGetLogs(): () => import("../eventSender.js").EventSenderLog[];
/**
 * Subscribes to the changes of the `read` state of the core.
 * This hook could be used to show a loading state while the core is being initialized.
 * There is no particular need to wait for this property to be true before sending events to the core, as the core will handle them once it is ready.
 */
export declare function useIsReady(): boolean;
export {};
//# sourceMappingURL=CoreProvider.d.ts.map