hook-store-bridge/dist/index.js

A utility to bridge React hook state into Zustand or other state management libraries.

import { createSelectors } from "./util-BoIMZ-ii.js";
import { createContext, useContext, useEffect, useRef } from "react";
import { createStore } from "zustand";
import { jsx } from "react/jsx-runtime";

//#region src/store.ts
const createDefaultZustandStoreOptions = () => ({
	createStore: (initState) => {
		const store = createStore(() => ({ ...initState }));
		return createSelectors(store);
	},
	updateState: (store, newState) => {
		store.setState(newState);
	}
});

//#endregion
//#region src/bridge.tsx
function createHookBridge({ useStoreLogic, createStoreConfig }) {
	const storeConfig = (createStoreConfig ?? createDefaultZustandStoreOptions)();
	const StoreContext = createContext(null);
	function StoreProvider({ logicArgs = [], children }) {
		const { tracked: trackedState, methods = {} } = useStoreLogic(...logicArgs);
		const storeRef = useRef(null);
		if (storeRef.current === null) storeRef.current = {
			store: storeConfig.createStore(trackedState),
			methods
		};
		else storeRef.current.methods = methods;
		const dependencies = Object.values(trackedState);
		useEffect(() => {
			if (storeRef.current) storeConfig.updateState(storeRef.current.store, trackedState);
		}, dependencies);
		return /* @__PURE__ */ jsx(StoreContext.Provider, {
			value: storeRef.current,
			children
		});
	}
	function useBridgedStore() {
		const context = useContext(StoreContext);
		if (!context) throw new Error("`useBridgedStore` must be used within a `StoreProvider`.");
		return {
			store: context.store,
			...context.methods
		};
	}
	return {
		useBridgedStore,
		StoreProvider
	};
}

//#endregion
export { createHookBridge };
//# sourceMappingURL=index.js.map