@alepha/react 0.11.5 → 0.11.7

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Feunard
+Copyright (c) 2025 Nicolas Foures
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -192,7 +192,3 @@ class App {
 
 const router = useRouter<App>();
 router.go("home"); // typesafe
-
-#### useStore()
-
-Hook to access and mutate the Alepha state.

package/dist/index.browser.js

@@ -1,4 +1,4 @@
-import { $env, $hook, $inject, $module, Alepha, AlephaError, Descriptor, KIND, createDescriptor, t } from "@alepha/core";
+import { $atom, $env, $hook, $inject, $module, $use, Alepha, AlephaError, Atom, Descriptor, KIND, createDescriptor, t } from "@alepha/core";
 import { AlephaDateTime, DateTimeProvider } from "@alepha/datetime";
 import { AlephaServer, HttpClient } from "@alepha/server";
 import { AlephaServerLinks, LinkProvider } from "@alepha/server-links";
@@ -417,30 +417,28 @@ const useEvents = (opts, deps) => {
 
 //#endregion
 //#region src/hooks/useStore.ts
-/**
-* Hook to access and mutate the Alepha state.
-*/
-const useStore = (key, defaultValue) => {
+function useStore(target, defaultValue) {
 	const alepha = useAlepha();
 	useMemo(() => {
-		if (defaultValue != null && alepha.state.get(key) == null) alepha.state.set(key, defaultValue);
+		if (defaultValue != null && alepha.state.get(target) == null) alepha.state.set(target, defaultValue);
 	}, [defaultValue]);
-	const [state, setState] = useState(alepha.state.get(key));
+	const [state, setState] = useState(alepha.state.get(target));
 	useEffect(() => {
 		if (!alepha.isBrowser()) return;
+		const key = target instanceof Atom ? target.key : target;
 		return alepha.events.on("state:mutate", (ev) => {
 			if (ev.key === key) setState(ev.value);
 		});
 	}, []);
 	return [state, (value) => {
-		alepha.state.set(key, value);
+		alepha.state.set(target, value);
 	}];
-};
+}
 
 //#endregion
 //#region src/hooks/useRouterState.ts
 const useRouterState = () => {
-	const [state] = useStore("react.router.state");
+	const [state] = useStore("alepha.react.router.state");
 	if (!state) throw new AlephaError("Missing react router state");
 	return state;
 };
@@ -951,7 +949,7 @@ var ReactBrowserRouterProvider = class extends RouterProvider {
 		};
 		await this.alepha.events.emit("react:action:begin", { type: "transition" });
 		await this.alepha.events.emit("react:transition:begin", {
-			previous: this.alepha.state.get("react.router.state"),
+			previous: this.alepha.state.get("alepha.react.router.state"),
 			state
 		});
 		try {
@@ -993,7 +991,7 @@ var ReactBrowserRouterProvider = class extends RouterProvider {
 			const layer = previous[i];
 			if (state.layers[i]?.name !== layer.name) this.pageApi.page(layer.name)?.onLeave?.();
 		}
-		this.alepha.state.set("react.router.state", state);
+		this.alepha.state.set("alepha.react.router.state", state);
 		await this.alepha.events.emit("react:action:end", { type: "transition" });
 		await this.alepha.events.emit("react:transition:end", { state });
 	}
@@ -1005,6 +1003,14 @@ var ReactBrowserRouterProvider = class extends RouterProvider {
 //#endregion
 //#region src/providers/ReactBrowserProvider.ts
 const envSchema = t.object({ REACT_ROOT_ID: t.text({ default: "root" }) });
+/**
+* React browser renderer configuration atom
+*/
+const reactBrowserOptions = $atom({
+	name: "alepha.react.browser.options",
+	schema: t.object({ scrollRestoration: t.enum(["top", "manual"]) }),
+	default: { scrollRestoration: "top" }
+});
 var ReactBrowserProvider = class {
 	env = $env(envSchema);
 	log = $logger();
@@ -1012,7 +1018,7 @@ var ReactBrowserProvider = class {
 	alepha = $inject(Alepha);
 	router = $inject(ReactBrowserRouterProvider);
 	dateTimeProvider = $inject(DateTimeProvider);
-	options = { scrollRestoration: "top" };
+	options = $use(reactBrowserOptions);
 	getRootElement() {
 		const root = this.document.getElementById(this.env.REACT_ROOT_ID);
 		if (root) return root;
@@ -1023,7 +1029,7 @@ var ReactBrowserProvider = class {
 	}
 	transitioning;
 	get state() {
-		return this.alepha.state.get("react.router.state");
+		return this.alepha.state.get("alepha.react.router.state");
 	}
 	/**
 	* Accessor for Document DOM API.
@@ -1185,7 +1191,7 @@ var ReactRouter = class {
 	alepha = $inject(Alepha);
 	pageApi = $inject(ReactPageProvider);
 	get state() {
-		return this.alepha.state.get("react.router.state");
+		return this.alepha.state.get("alepha.react.router.state");
 	}
 	get pages() {
 		return this.pageApi.getPages();
@@ -1543,7 +1549,7 @@ function useAction(options, deps) {
 	}, []);
 	useEffect(() => {
 		if (options.runOnInit) handler(...[]);
-	}, []);
+	}, deps);
 	useEffect(() => {
 		if (!options.runEvery) return;
 		intervalRef.current = dateTimeProvider.createInterval(() => handler(...[]), options.runEvery, true);
@@ -1692,5 +1698,5 @@ const AlephaReact = $module({
 });
 
 //#endregion
-export { $page, AlephaContext, AlephaReact, ClientOnly_default as ClientOnly, ErrorBoundary_default as ErrorBoundary, ErrorViewer_default as ErrorViewer, Link_default as Link, NestedView_default as NestedView, NotFoundPage as NotFound, PageDescriptor, ReactBrowserProvider, ReactBrowserRouterProvider, ReactPageProvider, ReactRouter, Redirection, RouterLayerContext, isPageRoute, ssrSchemaLoading, useAction, useActive, useAlepha, useClient, useEvents, useInject, useQueryParams, useRouter, useRouterState, useSchema, useStore };
+export { $page, AlephaContext, AlephaReact, ClientOnly_default as ClientOnly, ErrorBoundary_default as ErrorBoundary, ErrorViewer_default as ErrorViewer, Link_default as Link, NestedView_default as NestedView, NotFoundPage as NotFound, PageDescriptor, ReactBrowserProvider, ReactBrowserRouterProvider, ReactPageProvider, ReactRouter, Redirection, RouterLayerContext, isPageRoute, reactBrowserOptions, ssrSchemaLoading, useAction, useActive, useAlepha, useClient, useEvents, useInject, useQueryParams, useRouter, useRouterState, useSchema, useStore };
 //# sourceMappingURL=index.browser.js.map