@alepha/react 0.7.6 → 0.7.7

package/dist/index.browser.d.ts

@@ -1,17 +1,18 @@
+import * as _alepha_core1 from "@alepha/core";
+import * as _alepha_core5 from "@alepha/core";
 import * as _alepha_core7 from "@alepha/core";
-import * as _alepha_core0 from "@alepha/core";
-import * as _alepha_core2 from "@alepha/core";
 import { Alepha, Async, KIND, Module, OPTIONS, Service, Static, TObject, TSchema } from "@alepha/core";
 import { Route, RouterProvider } from "@alepha/router";
-import * as react14 from "react";
-import * as react15 from "react";
+import * as react12 from "react";
+import * as react13 from "react";
 import React, { AnchorHTMLAttributes, ErrorInfo, FC, PropsWithChildren, ReactNode } from "react";
-import * as react_jsx_runtime12 from "react/jsx-runtime";
-import * as react_jsx_runtime13 from "react/jsx-runtime";
-import { ApiLinksResponse, ClientScope, HttpClient, HttpVirtualClient, ServerRequest } from "@alepha/server";
+import * as react_jsx_runtime10 from "react/jsx-runtime";
+import * as react_jsx_runtime11 from "react/jsx-runtime";
+import { ClientScope, HttpVirtualClient, LinkProvider } from "@alepha/server-links";
 import { Root } from "react-dom/client";
+import { ApiLinksResponse, ServerRequest } from "@alepha/server";
 import { ServerRouteCache } from "@alepha/server-cache";
-import * as _sinclair_typebox6 from "@sinclair/typebox";
+import * as _sinclair_typebox0 from "@sinclair/typebox";
 
 //#region src/components/ClientOnly.d.ts
 interface ClientOnlyProps {
@@ -71,14 +72,14 @@ declare class ErrorBoundary extends React.Component<PropsWithChildren<ErrorBound
 }
 //#endregion
 //#region src/providers/PageDescriptorProvider.d.ts
