@alepha/react 0.13.1 → 0.13.3

package/dist/auth/index.js

@@ -13,7 +13,7 @@ var ReactAuthProvider = class {
 		handler: async ({ request, state }) => {
 			if (request?.user) {
 				const { token, realm, ...user } = request.user;
-				this.alepha.state.set("alepha.server.request.user", user);
+				this.alepha.store.set("alepha.server.request.user", user);
 				state.user = user;
 			}
 		}
@@ -29,6 +29,7 @@ var ReactAuth = class {
 	log = $logger();
 	alepha = $inject(Alepha);
 	httpClient = $inject(HttpClient);
+	linkProvider = $inject(LinkProvider);
 	onBeginTransition = $hook({
 		on: "react:transition:begin",
 		handler: async (event) => {
@@ -47,14 +48,18 @@ var ReactAuth = class {
 	* Alias for `alepha.state.get("user")`
 	*/
 	get user() {
-		return this.alepha.state.get("alepha.server.request.user");
+		return this.alepha.store.get("alepha.server.request.user");
 	}
 	async ping() {
 		const { data } = await this.httpClient.fetch(alephaServerAuthRoutes.userinfo, { schema: { response: userinfoResponseSchema } });
-		this.alepha.state.set("alepha.server.request.apiLinks", data.api);
-		this.alepha.state.set("alepha.server.request.user", data.user);
+		this.alepha.store.set("alepha.server.request.apiLinks", data.api);
+		this.alepha.store.set("alepha.server.request.user", data.user);
 		return data.user;
 	}
+	can(action) {
+		if (!this.user) return false;
+		return this.linkProvider.can(action);
+	}
 	async login(provider, options) {
 		if (options.username || options.password) {
 			const { data } = await this.httpClient.fetch(`${options.hostname || ""}${alephaServerAuthRoutes.token}?provider=${provider}`, {
@@ -66,8 +71,8 @@ var ReactAuth = class {
 				}),
 				schema: { response: tokenResponseSchema }
 			});
-			this.alepha.state.set("alepha.server.request.apiLinks", data.api);
-			this.alepha.state.set("alepha.server.request.user", data.user);
+			this.alepha.store.set("alepha.server.request.apiLinks", data.api);
+			this.alepha.store.set("alepha.server.request.user", data.user);
 			return data;
 		}
 		if (this.alepha.isBrowser()) {
@@ -116,7 +121,7 @@ const useAuth = () => {
 */
 const AlephaReactAuth = $module({
 	name: "alepha.react.auth",
-	descriptors: [$auth],
+	primitives: [$auth],
 	services: [
 		AlephaReact,
 		AlephaServerLinks,

package/dist/auth/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../src/auth/providers/ReactAuthProvider.ts","../../src/auth/services/ReactAuth.ts","../../src/auth/hooks/useAuth.ts","../../src/auth/index.ts"],"sourcesContent":["import { $hook, $inject, Alepha } from \"alepha\";\n\nexport class ReactAuthProvider {\n  protected readonly alepha = $inject(Alepha);\n\n  public readonly onRender = $hook({\n    on: \"react:server:render:begin\",\n    handler: async ({ request, state }) => {\n      if (request?.user) {\n        const { token, realm, ...user } = request.user; // do not send token and realm to the client\n        this.alepha.state.set(\"alepha.server.request.user\", user); // for hydration, browser, etc...\n        state.user = user;\n      }\n    },\n  });\n}\n","import { ReactBrowserProvider, Redirection } from \"@alepha/react\";\nimport { $hook, $inject, Alepha } from \"alepha\";\nimport { $logger } from \"alepha/logger\";\nimport type { UserAccountToken } from \"alepha/security\";\nimport { HttpClient } from \"alepha/server\";\nimport { alephaServerAuthRoutes, tokenResponseSchema, type Tokens, userinfoResponseSchema } from \"alepha/server/auth\";\n\n/**\n * Browser, SSR friendly, service to handle authentication.\n */\nexport class ReactAuth {\n  protected readonly log = $logger();\n  protected readonly alepha = $inject(Alepha);\n  protected readonly httpClient = $inject(HttpClient);\n\n  protected readonly onBeginTransition = $hook({\n    on: \"react:transition:begin\",\n    handler: async (event) => {\n      if (this.alepha.isBrowser()) {\n        Object.defineProperty(event.state, \"user\", {\n          get: () => this.user,\n        });\n      }\n    },\n  });\n\n  protected readonly onFetchRequest = $hook({\n    on: \"client:onRequest\",\n    handler: async ({ request }) => {\n      if (this.alepha.isBrowser() && this.user) {\n        // ensure cookies are sent with requests and refresh-able\n        request.credentials ??= \"include\";\n      }\n    },\n  });\n\n  /**\n   * Get the current authenticated user.\n   *\n   * Alias for `alepha.state.get(\"user\")`\n   */\n  public get user(): UserAccountToken | undefined {\n    return this.alepha.state.get(\"alepha.server.request.user\");\n  }\n\n  public async ping() {\n    const { data } = await this.httpClient.fetch(alephaServerAuthRoutes.userinfo, {\n      schema: { response: userinfoResponseSchema },\n    });\n\n    this.alepha.state.set(\"alepha.server.request.apiLinks\", data.api);\n    this.alepha.state.set(\"alepha.server.request.user\", data.user);\n\n    return data.user;\n  }\n\n  public async login(\n    provider: string,\n    options: {\n      hostname?: string;\n      username?: string;\n      password?: string;\n      redirect?: string;\n      [extra: string]: any;\n    },\n  ): Promise<Tokens> {\n    if (options.username || options.password) {\n      const { data } = await this.httpClient.fetch(\n        `${options.hostname || \"\"}${alephaServerAuthRoutes.token}?provider=${provider}`,\n        {\n          method: \"POST\",\n          body: JSON.stringify({\n            username: options.username,\n            password: options.password,\n            ...options,\n          }),\n          schema: { response: tokenResponseSchema },\n        },\n      );\n\n      this.alepha.state.set(\"alepha.server.request.apiLinks\", data.api);\n      this.alepha.state.set(\"alepha.server.request.user\", data.user);\n\n      return data;\n    }\n\n    if (this.alepha.isBrowser()) {\n      const browser = this.alepha.inject(ReactBrowserProvider);\n      const redirect =\n        options.redirect ||\n        (browser.transitioning\n          ? window.location.origin + browser.transitioning.to\n          : window.location.href);\n\n      const href = `${window.location.origin}${alephaServerAuthRoutes.login}?provider=${provider}&redirect_uri=${encodeURIComponent(redirect)}`;\n\n      if (browser.transitioning) {\n        throw new Redirection(href);\n      } else {\n        window.location.href = href;\n        return {} as Tokens;\n      }\n    }\n\n    throw new Redirection(\n      `${alephaServerAuthRoutes.login}?provider=${provider}&redirect_uri=${options.redirect || \"/\"}`,\n    );\n  }\n\n  public logout() {\n    window.location.href = `${alephaServerAuthRoutes.logout}?post_logout_redirect_uri=${encodeURIComponent(window.location.origin)}`;\n  }\n}\n","import { useAlepha, useStore } from \"@alepha/react\";\nimport { type HttpVirtualClient, LinkProvider } from \"alepha/server/links\";\nimport { ReactAuth } from \"../services/ReactAuth.ts\";\n\nexport const useAuth = <T extends object = any>() => {\n  const alepha = useAlepha();\n  const [user] = useStore(\"alepha.server.request.user\");\n\n  return {\n    user,\n    logout: () => {\n      alepha.inject(ReactAuth).logout();\n    },\n    login: async (\n      provider: keyof T,\n      options: {\n        username?: string;\n        password?: string;\n        redirect?: string;\n        [extra: string]: any;\n      } = {},\n    ) => {\n      await alepha.inject(ReactAuth).login(provider as string, options);\n    },\n    can: <Api extends object = any>(\n      name: keyof HttpVirtualClient<Api>,\n    ): boolean => {\n      return alepha.inject(LinkProvider).can(name as string);\n    },\n  };\n};\n","import { AlephaReact } from \"@alepha/react\";\nimport { $module } from \"alepha\";\nimport type { UserAccount } from \"alepha/security\";\nimport { ReactAuthProvider } from \"./providers/ReactAuthProvider.ts\";\nimport { ReactAuth } from \"./services/ReactAuth.ts\";\nimport { $auth, AlephaServerAuth } from \"alepha/server/auth\";\nimport { AlephaServerLinks } from \"alepha/server/links\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport * from \"./index.shared.ts\";\nexport * from \"./providers/ReactAuthProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\ndeclare module \"@alepha/react\" {\n  interface ReactRouterState {\n    user?: UserAccount;\n  }\n}\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * The ReactAuthModule provides authentication services for React applications.\n *\n * @see {@link ReactAuthProvider}\n * @module alepha.react.auth\n */\nexport const AlephaReactAuth = $module({\n  name: \"alepha.react.auth\",\n  descriptors: [$auth],\n  services: [AlephaReact, AlephaServerLinks, AlephaServerAuth, ReactAuthProvider, ReactAuth],\n});\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../../src/auth/providers/ReactAuthProvider.ts","../../src/auth/services/ReactAuth.ts","../../src/auth/hooks/useAuth.ts","../../src/auth/index.ts"],"sourcesContent":["import { $hook, $inject, Alepha } from \"alepha\";\n\nexport class ReactAuthProvider {\n  protected readonly alepha = $inject(Alepha);\n\n  public readonly onRender = $hook({\n    on: \"react:server:render:begin\",\n    handler: async ({ request, state }) => {\n      if (request?.user) {\n        const { token, realm, ...user } = request.user; // do not send token and realm to the client\n        this.alepha.store.set(\"alepha.server.request.user\", user); // for hydration, browser, etc...\n        state.user = user;\n      }\n    },\n  });\n}\n","import { ReactBrowserProvider, Redirection } from \"@alepha/react\";\nimport { $hook, $inject, Alepha } from \"alepha\";\nimport { $logger } from \"alepha/logger\";\nimport type { UserAccountToken } from \"alepha/security\";\nimport { HttpClient } from \"alepha/server\";\nimport { alephaServerAuthRoutes, tokenResponseSchema, type Tokens, userinfoResponseSchema } from \"alepha/server/auth\";\nimport { LinkProvider } from \"alepha/server/links\";\n\n/**\n * Browser, SSR friendly, service to handle authentication.\n */\nexport class ReactAuth {\n  protected readonly log = $logger();\n  protected readonly alepha = $inject(Alepha);\n  protected readonly httpClient = $inject(HttpClient);\n  protected readonly linkProvider = $inject(LinkProvider);\n\n  protected readonly onBeginTransition = $hook({\n    on: \"react:transition:begin\",\n    handler: async (event) => {\n      if (this.alepha.isBrowser()) {\n        Object.defineProperty(event.state, \"user\", {\n          get: () => this.user,\n        });\n      }\n    },\n  });\n\n  protected readonly onFetchRequest = $hook({\n    on: \"client:onRequest\",\n    handler: async ({ request }) => {\n      if (this.alepha.isBrowser() && this.user) {\n        // ensure cookies are sent with requests and refresh-able\n        request.credentials ??= \"include\";\n      }\n    },\n  });\n\n  /**\n   * Get the current authenticated user.\n   *\n   * Alias for `alepha.state.get(\"user\")`\n   */\n  public get user(): UserAccountToken | undefined {\n    return this.alepha.store.get(\"alepha.server.request.user\");\n  }\n\n  public async ping() {\n    const { data } = await this.httpClient.fetch(alephaServerAuthRoutes.userinfo, {\n      schema: { response: userinfoResponseSchema },\n    });\n\n    this.alepha.store.set(\"alepha.server.request.apiLinks\", data.api);\n    this.alepha.store.set(\"alepha.server.request.user\", data.user);\n\n    return data.user;\n  }\n\n  public can(action: string): boolean {\n    if (!this.user) {\n      return false;\n    }\n\n    return this.linkProvider.can(action);\n  }\n\n  public async login(\n    provider: string,\n    options: {\n      hostname?: string;\n      username?: string;\n      password?: string;\n      redirect?: string;\n      [extra: string]: any;\n    },\n  ): Promise<Tokens> {\n    if (options.username || options.password) {\n      const { data } = await this.httpClient.fetch(\n        `${options.hostname || \"\"}${alephaServerAuthRoutes.token}?provider=${provider}`,\n        {\n          method: \"POST\",\n          body: JSON.stringify({\n            username: options.username,\n            password: options.password,\n            ...options,\n          }),\n          schema: { response: tokenResponseSchema },\n        },\n      );\n\n      this.alepha.store.set(\"alepha.server.request.apiLinks\", data.api);\n      this.alepha.store.set(\"alepha.server.request.user\", data.user);\n\n      return data;\n    }\n\n    if (this.alepha.isBrowser()) {\n      const browser = this.alepha.inject(ReactBrowserProvider);\n      const redirect =\n        options.redirect ||\n        (browser.transitioning\n          ? window.location.origin + browser.transitioning.to\n          : window.location.href);\n\n      const href = `${window.location.origin}${alephaServerAuthRoutes.login}?provider=${provider}&redirect_uri=${encodeURIComponent(redirect)}`;\n\n      if (browser.transitioning) {\n        throw new Redirection(href);\n      } else {\n        window.location.href = href;\n        return {} as Tokens;\n      }\n    }\n\n    throw new Redirection(\n      `${alephaServerAuthRoutes.login}?provider=${provider}&redirect_uri=${options.redirect || \"/\"}`,\n    );\n  }\n\n  public logout() {\n    window.location.href = `${alephaServerAuthRoutes.logout}?post_logout_redirect_uri=${encodeURIComponent(window.location.origin)}`;\n  }\n}\n","import { useAlepha, useStore } from \"@alepha/react\";\nimport { type HttpVirtualClient, LinkProvider } from \"alepha/server/links\";\nimport { ReactAuth } from \"../services/ReactAuth.ts\";\n\nexport const useAuth = <T extends object = any>() => {\n  const alepha = useAlepha();\n  const [user] = useStore(\"alepha.server.request.user\");\n\n  return {\n    user,\n    logout: () => {\n      alepha.inject(ReactAuth).logout();\n    },\n    login: async (\n      provider: keyof T,\n      options: {\n        username?: string;\n        password?: string;\n        redirect?: string;\n        [extra: string]: any;\n      } = {},\n    ) => {\n      await alepha.inject(ReactAuth).login(provider as string, options);\n    },\n    can: <Api extends object = any>(\n      name: keyof HttpVirtualClient<Api>,\n    ): boolean => {\n      return alepha.inject(LinkProvider).can(name as string);\n    },\n  };\n};\n","import { AlephaReact } from \"@alepha/react\";\nimport { $module } from \"alepha\";\nimport type { UserAccount } from \"alepha/security\";\nimport { ReactAuthProvider } from \"./providers/ReactAuthProvider.ts\";\nimport { ReactAuth } from \"./services/ReactAuth.ts\";\nimport { $auth, AlephaServerAuth } from \"alepha/server/auth\";\nimport { AlephaServerLinks } from \"alepha/server/links\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\nexport * from \"./index.shared.ts\";\nexport * from \"./providers/ReactAuthProvider.ts\";\n\n// ---------------------------------------------------------------------------------------------------------------------\n\ndeclare module \"@alepha/react\" {\n  interface ReactRouterState {\n    user?: UserAccount;\n  }\n}\n\n// ---------------------------------------------------------------------------------------------------------------------\n\n/**\n * The ReactAuthModule provides authentication services for React applications.\n *\n * @see {@link ReactAuthProvider}\n * @module alepha.react.auth\n */\nexport const AlephaReactAuth = $module({\n  name: \"alepha.react.auth\",\n  primitives: [$auth],\n  services: [AlephaReact, AlephaServerLinks, AlephaServerAuth, ReactAuthProvider, ReactAuth],\n});\n"],"mappings":"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"}

package/dist/core/index.browser.js

@@ -1,4 +1,4 @@
-import { $atom, $env, $hook, $inject, $module, $use, Alepha, AlephaError, Atom, Descriptor, KIND, createDescriptor, t } from "alepha";
+import { $atom, $env, $hook, $inject, $module, $use, Alepha, AlephaError, Atom, KIND, Primitive, createPrimitive, t } from "alepha";
 import { AlephaDateTime, DateTimeProvider } from "alepha/datetime";
 import { AlephaServer, HttpClient } from "alepha/server";
 import { AlephaServerLinks, LinkProvider } from "alepha/server/links";
@@ -19,11 +19,11 @@ var ReactPageService = class {
 };
 
 //#endregion
-//#region src/core/descriptors/$page.ts
+//#region src/core/primitives/$page.ts
 /**
-* Main descriptor for defining a React route in the application.
+* Main primitive for defining a React route in the application.
 *
-* The $page descriptor is the core building block for creating type-safe, SSR-enabled React routes.
+* The $page primitive is the core building block for creating type-safe, SSR-enabled React routes.
 * It provides a declarative way to define pages with powerful features:
 *
 * **Routing & Navigation**
@@ -109,9 +109,9 @@ var ReactPageService = class {
 * ```
 */
 const $page = (options) => {
-	return createDescriptor(PageDescriptor, options);
+	return createPrimitive(PagePrimitive, options);
 };
-var PageDescriptor = class extends Descriptor {
+var PagePrimitive = class extends Primitive {
 	reactPageService = $inject(ReactPageService);
 	onInit() {
 		if (this.options.static) this.options.cache ??= { store: {
@@ -141,30 +141,40 @@ var PageDescriptor = class extends Descriptor {
 		return this.options.path || "";
 	}
 };
-$page[KIND] = PageDescriptor;
+$page[KIND] = PagePrimitive;
 
 //#endregion
 //#region src/core/components/NotFound.tsx
 function NotFoundPage(props) {
-	return /* @__PURE__ */ jsx("div", {
+	return /* @__PURE__ */ jsxs("div", {
 		style: {
-			height: "100vh",
+			width: "100%",
+			minHeight: "90vh",
+			boxSizing: "border-box",
 			display: "flex",
 			flexDirection: "column",
 			justifyContent: "center",
 			alignItems: "center",
 			textAlign: "center",
-			fontFamily: "sans-serif",
-			padding: "1rem",
+			fontFamily: "system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif",
+			padding: "2rem",
 			...props.style
 		},
-		children: /* @__PURE__ */ jsx("h1", {
+		children: [/* @__PURE__ */ jsx("div", {
 			style: {
-				fontSize: "1rem",
-				marginBottom: "0.5rem"
+				fontSize: "6rem",
+				fontWeight: 200,
+				lineHeight: 1
 			},
-			children: "404 - This page does not exist"
-		})
+			children: "404"
+		}), /* @__PURE__ */ jsx("div", {
+			style: {
+				fontSize: "0.875rem",
+				marginTop: "1rem",
+				opacity: .6
+			},
+			children: "Page not found"
+		})]
 	});
 }
 
@@ -421,9 +431,9 @@ const useEvents = (opts, deps) => {
 function useStore(target, defaultValue) {
 	const alepha = useAlepha();
 	useMemo(() => {
-		if (defaultValue != null && alepha.state.get(target) == null) alepha.state.set(target, defaultValue);
+		if (defaultValue != null && alepha.store.get(target) == null) alepha.store.set(target, defaultValue);
 	}, [defaultValue]);
-	const [state, setState] = useState(alepha.state.get(target));
+	const [state, setState] = useState(alepha.store.get(target));
 	useEffect(() => {
 		if (!alepha.isBrowser()) return;
 		const key = target instanceof Atom ? target.key : target;
@@ -432,7 +442,7 @@ function useStore(target, defaultValue) {
 		});
 	}, []);
 	return [state, (value) => {
-		alepha.state.set(target, value);
+		alepha.store.set(target, value);
 	}];
 }
 
@@ -508,7 +518,8 @@ const NestedView = (props) => {
 	useEvents({
 		"react:transition:begin": async ({ previous, state: state$1 }) => {
 			const layer = previous.layers[index];
-			if (`${state$1.url.pathname}/`.startsWith(`${layer?.path}/`)) return;
+			if (!layer) return;
+			if (`${state$1.url.pathname}/`.startsWith(`${layer.path}/`)) return;
 			const animationExit = parseAnimation(layer.route?.animation, state$1, "exit");
 			if (animationExit) {
 				const duration = animationExit.duration || 200;
@@ -622,6 +633,7 @@ var ReactPageProvider = class {
 						if (!path.includes(":") && !path.includes("*")) pages.push({
 							...page,
 							name: params[Object.keys(params)[0]],
+							staticName: page.name,
 							path,
 							...entry
 						});
@@ -852,7 +864,7 @@ var ReactPageProvider = class {
 		on: "configure",
 		handler: () => {
 			let hasNotFoundHandler = false;
-			const pages = this.alepha.descriptors($page);
+			const pages = this.alepha.primitives($page);
 			const hasParent = (it) => {
 				if (it.options.parent) return true;
 				for (const page of pages) if ((page.options.children ? Array.isArray(page.options.children) ? page.options.children : page.options.children() : []).includes(it)) return true;
@@ -950,13 +962,14 @@ 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("alepha.react.router.state"),
+			previous: this.alepha.store.get("alepha.react.router.state"),
 			state
 		});
 		try {
 			const { route, params } = this.match(pathname);
 			const query = {};
 			if (search) for (const [key, value] of new URLSearchParams(search).entries()) query[key] = String(value);
+			state.name = route?.page.name;
 			state.query = query;
 			state.params = params ?? {};
 			if (isPageRoute(route)) {
@@ -992,7 +1005,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("alepha.react.router.state", state);
+		this.alepha.store.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 });
 	}
@@ -1030,7 +1043,7 @@ var ReactBrowserProvider = class {
 	}
 	transitioning;
 	get state() {
-		return this.alepha.state.get("alepha.react.router.state");
+		return this.alepha.store.get("alepha.react.router.state");
 	}
 	/**
 	* Accessor for Document DOM API.
@@ -1147,7 +1160,7 @@ var ReactBrowserProvider = class {
 			const hydration = this.getHydrationState();
 			const previous = hydration?.layers ?? [];
 			if (hydration) {
-				for (const [key, value] of Object.entries(hydration)) if (key !== "layers") this.alepha.state.set(key, value);
+				for (const [key, value] of Object.entries(hydration)) if (key !== "layers") this.alepha.store.set(key, value);
 			}
 			await this.render({ previous });
 			const element = this.router.root(this.state);
@@ -1192,7 +1205,7 @@ var ReactRouter = class {
 	alepha = $inject(Alepha);
 	pageApi = $inject(ReactPageProvider);
 	get state() {
-		return this.alepha.state.get("alepha.react.router.state");
+		return this.alepha.store.get("alepha.react.router.state");
 	}
 	get pages() {
 		return this.pageApi.getPages();
@@ -1209,6 +1222,15 @@ var ReactRouter = class {
 		if (options.startWith && !isActive) isActive = current.startsWith(href);
 		return isActive;
 	}
+	node(name, config = {}) {
+		const page = this.pageApi.page(name);
+		return {
+			...page,
+			label: page.label ?? page.name,
+			href: this.path(name, config),
+			children: void 0
+		};
+	}
 	path(name, config = {}) {
 		return this.pageApi.pathname(name, {
 			params: {
@@ -1686,7 +1708,7 @@ const decode = (alepha, schema, data) => {
 //#region src/core/index.browser.ts
 const AlephaReact = $module({
 	name: "alepha.react",
-	descriptors: [$page],
+	primitives: [$page],
 	services: [
 		ReactPageProvider,
 		ReactBrowserRouterProvider,
@@ -1699,5 +1721,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, reactBrowserOptions, 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, PagePrimitive, 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