@bloc-js/react-bloc/lib-esnext/hooks.js

React components for implementing the BLoC pattern.

import * as React from "react";
import { useEffect, useState } from "react";
import { BlocRootContext } from "./bloc-root";
import { blocGetter, } from "./registry";
export function useBloc(fn, ...args) {
    const registry = React.useContext(BlocRootContext);
    const bloc = React.useMemo(() => fn(registry, ...args), [registry, ...args]);
    return bloc;
}
export function useBlocScoped(fn, done, ...args) {
    const registry = React.useContext(BlocRootContext);
    const bloc = React.useMemo(() => fn(registry, ...args), [registry, ...args]);
    React.useEffect(() => {
        return () => done(registry);
    }, [registry]);
    return bloc;
}
export function useBlocState(bloc) {
    const [state, setState] = useState(bloc.value);
    useEffect(() => {
        const subscription = bloc.subscribe(setState);
        return () => subscription.unsubscribe();
    }, [bloc]);
    return state;
}
export function createHooks(id, factory) {
    const [getBloc, done] = blocGetter(id, factory);
    const useBlocHook = (...args) => useBloc(getBloc, ...args);
    const useBlocScopedHook = (...args) => useBlocScoped(getBloc, done, ...args);
    const useState = () => useBlocState(useBlocHook());
    return {
        getBloc,
        useBloc: useBlocHook,
        useBlocScoped: useBlocScopedHook,
        useState,
    };
}