-declare const envSchema: _alepha_core7.TObject<{
-  REACT_STRICT_MODE: _sinclair_typebox6.TBoolean;
+declare const envSchema: _alepha_core1.TObject<{
+  REACT_STRICT_MODE: _sinclair_typebox0.TBoolean;
 }>;
 declare module "@alepha/core" {
   interface Env extends Partial<Static<typeof envSchema>> {}
 }
 declare class PageDescriptorProvider {
-  protected readonly log: _alepha_core7.Logger;
+  protected readonly log: _alepha_core1.Logger;
   protected readonly env: {
     REACT_STRICT_MODE: boolean;
   };
@@ -94,7 +95,6 @@ declare class PageDescriptorProvider {
   createLayers(route: PageRoute, request: PageRequest): Promise<CreateLayersResult>;
   protected getErrorHandler(route: PageRoute): ((error: Error) => ReactNode) | undefined;
   protected createElement(page: PageRoute, props: Record<string, any>): Promise<ReactNode>;
-  protected fillHead(page: PageRoute, ctx: PageRequest, props: Record<string, any>): void;
   renderError(error: Error): ReactNode;
   renderEmptyView(): ReactNode;
   href(page: {
@@ -104,7 +104,7 @@ declare class PageDescriptorProvider {
   }, params?: Record<string, any>): string;
   compile(path: string, params?: Record<string, string>): string;
   protected renderView(index: number, path: string, view: ReactNode | undefined, page: PageRoute): ReactNode;
-  protected readonly configure: _alepha_core7.HookDescriptor<"configure">;
+  protected readonly configure: _alepha_core1.HookDescriptor<"configure">;
   protected map(pages: Array<{
     value: {
       [OPTIONS]: PageDescriptorOptions;
@@ -140,6 +140,7 @@ interface Layer {
   element: ReactNode;
   index: number;
   path: string;
+  route?: PageRoute;
 }
 type PreviousLayerData = Omit<Layer, "element" | "index" | "path">;
 interface AnchorProps {
@@ -181,7 +182,6 @@ interface CreateLayersResult extends RouterState {
  */
 interface PageReactContext {
   url: URL;
-  head: Head;
   onError: (error: Error) => ReactNode;
   links?: ApiLinksResponse;
 }
@@ -264,7 +264,6 @@ interface PageDescriptorOptions<TConfig extends PageConfigSchema = PageConfigSch
     [OPTIONS]: PageDescriptorOptions<PageConfigSchema, TPropsParent>;
   };
   can?: () => boolean;
-  head?: Head | ((props: TProps, previous?: Head) => Head);
   errorHandler?: (error: Error) => ReactNode;
   prerender?: boolean | {
     entries?: Array<Partial<PageRequestConfig<TConfig>>>;
@@ -295,49 +294,13 @@ declare const $page: {
 interface PageDescriptorRenderOptions {
   params?: Record<string, string>;
   query?: Record<string, string>;
-  withLayout?: boolean;
+  html?: boolean;
+  hydration?: boolean;
 }
 interface PageDescriptorRenderResult {
   html: string;
   context: PageReactContext;
 }
-interface Head {
-  title?: string;
-  description?: string;
-  titleSeparator?: string;
-  htmlAttributes?: Record<string, string>;
-  bodyAttributes?: Record<string, string>;
-  meta?: Array<{
-    name: string;
-    content: string;
-  }>;
-  keywords?: string[];
-  author?: string;
-  robots?: string;
-  themeColor?: string;
-  viewport?: string | {
-    width?: string;
-    height?: string;
-    initialScale?: string;
-    maximumScale?: string;
-    userScalable?: "no" | "yes" | "0" | "1";
-    interactiveWidget?: "resizes-visual" | "resizes-content" | "overlays-content";
-  };
-  og?: {
-    title?: string;
-    description?: string;
-    image?: string;
-    url?: string;
-    type?: string;
-  };
-  twitter?: {
-    card?: string;
-    title?: string;
-    description?: string;
-    image?: string;
-    site?: string;
-  };
-}
 interface PageRequestConfig<TConfig extends PageConfigSchema = PageConfigSchema> {
   params: TConfig["params"] extends TSchema ? Static<TConfig["params"]> : Record<string, string>;
   query: TConfig["query"] extends TSchema ? Static<TConfig["query"]> : Record<string, string>;
@@ -349,7 +312,7 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
   to: string | PageDescriptor;
   children?: React.ReactNode;
 }
-declare const Link: (props: LinkProps) => react_jsx_runtime12.JSX.Element | null;
+declare const Link: (props: LinkProps) => react_jsx_runtime10.JSX.Element | null;
 //#endregion
 //#region src/components/NestedView.d.ts
 interface NestedViewProps {
@@ -376,7 +339,7 @@ interface NestedViewProps {
  * }
  * ```
  */
-declare const NestedView: (props: NestedViewProps) => react_jsx_runtime13.JSX.Element;
+declare const NestedView: (props: NestedViewProps) => react_jsx_runtime11.JSX.Element;
 //#endregion
 //#region src/contexts/RouterContext.d.ts
 interface RouterContextValue {
@@ -384,52 +347,35 @@ interface RouterContextValue {
   state: RouterState;
   context: PageReactContext;
 }
-declare const RouterContext: react14.Context<RouterContextValue | undefined>;
+declare const RouterContext: react12.Context<RouterContextValue | undefined>;
 //#endregion
 //#region src/contexts/RouterLayerContext.d.ts
 interface RouterLayerContextValue {
   index: number;
   path: string;
 }
-declare const RouterLayerContext: react15.Context<RouterLayerContextValue | undefined>;
-//#endregion
-//#region src/providers/ServerHeadProvider.d.ts
-interface Head$1 {
-  title?: string;
-  htmlAttributes?: Record<string, string>;
-  bodyAttributes?: Record<string, string>;
-  meta?: Array<{
-    name: string;
-    content: string;
-  }>;
-}
-//#endregion
-//#region src/providers/BrowserHeadProvider.d.ts
-declare class BrowserHeadProvider {
-  renderHead(document: Document, head: Head$1): void;
-}
+declare const RouterLayerContext: react13.Context<RouterLayerContextValue | undefined>;
 //#endregion
 //#region src/providers/BrowserRouterProvider.d.ts
 interface BrowserRoute extends Route {
   page: PageRoute;
 }
 declare class BrowserRouterProvider extends RouterProvider<BrowserRoute> {
-  protected readonly log: _alepha_core0.Logger;
+  protected readonly log: _alepha_core5.Logger;
   protected readonly alepha: Alepha;
   protected readonly pageDescriptorProvider: PageDescriptorProvider;
   add(entry: PageRouteEntry): void;
-  protected readonly configure: _alepha_core0.HookDescriptor<"configure">;
+  protected readonly configure: _alepha_core5.HookDescriptor<"configure">;
   transition(url: URL, options?: TransitionOptions): Promise<RouterRenderResult>;
   root(state: RouterState, context: PageReactContext): ReactNode;
 }
 //#endregion
 //#region src/providers/ReactBrowserProvider.d.ts
 declare class ReactBrowserProvider {
-  protected readonly log: _alepha_core2.Logger;
-  protected readonly client: HttpClient;
+  protected readonly log: _alepha_core7.Logger;
+  protected readonly client: LinkProvider;
   protected readonly alepha: Alepha;
   protected readonly router: BrowserRouterProvider;
-  protected readonly headProvider: BrowserHeadProvider;
   protected root: Root;
   transitioning?: {
     to: string;
@@ -448,8 +394,7 @@ declare class ReactBrowserProvider {
    * Get embedded layers from the server.
    */
   protected getHydrationState(): ReactHydrationState | undefined;
-  readonly ready: _alepha_core2.HookDescriptor<"ready">;
-  readonly onTransitionEnd: _alepha_core2.HookDescriptor<keyof _alepha_core2.Hooks>;
+  readonly ready: _alepha_core7.HookDescriptor<"ready">;
 }
 interface RouterGoOptions {
   replace?: boolean;
@@ -574,5 +519,5 @@ declare class AlephaReact implements Module {
   readonly $services: (alepha: Alepha) => Alepha;
 }
 //#endregion
-export { $page, AlephaReact, AnchorProps, BrowserRoute, BrowserRouterProvider, ClientOnly, CreateLayersResult, ErrorBoundary, Head, HrefLike, Layer, Link, NestedView, PageConfigSchema, PageDescriptor, PageDescriptorOptions, PageDescriptorProvider, PageDescriptorRenderOptions, PageDescriptorRenderResult, PageReactContext, PageRequest, PageRequestConfig, PageResolve, PageRoute, PageRouteEntry, PreviousLayerData, ReactBrowserProvider, ReactHydrationState, RedirectionError, RouterContext, RouterContextValue, RouterGoOptions, RouterHookApi, RouterLayerContext, RouterLayerContextValue, RouterRenderResult, RouterStackItem, RouterState, TPropsDefault, TPropsParentDefault, TransitionOptions, UseActiveHook, UseQueryParamsHookOptions, VirtualRouter, isPageRoute, useActive, useAlepha, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState };
+export { $page, AlephaReact, AnchorProps, BrowserRoute, BrowserRouterProvider, ClientOnly, CreateLayersResult, ErrorBoundary, HrefLike, Layer, Link, NestedView, PageConfigSchema, PageDescriptor, PageDescriptorOptions, PageDescriptorProvider, PageDescriptorRenderOptions, PageDescriptorRenderResult, PageReactContext, PageRequest, PageRequestConfig, PageResolve, PageRoute, PageRouteEntry, PreviousLayerData, ReactBrowserProvider, ReactHydrationState, RedirectionError, RouterContext, RouterContextValue, RouterGoOptions, RouterHookApi, RouterLayerContext, RouterLayerContextValue, RouterRenderResult, RouterStackItem, RouterState, TPropsDefault, TPropsParentDefault, TransitionOptions, UseActiveHook, UseQueryParamsHookOptions, VirtualRouter, isPageRoute, useActive, useAlepha, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState };
 //# sourceMappingURL=index.browser.d.ts.map

package/dist/index.browser.js

@@ -2,7 +2,7 @@ import { $hook, $inject, $logger, Alepha, KIND, NotImplementedError, OPTIONS, __
 import { RouterProvider } from "@alepha/router";
 import React, { StrictMode, createContext, createElement, useContext, useEffect, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { HttpClient } from "@alepha/server";
+import { LinkProvider } from "@alepha/server-links";
 import { createRoot, hydrateRoot } from "react-dom/client";
 
 //#region src/descriptors/$page.ts
@@ -453,10 +453,6 @@ var PageDescriptorProvider = class {
 			const props = it.props ?? {};
 			const params = { ...it.config?.params };
 			for (const key of Object.keys(params)) params[key] = String(params[key]);
-			if (it.route.head && !it.error) this.fillHead(it.route, request, {
-				...props,
-				...context
-			});
 			acc += "/";
 			acc += it.route.path ? this.compile(it.route.path, params) : "";
 			const path = acc.replace(/\/+/, "/");
@@ -473,7 +469,8 @@ var PageDescriptorProvider = class {
 					config: it.config,
 					element: this.renderView(i + 1, path, element$1, it.route),
 					index: i + 1,
-					path
+					path,
+					route
 				});
 				break;
 			}
@@ -488,7 +485,8 @@ var PageDescriptorProvider = class {
 				config: it.config,
 				element: this.renderView(i + 1, path, element, it.route),
 				index: i + 1,
-				path
+				path,
+				route
 			});
 		}
 		return {
@@ -513,26 +511,6 @@ var PageDescriptorProvider = class {
 		if (page.component) return createElement(page.component, props);
 		return void 0;
 	}
-	fillHead(page, ctx, props) {
-		if (!page.head) return;
-		ctx.head ??= {};
-		const head = typeof page.head === "function" ? page.head(props, ctx.head) : page.head;
-		if (head.title) {
-			ctx.head ??= {};
-			if (ctx.head.titleSeparator) ctx.head.title = `${head.title}${ctx.head.titleSeparator}${ctx.head.title}`;
-			else ctx.head.title = head.title;
-			ctx.head.titleSeparator = head.titleSeparator;
-		}
-		if (head.htmlAttributes) ctx.head.htmlAttributes = {
-			...ctx.head.htmlAttributes,
-			...head.htmlAttributes
-		};
-		if (head.bodyAttributes) ctx.head.bodyAttributes = {
-			...ctx.head.bodyAttributes,
-			...head.bodyAttributes
-		};
-		if (head.meta) ctx.head.meta = [...ctx.head.meta ?? [], ...head.meta ?? []];
-	}
 	renderError(error) {
 		return createElement(ErrorViewer_default, { error });
 	}
@@ -654,7 +632,6 @@ var BrowserRouterProvider = class extends RouterProvider {
 			url,
 			query: {},
 			params: {},
-			head: {},
 			onError: () => null,
 			...options.context ?? {}
 		};
@@ -685,7 +662,10 @@ var BrowserRouterProvider = class extends RouterProvider {
 				index: 0,
 				path: "/"
 			});
-			await this.alepha.emit("react:transition:success", { state });
+			await this.alepha.emit("react:transition:success", {
+				state,
+				context
+			});
 		} catch (e) {
 			this.log.error(e);
 			state.layers = [{
@@ -719,36 +699,13 @@ var BrowserRouterProvider = class extends RouterProvider {
 	}
 };
 
-//#endregion
-//#region src/providers/BrowserHeadProvider.ts
-var BrowserHeadProvider = class {
-	renderHead(document, head) {
-		if (head.title) document.title = head.title;
-		if (head.bodyAttributes) for (const [key, value] of Object.entries(head.bodyAttributes)) if (value) document.body.setAttribute(key, value);
-		else document.body.removeAttribute(key);
-		if (head.htmlAttributes) for (const [key, value] of Object.entries(head.htmlAttributes)) if (value) document.documentElement.setAttribute(key, value);
-		else document.documentElement.removeAttribute(key);
-		if (head.meta) for (const [key, value] of Object.entries(head.meta)) {
-			const meta = document.querySelector(`meta[name="${key}"]`);
-			if (meta) meta.setAttribute("content", value.content);
-			else {
-				const newMeta = document.createElement("meta");
-				newMeta.setAttribute("name", key);
-				newMeta.setAttribute("content", value.content);
-				document.head.appendChild(newMeta);
-			}
-		}
-	}
-};
-
 //#endregion
 //#region src/providers/ReactBrowserProvider.ts
 var ReactBrowserProvider = class {
 	log = $logger();
-	client = $inject(HttpClient);
+	client = $inject(LinkProvider);
 	alepha = $inject(Alepha);
 	router = $inject(BrowserRouterProvider);
-	headProvider = $inject(BrowserHeadProvider);
 	root;
 	transitioning;
 	state = {
@@ -827,7 +784,6 @@ var ReactBrowserProvider = class {
 			const previous = hydration?.layers ?? [];
 			if (hydration?.links) for (const link of hydration.links.links) this.client.pushLink(link);
 			const { context } = await this.render({ previous });
-			if (context.head) this.headProvider.renderHead(this.document, context.head);
 			await this.alepha.emit("react:browser:render", {
 				state: this.state,
 				context,
@@ -838,12 +794,6 @@ var ReactBrowserProvider = class {
 			});
 		}
 	});
-	onTransitionEnd = $hook({
-		name: "react:transition:end",
-		handler: async ({ context }) => {
-			this.headProvider.renderHead(this.document, context.head);
-		}
-	});
 };
 
 //#endregion
@@ -1035,7 +985,7 @@ const useInject = (clazz) => {
 //#endregion
 //#region src/hooks/useClient.ts
 const useClient = (_scope) => {
-	return useInject(HttpClient).of();
+	return useInject(LinkProvider).client();
 };
 
 //#endregion