@alepha/react 0.7.0 → 0.7.1

package/dist/index.d.ts

@@ -1,9 +1,8 @@
 import * as _alepha_core from '@alepha/core';
-import { Alepha, Static as Static$1, TSchema as TSchema$1, KIND, OPTIONS, Async, Class, TObject as TObject$1 } from '@alepha/core';
-import * as _alepha_server from '@alepha/server';
-import { HttpClientLink, HttpClient, ApiLinksResponse, ServerRouterProvider, ServerHandler, ServerRequest } from '@alepha/server';
+import { TSchema as TSchema$1, KIND, OPTIONS, Static as Static$1, Async, Alepha, Service, TObject as TObject$1 } from '@alepha/core';
+import { ServerRoute, ApiLinksResponse, HttpClient, ClientScope, HttpVirtualClient, ServerRouterProvider, ServerTimingProvider, ServerHandler, ServerRequest } from '@alepha/server';
 import * as React from 'react';
-import React__default, { ReactNode, FC, AnchorHTMLAttributes, PropsWithChildren, ErrorInfo } from 'react';
+import React__default, { PropsWithChildren, ReactNode, FC, ErrorInfo, AnchorHTMLAttributes } from 'react';
 import { Root } from 'react-dom/client';
 import { RouterProvider, Route } from '@alepha/router';
 import * as react_jsx_runtime from 'react/jsx-runtime';
@@ -126,215 +125,137 @@ interface TSchema extends TKind, SchemaOptions {
     static: unknown;
 }
 
-interface Head$1 {
-    title?: string;
-    htmlAttributes?: Record<string, string>;
-    bodyAttributes?: Record<string, string>;
-    meta?: Array<{
-        name: string;
-        content: string;
-    }>;
-}
-declare class ServerHeadProvider {
-    renderHead(template: string, head: Head$1): string;
-    mergeAttributes(existing: string, attrs: Record<string, string>): string;
-    parseAttributes(attrStr: string): Record<string, string>;
-    escapeHtml(str: string): string;
-}
-
-declare class BrowserHeadProvider {
-    renderHead(document: Document, head: Head$1): void;
-}
-
-interface BrowserRoute extends Route {
-    page: PageRoute;
-}
-declare class BrowserRouterProvider extends RouterProvider<BrowserRoute> {
-    protected readonly log: _alepha_core.Logger;
-    protected readonly alepha: Alepha;
-    protected readonly pageDescriptorProvider: PageDescriptorProvider;
-    add(entry: PageRouteEntry): void;
-    protected readonly configure: _alepha_core.HookDescriptor<"configure">;
-    transition(url: URL, options?: TransitionOptions): Promise<RouterRenderResult>;
-    root(state: RouterState, context: PageReactContext): ReactNode;
+interface ClientOnlyProps {
+    fallback?: ReactNode;
+    disabled?: boolean;
 }
+/**
+ * A small utility component that renders its children only on the client side.
+ *
+ * Optionally, you can provide a fallback React node that will be rendered.
+ *
+ * You should use this component when
+ * - you have code that relies on browser-specific APIs
+ * - you want to avoid server-side rendering for a specific part of your application
+ * - you want to prevent pre-rendering of a component
+ */
+declare const ClientOnly: (props: PropsWithChildren<ClientOnlyProps>) => ReactNode;
 
-declare const envSchema$1: _alepha_core.TObject<{
-    REACT_ROOT_ID: TString;
-}>;
-declare module "@alepha/core" {
-    interface Env extends Partial<Static$1<typeof envSchema$1>> {
-    }
+declare const KEY = "PAGE";
+interface PageConfigSchema {
+    query?: TSchema$1;
+    params?: TSchema$1;
 }
-declare class ReactBrowserProvider {
-    protected readonly log: _alepha_core.Logger;
-    protected readonly client: HttpClient;
-    protected readonly alepha: Alepha;
-    protected readonly router: BrowserRouterProvider;
-    protected readonly headProvider: BrowserHeadProvider;
-    protected readonly env: {
-        REACT_ROOT_ID: string;
-    };
-    protected root: Root;
-    transitioning?: {
-        to: string;
-    };
-    state: RouterState;
-    get document(): Document;
-    get history(): History;
-    get url(): string;
-    invalidate(props?: Record<string, any>): Promise<void>;
+type TPropsDefault = any;
+type TPropsParentDefault = {};
+interface PageDescriptorOptions<TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = TPropsDefault, TPropsParent extends object = TPropsParentDefault> extends Pick<ServerRoute, "cache"> {
     /**
+     * Name your page.
      *
-     * @param url
-     * @param options
+     * @default Descriptor key
      */
-    go(url: string, options?: RouterGoOptions): Promise<void>;
-    protected render(options?: {
-        url?: string;
-        previous?: PreviousLayerData[];
-    }): Promise<RouterRenderResult>;
+    name?: string;
     /**
-     * Get embedded layers from the server.
-     *
-     * @protected
+     * Optional description of the page.
      */
-    protected getHydrationState(): ReactHydrationState | undefined;
+    description?: string;
     /**
+     * Add a pathname to the page.
      *
-     * @protected
-     */
-    protected getRootElement(): HTMLElement;
-    /**
+     * Pathname can contain parameters, like `/post/:slug`.
      *
-     * @protected
+     * @default ""
      */
-    readonly ready: _alepha_core.HookDescriptor<"ready">;
-    readonly onTransitionEnd: _alepha_core.HookDescriptor<"react:transition:end">;
-}
-interface RouterGoOptions {
-    replace?: boolean;
-    match?: TransitionOptions;
-    params?: Record<string, string>;
-}
-interface ReactHydrationState {
-    layers?: PreviousLayerData[];
-    links?: HttpClientLink[];
-}
-
-declare class RouterHookApi {
-    private readonly state;
-    private readonly layer;
-    private readonly browser?;
-    constructor(state: RouterState, layer: {
-        path: string;
-    }, browser?: ReactBrowserProvider | undefined);
-    /**
-     *
-     */
-    get current(): RouterState;
+    path?: string;
     /**
-     *
+     * Add an input schema to define:
+     * - `params`: parameters from the pathname.
+     * - `query`: query parameters from the URL.
      */
-    get pathname(): string;
+    schema?: TConfig;
     /**
+     * Load data before rendering the page.
      *
-     */
-    get query(): Record<string, string>;
-    /**
+     * This function receives
+     * - the request context and
+     * - the parent props (if page has a parent)
      *
-     */
-    back(): Promise<void>;
-    /**
+     * In SSR, the returned data will be serialized and sent to the client, then reused during the client-side hydration.
      *
-     */
-    forward(): Promise<void>;
-    /**
+     * Resolve can be stopped by throwing an error, which will be handled by the `errorHandler` function.
+     * It's common to throw a `NotFoundError` to display a 404 page.
      *
-     * @param props
+     * RedirectError can be thrown to redirect the user to another page.
      */
-    invalidate(props?: Record<string, any>): Promise<void>;
+    resolve?: (context: PageResolve<TConfig, TPropsParent>) => Async<TProps>;
     /**
-     * Create a valid href for the given pathname.
+     * The component to render when the page is loaded.
      *
-     * @param pathname
-     * @param layer
+     * If `lazy` is defined, this will be ignored.
+     * Prefer using `lazy` to improve the initial loading time.
      */
-    createHref(pathname: HrefLike, layer?: {
-        path: string;
-    }): string;
-    go(path: string, options?: RouterGoOptions): Promise<void>;
-    go<T extends object>(path: keyof VirtualRouter<T>, options?: RouterGoOptions): Promise<void>;
-    anchor(path: string): AnchorProps;
+    component?: FC<TProps & TPropsParent>;
     /**
-     * Set query params.
+     * Lazy load the component when the page is loaded.
      *
-     * @param record
-     * @param options
+     * It's recommended to use this for components to improve the initial loading time
+     * and enable code-splitting.
      */
-    setQueryParams(record: Record<string, any> | ((queryParams: Record<string, any>) => Record<string, any>), options?: {
-        /**
-         * If true, this will add a new entry to the history stack.
-         */
-        push?: boolean;
-    }): void;
-}
-type HrefLike = string | {
-    options: {
-        path?: string;
-        name?: string;
-    };
-};
-type VirtualRouter<T> = {
-    [K in keyof T as T[K] extends PageDescriptor ? K : never]: T[K];
-};
-
-declare const KEY = "PAGE";
-interface PageConfigSchema {
-    query?: TSchema$1;
-    params?: TSchema$1;
-}
-type TPropsDefault = any;
-type TPropsParentDefault = object;
-interface PageDescriptorOptions<TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = TPropsDefault, TPropsParent extends object = TPropsParentDefault> {
-    name?: string;
-    path?: string;
-    schema?: TConfig;
-    resolve?: (config: PageResolve<TConfig, TPropsParent>) => Async<TProps>;
-    component?: FC<TProps & TPropsParent>;
     lazy?: () => Promise<{
         default: FC<TProps & TPropsParent>;
     }>;
+    /**
+     * Set some children pages and make the page a parent page.
+     *
+     * /!\ Parent page can't be rendered directly. /!\
+     *
+     * If you still want to render at this pathname, add a child page with an empty path.
+     */
     children?: Array<{
         [OPTIONS]: PageDescriptorOptions;
     }>;
     parent?: {
-        [OPTIONS]: PageDescriptorOptions<any, TPropsParent>;
+        [OPTIONS]: PageDescriptorOptions<PageConfigSchema, TPropsParent>;
     };
     can?: () => boolean;
-    head?: Head | ((props: TProps, previous?: Head) => Head);
+    head?: Head$1 | ((props: TProps, previous?: Head$1) => Head$1);
     errorHandler?: (error: Error) => ReactNode;
+    prerender?: boolean | {
+        entries?: Array<Partial<PageRequestConfig<TConfig>>>;
+    };
+    /**
+     * If true, the page will be rendered on the client-side.
+     */
+    client?: boolean | ClientOnlyProps;
 }
 interface PageDescriptor<TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = TPropsDefault, TPropsParent extends object = TPropsParentDefault> {
     [KIND]: typeof KEY;
     [OPTIONS]: PageDescriptorOptions<TConfig, TProps, TPropsParent>;
-    render: (options?: {
-        params?: Record<string, string>;
-        query?: Record<string, string>;
-    }) => Promise<string>;
-    go: () => void;
-    createAnchorProps: (routerHook: RouterHookApi) => {
-        href: string;
-        onClick: () => void;
-    };
-    can: () => boolean;
+    /**
+     * For testing or build purposes, this will render the page (with or without the HTML layout) and return the HTML and context.
+     * Only valid for server-side rendering, it will throw an error if called on the client-side.
+     */
+    render: (options?: PageDescriptorRenderOptions) => Promise<PageDescriptorRenderResult>;
 }
+/**
+ * Main descriptor for defining a React route in the application.
+ */
 declare const $page: {
-    <TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = any, TPropsParent extends object = object>(options: PageDescriptorOptions<TConfig, TProps, TPropsParent>): PageDescriptor<TConfig, TProps, TPropsParent>;
+    <TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = any, TPropsParent extends object = TPropsParentDefault>(options: PageDescriptorOptions<TConfig, TProps, TPropsParent>): PageDescriptor<TConfig, TProps, TPropsParent>;
     [KIND]: string;
 };
-interface Head {
+interface PageDescriptorRenderOptions {
+    params?: Record<string, string>;
+    query?: Record<string, string>;
+    withLayout?: boolean;
+}
+interface PageDescriptorRenderResult {
+    html: string;
+    context: PageReactContext;
+}
+interface Head$1 {
     title?: string;
+    description?: string;
     titleSeparator?: string;
     htmlAttributes?: Record<string, string>;
     bodyAttributes?: Record<string, string>;
@@ -342,6 +263,32 @@ interface Head {
         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$1 ? Static$1<TConfig["params"]> : Record<string, string>;
@@ -349,18 +296,32 @@ interface PageRequestConfig<TConfig extends PageConfigSchema = PageConfigSchema>
 }
 type PageResolve<TConfig extends PageConfigSchema = PageConfigSchema, TPropsParent extends object = TPropsParentDefault> = PageRequestConfig<TConfig> & TPropsParent & PageReactContext;
 
+declare const envSchema$2: _alepha_core.TObject<{
+    REACT_STRICT_MODE: TBoolean;
+}>;
+declare module "@alepha/core" {
+    interface Env extends Partial<Static$1<typeof envSchema$2>> {
+    }
+}
 declare class PageDescriptorProvider {
     protected readonly log: _alepha_core.Logger;
+    protected readonly env: {
+        REACT_STRICT_MODE: boolean;
+    };
     protected readonly alepha: Alepha;
     protected readonly pages: PageRoute[];
     getPages(): PageRoute[];
     page(name: string): PageRoute;
+    url(name: string, options?: {
+        params?: Record<string, string>;
+        base?: string;
+    }): URL;
     root(state: RouterState, context: PageReactContext): ReactNode;
     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(e: Error): ReactNode;
+    renderError(error: Error): ReactNode;
     renderEmptyView(): ReactNode;
     href(page: {
         options: {
@@ -368,7 +329,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): ReactNode;
+    protected renderView(index: number, path: string, view: ReactNode | undefined, page: PageRoute): ReactNode;
     protected readonly configure: _alepha_core.HookDescriptor<"configure">;
     protected map(pages: Array<{
         value: {
@@ -406,7 +367,7 @@ interface Layer {
     index: number;
     path: string;
 }
-type PreviousLayerData = Omit<Layer, "element">;
+type PreviousLayerData = Omit<Layer, "element" | "index" | "path">;
 interface AnchorProps {
     href: string;
     onClick: (ev: any) => any;
@@ -446,27 +407,212 @@ interface CreateLayersResult extends RouterState {
  */
 interface PageReactContext {
     url: URL;
-    head: Head;
+    head: Head$1;
     onError: (error: Error) => ReactNode;
     links?: ApiLinksResponse;
 }
 
+interface Head {
+    title?: string;
+    htmlAttributes?: Record<string, string>;
+    bodyAttributes?: Record<string, string>;
+    meta?: Array<{
+        name: string;
+        content: string;
+    }>;
+}
+declare class ServerHeadProvider {
+    renderHead(template: string, head: Head): string;
+    mergeAttributes(existing: string, attrs: Record<string, string>): string;
+    parseAttributes(attrStr: string): Record<string, string>;
+    escapeHtml(str: string): string;
+}
+
+declare class BrowserHeadProvider {
+    renderHead(document: Document, head: Head): void;
+}
+
+interface BrowserRoute extends Route {
+    page: PageRoute;
+}
+declare class BrowserRouterProvider extends RouterProvider<BrowserRoute> {
+    protected readonly log: _alepha_core.Logger;
+    protected readonly alepha: Alepha;
+    protected readonly pageDescriptorProvider: PageDescriptorProvider;
+    add(entry: PageRouteEntry): void;
+    protected readonly configure: _alepha_core.HookDescriptor<"configure">;
+    transition(url: URL, options?: TransitionOptions): Promise<RouterRenderResult>;
+    root(state: RouterState, context: PageReactContext): ReactNode;
+}
+
+declare const envSchema$1: _alepha_core.TObject<{
+    REACT_ROOT_ID: TString;
+}>;
+declare module "@alepha/core" {
+    interface Env extends Partial<Static$1<typeof envSchema$1>> {
+    }
+}
+declare class ReactBrowserProvider {
+    protected readonly log: _alepha_core.Logger;
+    protected readonly client: HttpClient;
+    protected readonly alepha: Alepha;
+    protected readonly router: BrowserRouterProvider;
+    protected readonly headProvider: BrowserHeadProvider;
+    protected readonly env: {
+        REACT_ROOT_ID: string;
+    };
+    protected root: Root;
+    transitioning?: {
+        to: string;
+    };
+    state: RouterState;
+    get document(): Document;
+    get history(): History;
+    get url(): string;
+    invalidate(props?: Record<string, any>): Promise<void>;
+    /**
+     *
+     * @param url
+     * @param options
+     */
+    go(url: string, options?: RouterGoOptions): Promise<void>;
+    protected render(options?: {
+        url?: string;
+        previous?: PreviousLayerData[];
+    }): Promise<RouterRenderResult>;
+    /**
+     * Get embedded layers from the server.
+     *
+     * @protected
+     */
+    protected getHydrationState(): ReactHydrationState | undefined;
+    /**
+     *
+     * @protected
+     */
+    protected getRootElement(): HTMLElement;
+    /**
+     *
+     * @protected
+     */
+    readonly ready: _alepha_core.HookDescriptor<"ready">;
+    readonly onTransitionEnd: _alepha_core.HookDescriptor<"react:transition:end">;
+}
+interface RouterGoOptions {
+    replace?: boolean;
+    match?: TransitionOptions;
+    params?: Record<string, string>;
+}
+interface ReactHydrationState {
+    layers?: Array<PreviousLayerData>;
+    links?: ApiLinksResponse;
+}
+
 interface NestedViewProps {
     children?: ReactNode;
 }
 /**
- * Nested view component
+ * A component that renders the current view of the nested router layer.
  *
- * @param props
- * @constructor
+ * To be simple, it renders the `element` of the current child page of a parent page.
+ *
+ * @example
+ * ```tsx
+ * import { NestedView } from "@alepha/react";
+ *
+ * class App {
+ *   parent = $page({
+ *     component: () => <NestedView />,
+ *   });
+ *
+ *   child = $page({
+ *     parent: this.root,
+ *     component: () => <div>Child Page</div>,
+ *   });
+ * }
+ * ```
  */
 declare const NestedView: (props: NestedViewProps) => react_jsx_runtime.JSX.Element;
 
-interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
-    to: string | PageDescriptor;
-    children?: React__default.ReactNode;
+declare class RouterHookApi {
+    private readonly pages;
+    private readonly state;
+    private readonly layer;
+    private readonly browser?;
+    constructor(pages: PageRoute[], state: RouterState, layer: {
+        path: string;
+    }, browser?: ReactBrowserProvider | undefined);
+    /**
+     *
+     */
+    get current(): RouterState;
+    /**
+     *
+     */
+    get pathname(): string;
+    /**
+     *
+     */
+    get query(): Record<string, string>;
+    /**
+     *
+     */
+    back(): Promise<void>;
+    /**
+     *
+     */
+    forward(): Promise<void>;
+    /**
+     *
+     * @param props
+     */
+    invalidate(props?: Record<string, any>): Promise<void>;
+    /**
+     * Create a valid href for the given pathname.
+     *
+     * @param pathname
+     * @param layer
+     */
+    createHref(pathname: HrefLike, layer?: {
+        path: string;
+    }, options?: {
+        params?: Record<string, any>;
+    }): string;
+    go(path: string, options?: RouterGoOptions): Promise<void>;
+    go<T extends object>(path: keyof VirtualRouter<T>, options?: RouterGoOptions): Promise<void>;
+    anchor(path: string, options?: {
+        params?: Record<string, any>;
+    }): AnchorProps;
+    anchor<T extends object>(path: keyof VirtualRouter<T>, options?: {
+        params?: Record<string, any>;
+    }): AnchorProps;
+    /**
+     * Set query params.
+     *
+     * @param record
+     * @param options
+     */
+    setQueryParams(record: Record<string, any> | ((queryParams: Record<string, any>) => Record<string, any>), options?: {
+        /**
+         * If true, this will add a new entry to the history stack.
+         */
+        push?: boolean;
+    }): void;
+}
+type HrefLike = string | {
+    options: {
+        path?: string;
+        name?: string;
+    };
+};
+type VirtualRouter<T> = {
+    [K in keyof T as T[K] extends PageDescriptor ? K : never]: T[K];
+};
+
+declare class RedirectionError extends Error {
+    readonly page: HrefLike;
+    constructor(page: HrefLike);
 }
-declare const Link: (props: LinkProps) => react_jsx_runtime.JSX.Element | null;
 
 /**
  * Props for the ErrorBoundary component.
@@ -507,6 +653,12 @@ declare class ErrorBoundary extends React__default.Component<PropsWithChildren<E
     render(): ReactNode;
 }
 
+interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    to: string | PageDescriptor;
+    children?: React__default.ReactNode;
+}
+declare const Link: (props: LinkProps) => react_jsx_runtime.JSX.Element | null;
+
 interface RouterContextValue {
     alepha: Alepha;
     state: RouterState;
@@ -520,10 +672,19 @@ interface RouterLayerContextValue {
 }
 declare const RouterLayerContext: React.Context<RouterLayerContextValue | undefined>;
 
-declare const useInject: <T extends object>(clazz: Class<T>) => T;
+declare const useActive: (path: HrefLike) => UseActiveHook;
+interface UseActiveHook {
+    isActive: boolean;
+    anchorProps: AnchorProps;
+    isPending: boolean;
+    name?: string;
+}
+
+declare const useAlepha: () => Alepha;
+
+declare const useClient: <T extends object>(_scope?: ClientScope) => HttpVirtualClient<T>;
 
-declare const useClient: () => HttpClient;
-declare const useApi: <T extends object>() => _alepha_server.HttpVirtualClient<T>;
+declare const useInject: <T extends object>(clazz: Service<T>) => T;
 
 interface UseQueryParamsHookOptions {
     format?: "base64" | "querystring";
@@ -549,23 +710,10 @@ declare const useRouterEvents: (opts?: {
 
 declare const useRouterState: () => RouterState;
 
-declare const useActive: (path: HrefLike) => UseActiveHook;
-interface UseActiveHook {
-    isActive: boolean;
-    anchorProps: AnchorProps;
-    isPending: boolean;
-    name?: string;
-}
-
-declare class RedirectionError extends Error {
-    readonly page: HrefLike;
-    constructor(page: HrefLike);
-}
-
 declare const envSchema: TObject<{
     REACT_SERVER_DIST: TString;
     REACT_SERVER_PREFIX: TString;
-    REACT_SSR_ENABLED: TBoolean;
+    REACT_SSR_ENABLED: TOptional<TBoolean>;
     REACT_ROOT_ID: TString;
 }>;
 declare module "@alepha/core" {
@@ -583,30 +731,37 @@ declare class ReactServerProvider {
     protected readonly serverStaticProvider: ServerStaticProvider;
     protected readonly serverRouterProvider: ServerRouterProvider;
     protected readonly headProvider: ServerHeadProvider;
+    protected readonly serverTimingProvider: ServerTimingProvider;
     protected readonly env: {
+        REACT_SSR_ENABLED?: boolean | undefined;
         REACT_ROOT_ID: string;
         REACT_SERVER_DIST: string;
         REACT_SERVER_PREFIX: string;
-        REACT_SSR_ENABLED: boolean;
     };
     protected readonly ROOT_DIV_REGEX: RegExp;
-    protected readonly configure: _alepha_core.HookDescriptor<"configure">;
-    protected registerPages(templateLoader: () => Promise<string | undefined>): Promise<void>;
+    readonly onConfigure: _alepha_core.HookDescriptor<"configure">;
+    get template(): string | undefined;
+    protected registerPages(templateLoader: TemplateLoader): Promise<void>;
     protected getPublicDirectory(): string;
     protected configureStaticServer(root: string): Promise<void>;
-    protected configureVite(): Promise<void>;
+    protected configureVite(ssrEnabled: boolean): Promise<void>;
     /**
      * For testing purposes, creates a render function that can be used.
      */
-    protected createRenderFunction(name: string): (options?: {
+    protected createRenderFunction(name: string, withIndex?: boolean): (options?: {
         params?: Record<string, string>;
         query?: Record<string, string>;
-    }) => Promise<string>;
-    protected createHandler(page: PageRoute, templateLoader: () => Promise<string | undefined>): ServerHandler;
-    fillTemplate(response: {
+    }) => Promise<{
+        context: PageRequest;
+        html: string;
+    }>;
+    protected createHandler(page: PageRoute, templateLoader: TemplateLoader): ServerHandler;
+    renderToHtml(template: string, state: RouterState, context: PageReactContext): string;
+    protected fillTemplate(response: {
         html: string;
     }, app: string, script: string): void;
 }
+type TemplateLoader = () => Promise<string | undefined>;
 
 declare module "@alepha/core" {
     interface Hooks {
@@ -642,4 +797,4 @@ declare class ReactModule {
     constructor();
 }
 
-export { $page, type AnchorProps, type CreateLayersResult, ErrorBoundary, type Head, type HrefLike, type Layer, Link, NestedView, type PageConfigSchema, type PageDescriptor, type PageDescriptorOptions, PageDescriptorProvider, type PageReactContext, type PageRequest, type PageRequestConfig, type PageResolve, type PageRoute, type PageRouteEntry, type PreviousLayerData, ReactBrowserProvider, type ReactHydrationState, ReactModule, ReactServerProvider, RedirectionError, RouterContext, type RouterContextValue, type RouterGoOptions, RouterHookApi, RouterLayerContext, type RouterLayerContextValue, type RouterRenderResult, type RouterStackItem, type RouterState, type TPropsDefault, type TPropsParentDefault, type TransitionOptions, type UseActiveHook, type UseQueryParamsHookOptions, type VirtualRouter, envSchema, isPageRoute, useActive, useApi, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState };
+export { $page, type AnchorProps, ClientOnly, type CreateLayersResult, ErrorBoundary, type Head$1 as Head, type HrefLike, type Layer, Link, NestedView, type PageConfigSchema, type PageDescriptor, type PageDescriptorOptions, PageDescriptorProvider, type PageDescriptorRenderOptions, type PageDescriptorRenderResult, type PageReactContext, type PageRequest, type PageRequestConfig, type PageResolve, type PageRoute, type PageRouteEntry, type PreviousLayerData, ReactBrowserProvider, type ReactHydrationState, ReactModule, ReactServerProvider, RedirectionError, RouterContext, type RouterContextValue, type RouterGoOptions, RouterHookApi, RouterLayerContext, type RouterLayerContextValue, type RouterRenderResult, type RouterStackItem, type RouterState, type TPropsDefault, type TPropsParentDefault, type TransitionOptions, type UseActiveHook, type UseQueryParamsHookOptions, type VirtualRouter, envSchema, isPageRoute, useActive, useAlepha, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState };