@alepha/react 0.9.4 → 0.10.0

package/dist/index.d.ts

@@ -1,15 +1,14 @@
 import * as _alepha_core14 from "@alepha/core";
-import { Alepha, Async, Descriptor, KIND, Service, State, Static, TObject, TSchema } from "@alepha/core";
-import { RequestConfigSchema, ServerHandler, ServerRequest, ServerRouterProvider, ServerTimingProvider } from "@alepha/server";
+import { Alepha, Async, Descriptor, Hooks, KIND, Service, State, Static, TObject, TSchema } from "@alepha/core";
+import { RequestConfigSchema, ServerHandler, ServerProvider, ServerRequest, ServerRouterProvider, ServerTimingProvider } from "@alepha/server";
 import { ServerRouteCache } from "@alepha/server-cache";
 import { ClientScope, HttpVirtualClient, LinkProvider, VirtualAction } from "@alepha/server-links";
 import * as _alepha_logger1 from "@alepha/logger";
 import * as react0 from "react";
 import React, { AnchorHTMLAttributes, CSSProperties, ErrorInfo, FC, PropsWithChildren, ReactNode } from "react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 import { ServerStaticProvider } from "@alepha/server-static";
 import { DateTimeProvider } from "@alepha/datetime";
-import { Root } from "react-dom/client";
 import { Route, RouterProvider } from "@alepha/router";
 
 //#region src/components/ClientOnly.d.ts
@@ -40,9 +39,217 @@ declare class Redirection extends Error {
   constructor(redirect: string);
 }
 //#endregion
+//#region src/providers/ReactPageProvider.d.ts
+declare const envSchema$2: _alepha_core14.TObject<{
+  REACT_STRICT_MODE: _alepha_core14.TBoolean;
+}>;
+declare module "@alepha/core" {
+  interface Env extends Partial<Static<typeof envSchema$2>> {}
+}
+declare class ReactPageProvider {
+  protected readonly log: _alepha_logger1.Logger;
+  protected readonly env: {
+    REACT_STRICT_MODE: boolean;
+  };
+  protected readonly alepha: Alepha;
+  protected readonly pages: PageRoute[];
+  getPages(): PageRoute[];
+  page(name: string): PageRoute;
+  pathname(name: string, options?: {
+    params?: Record<string, string>;
+    query?: Record<string, string>;
+  }): string;
+  url(name: string, options?: {
+    params?: Record<string, string>;
+    host?: string;
+  }): URL;
+  root(state: ReactRouterState): ReactNode;
+  protected convertStringObjectToObject: (schema?: TSchema, value?: any) => any;
+  /**
+   * Create a new RouterState based on a given route and request.
+   * This method resolves the layers for the route, applying any query and params schemas defined in the route.
+   * It also handles errors and redirects.
+   */
+  createLayers(route: PageRoute, state: ReactRouterState, previous?: PreviousLayerData[]): Promise<CreateLayersResult>;
+  protected createRedirectionLayer(redirect: string): CreateLayersResult;
+  protected getErrorHandler(route: PageRoute): ErrorHandler | undefined;
+  protected createElement(page: PageRoute, props: Record<string, any>): Promise<ReactNode>;
+  renderError(error: Error): ReactNode;
+  renderEmptyView(): ReactNode;
+  href(page: {
+    options: {
+      name?: string;
+    };
+  }, 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_core14.HookDescriptor<"configure">;
+  protected map(pages: Array<PageDescriptor>, target: PageDescriptor): PageRouteEntry;
+  add(entry: PageRouteEntry): void;
+  protected createMatch(page: PageRoute): string;
+  protected _next: number;
+  protected nextId(): string;
+}
+declare const isPageRoute: (it: any) => it is PageRoute;
+interface PageRouteEntry extends Omit<PageDescriptorOptions, "children" | "parent"> {
+  children?: PageRouteEntry[];
+}
+interface PageRoute extends PageRouteEntry {
+  type: "page";
+  name: string;
+  parent?: PageRoute;
+  match: string;
+}
+interface Layer {
+  config?: {
+    query?: Record<string, any>;
+    params?: Record<string, any>;
+    context?: Record<string, any>;
+  };
+  name: string;
+  props?: Record<string, any>;
+  error?: Error;
+  part?: string;
+  element: ReactNode;
+  index: number;
+  path: string;
+  route?: PageRoute;
+  cache?: boolean;
+}
+type PreviousLayerData = Omit<Layer, "element" | "index" | "path">;
+interface AnchorProps {
+  href: string;
+  onClick: (ev?: any) => any;
+}
+interface ReactRouterState {
+  /**
+   * Stack of layers for the current page.
+   */
+  layers: Array<Layer>;
+  /**
+   * URL of the current page.
+   */
+  url: URL;
+  /**
+   * Error handler for the current page.
+   */
+  onError: ErrorHandler;
+  /**
+   * Params extracted from the URL for the current page.
+   */
+  params: Record<string, any>;
+  /**
+   * Query parameters extracted from the URL for the current page.
+   */
+  query: Record<string, string>;
+  /**
+   * Optional meta information associated with the current page.
+   */
+  meta: Record<string, any>;
+}
+interface RouterStackItem {
+  route: PageRoute;
+  config?: Record<string, any>;
+  props?: Record<string, any>;
+  error?: Error;
+  cache?: boolean;
+}
+interface TransitionOptions {
+  previous?: PreviousLayerData[];
+}
+interface CreateLayersResult {
+  redirect?: string;
+  state?: ReactRouterState;
+}
+//#endregion
 //#region src/descriptors/$page.d.ts
 /**
  * Main descriptor for defining a React route in the application.
+ *
+ * The $page descriptor 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**
+ * - URL pattern matching with parameters (e.g., `/users/:id`)
+ * - Nested routing with parent-child relationships
+ * - Type-safe URL parameter and query string validation
+ *
+ * **Data Loading**
+ * - Server-side data fetching with the `resolve` function
+ * - Automatic serialization and hydration for SSR
+ * - Access to request context, URL params, and parent data
+ *
+ * **Component Loading**
+ * - Direct component rendering or lazy loading for code splitting
+ * - Client-only rendering when browser APIs are needed
+ * - Automatic fallback handling during hydration
+ *
+ * **Performance Optimization**
+ * - Static generation for pre-rendered pages at build time
+ * - Server-side caching with configurable TTL and providers
+ * - Code splitting through lazy component loading
+ *
+ * **Error Handling**
+ * - Custom error handlers with support for redirects
+ * - Hierarchical error handling (child → parent)
+ * - HTTP status code handling (404, 401, etc.)
+ *
+ * **Page Animations**
+ * - CSS-based enter/exit animations
+ * - Dynamic animations based on page state
+ * - Custom timing and easing functions
+ *
+ * **Lifecycle Management**
+ * - Server response hooks for headers and status codes
+ * - Page leave handlers for cleanup (browser only)
+ * - Permission-based access control
+ *
+ * @example Simple page with data fetching
+ * ```typescript
+ * const userProfile = $page({
+ *   path: "/users/:id",
+ *   schema: {
+ *     params: t.object({ id: t.int() }),
+ *     query: t.object({ tab: t.optional(t.string()) })
+ *   },
+ *   resolve: async ({ params }) => {
+ *     const user = await userApi.getUser(params.id);
+ *     return { user };
+ *   },
+ *   lazy: () => import("./UserProfile.tsx")
+ * });
+ * ```
+ *
+ * @example Nested routing with error handling
+ * ```typescript
+ * const projectSection = $page({
+ *   path: "/projects/:id",
+ *   children: () => [projectBoard, projectSettings],
+ *   resolve: async ({ params }) => {
+ *     const project = await projectApi.get(params.id);
+ *     return { project };
+ *   },
+ *   errorHandler: (error) => {
+ *     if (HttpError.is(error, 404)) {
+ *       return <ProjectNotFound />;
+ *     }
+ *   }
+ * });
+ * ```
+ *
+ * @example Static generation with caching
+ * ```typescript
+ * const blogPost = $page({
+ *   path: "/blog/:slug",
+ *   static: {
+ *     entries: posts.map(p => ({ params: { slug: p.slug } }))
+ *   },
+ *   resolve: async ({ params }) => {
+ *     const post = await loadPost(params.slug);
+ *     return { post };
+ *   }
+ * });
+ * ```
  */
 declare const $page: {
   <TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = any, TPropsParent extends object = TPropsParentDefault>(options: PageDescriptorOptions<TConfig, TProps, TPropsParent>): PageDescriptor<TConfig, TProps, TPropsParent>;
@@ -177,6 +384,49 @@ interface PageDescriptorOptions<TConfig extends PageConfigSchema = PageConfigSch
    * Called when user leaves the page. (browser only)
    */
   onLeave?: () => void;
+  /**
+   * @experimental
+   *
+   * Add a css animation when the page is loaded or unloaded.
+   * It uses CSS animations, so you need to define the keyframes in your CSS.
+   *
+   * @example Simple animation name
+   * ```ts
+   * animation: "fadeIn"
+   * ```
+   *
+   * CSS example:
+   * ```css
+   * @keyframes fadeIn {
+   *  from { opacity: 0; }
+   *  to { opacity: 1; }
+   * }
+   * ```
+   *
+   * @example Detailed animation
+   * ```ts
+   * animation: {
+   *   enter: { name: "fadeIn", duration: 300 },
+   *   exit: { name: "fadeOut", duration: 200, timing: "ease-in-out" },
+   * }
+   * ```
+   *
+   * @example Only exit animation
+   * ```ts
+   * animation: {
+   *   exit: "fadeOut"
+   * }
+   * ```
+   *
+   * @example With custom timing function
+   * ```ts
+   * animation: {
+   *   enter: { name: "fadeIn", duration: 300, timing: "cubic-bezier(0.4, 0, 0.2, 1)" },
+   *   exit: { name: "fadeOut", duration: 200, timing: "ease-in-out" },
+   * }
+   * ```
+   */
+  animation?: PageAnimation;
 }
 type ErrorHandler = (error: Error, state: ReactRouterState) => ReactNode | Redirection | undefined;
 declare class PageDescriptor<TConfig extends PageConfigSchema = PageConfigSchema, TProps extends object = TPropsDefault, TPropsParent extends object = TPropsParentDefault> extends Descriptor<PageDescriptorOptions<TConfig, TProps, TPropsParent>> {
@@ -187,6 +437,10 @@ declare class PageDescriptor<TConfig extends PageConfigSchema = PageConfigSchema
    * Only valid for server-side rendering, it will throw an error if called on the client-side.
    */
   render(options?: PageDescriptorRenderOptions): Promise<PageDescriptorRenderResult>;
+  fetch(options?: PageDescriptorRenderOptions): Promise<{
+    html: string;
+    response: Response;
+  }>;
   match(url: string): boolean;
   pathname(config: any): string;
 }
@@ -199,136 +453,36 @@ type TPropsParentDefault = {};
 interface PageDescriptorRenderOptions {
   params?: Record<string, string>;
   query?: Record<string, string>;
+  /**
+   * If true, the HTML layout will be included in the response.
+   * If false, only the page content will be returned.
+   *
+   * @default true
+   */
   html?: boolean;
   hydration?: boolean;
 }
 interface PageDescriptorRenderResult {
   html: string;
   state: ReactRouterState;
+  redirect?: 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>;
 }
 type PageResolve<TConfig extends PageConfigSchema = PageConfigSchema, TPropsParent extends object = TPropsParentDefault> = PageRequestConfig<TConfig> & TPropsParent & Omit<ReactRouterState, "layers" | "onError">;
-//#endregion
-//#region src/providers/ReactPageProvider.d.ts
-declare const envSchema$2: _alepha_core14.TObject<{
-  REACT_STRICT_MODE: _alepha_core14.TBoolean;
-}>;
-declare module "@alepha/core" {
-  interface Env extends Partial<Static<typeof envSchema$2>> {}
-}
-declare class ReactPageProvider {
-  protected readonly log: _alepha_logger1.Logger;
-  protected readonly env: {
-    REACT_STRICT_MODE: boolean;
-  };
-  protected readonly alepha: Alepha;
-  protected readonly pages: PageRoute[];
-  getPages(): PageRoute[];
-  page(name: string): PageRoute;
-  pathname(name: string, options?: {
-    params?: Record<string, string>;
-    query?: Record<string, string>;
-  }): string;
-  url(name: string, options?: {
-    params?: Record<string, string>;
-    host?: string;
-  }): URL;
-  root(state: ReactRouterState): ReactNode;
-  /**
-   * Create a new RouterState based on a given route and request.
-   * This method resolves the layers for the route, applying any query and params schemas defined in the route.
-   * It also handles errors and redirects.
-   */
-  createLayers(route: PageRoute, state: ReactRouterState, previous?: PreviousLayerData[]): Promise<CreateLayersResult>;
-  protected createRedirectionLayer(redirect: string): CreateLayersResult;
-  protected getErrorHandler(route: PageRoute): ErrorHandler | undefined;
-  protected createElement(page: PageRoute, props: Record<string, any>): Promise<ReactNode>;
-  renderError(error: Error): ReactNode;
-  renderEmptyView(): ReactNode;
-  href(page: {
-    options: {
-      name?: string;
-    };
-  }, 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_core14.HookDescriptor<"configure">;
-  protected map(pages: Array<PageDescriptor>, target: PageDescriptor): PageRouteEntry;
-  add(entry: PageRouteEntry): void;
-  protected createMatch(page: PageRoute): string;
-  protected _next: number;
-  protected nextId(): string;
-}
-declare const isPageRoute: (it: any) => it is PageRoute;
-interface PageRouteEntry extends Omit<PageDescriptorOptions, "children" | "parent"> {
-  children?: PageRouteEntry[];
-}
-interface PageRoute extends PageRouteEntry {
-  type: "page";
-  name: string;
-  parent?: PageRoute;
-  match: string;
-}
-interface Layer {
-  config?: {
-    query?: Record<string, any>;
-    params?: Record<string, any>;
-    context?: Record<string, any>;
-  };
+type PageAnimation = PageAnimationObject | ((state: ReactRouterState) => PageAnimationObject | undefined);
+type PageAnimationObject = CssAnimationName | {
+  enter?: CssAnimation | CssAnimationName;
+  exit?: CssAnimation | CssAnimationName;
+};
+type CssAnimationName = string;
+type CssAnimation = {
   name: string;
-  props?: Record<string, any>;
-  error?: Error;
-  part?: string;
-  element: ReactNode;
-  index: number;
-  path: string;
-  route?: PageRoute;
-  cache?: boolean;
-}
-type PreviousLayerData = Omit<Layer, "element" | "index" | "path">;
-interface AnchorProps {
-  href: string;
-  onClick: (ev?: any) => any;
-}
-interface ReactRouterState {
-  /**
-   * Stack of layers for the current page.
-   */
-  layers: Array<Layer>;
-  /**
-   * URL of the current page.
-   */
-  url: URL;
-  /**
-   * Error handler for the current page.
-   */
-  onError: ErrorHandler;
-  /**
-   * Params extracted from the URL for the current page.
-   */
-  params: Record<string, any>;
-  /**
-   * Query parameters extracted from the URL for the current page.
-   */
-  query: Record<string, string>;
-}
-interface RouterStackItem {
-  route: PageRoute;
-  config?: Record<string, any>;
-  props?: Record<string, any>;
-  error?: Error;
-  cache?: boolean;
-}
-interface TransitionOptions {
-  previous?: PreviousLayerData[];
-}
-interface CreateLayersResult {
-  redirect?: string;
-  state?: ReactRouterState;
-}
+  duration?: number;
+  timing?: string;
+};
 //#endregion
 //#region src/providers/ReactBrowserRouterProvider.d.ts
 interface BrowserRoute extends Route {
@@ -340,7 +494,7 @@ declare class ReactBrowserRouterProvider extends RouterProvider<BrowserRoute> {
   protected readonly pageApi: ReactPageProvider;
   add(entry: PageRouteEntry): void;
   protected readonly configure: _alepha_core14.HookDescriptor<"configure">;
-  transition(url: URL, previous?: PreviousLayerData[]): Promise<string | void>;
+  transition(url: URL, previous?: PreviousLayerData[], meta?: {}): Promise<string | void>;
   root(state: ReactRouterState): ReactNode;
 }
 //#endregion
@@ -363,7 +517,6 @@ declare class ReactBrowserProvider {
   protected readonly alepha: Alepha;
   protected readonly router: ReactBrowserRouterProvider;
   protected readonly dateTimeProvider: DateTimeProvider;
-  protected root?: Root;
   options: ReactBrowserRendererOptions;
   protected getRootElement(): HTMLElement;
   transitioning?: {
@@ -388,10 +541,7 @@ declare class ReactBrowserProvider {
   pushState(path: string, replace?: boolean): void;
   invalidate(props?: Record<string, any>): Promise<void>;
   go(url: string, options?: RouterGoOptions): Promise<void>;
-  protected render(options?: {
-    url?: string;
-    previous?: PreviousLayerData[];
-  }): Promise<void>;
+  protected render(options?: RouterRenderOptions): Promise<void>;
   /**
    * Get embedded layers from the server.
    */
@@ -404,6 +554,7 @@ interface RouterGoOptions {
   match?: TransitionOptions;
   params?: Record<string, string>;
   query?: Record<string, string>;
+  meta?: Record<string, any>;
   /**
    * Recreate the whole page, ignoring the current state.
    */
@@ -414,6 +565,11 @@ type ReactHydrationState = {
 } & {
   [key: string]: any;
 };
+interface RouterRenderOptions {
+  url?: string;
+  previous?: PreviousLayerData[];
+  meta?: Record<string, any>;
+}
 //#endregion
 //#region src/components/ErrorBoundary.d.ts
 /**
@@ -463,46 +619,25 @@ interface ErrorViewerProps {
 declare const ErrorViewer: ({
   error,
   alepha
-}: ErrorViewerProps) => react_jsx_runtime0.JSX.Element;
+}: ErrorViewerProps) => react_jsx_runtime1.JSX.Element;
 //#endregion
 //#region src/components/Link.d.ts
 interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
-  to: string;
-  children?: React.ReactNode;
+  href: string;
 }
-declare const Link: (props: LinkProps) => react_jsx_runtime0.JSX.Element;
+declare const Link: (props: LinkProps) => react_jsx_runtime1.JSX.Element;
 //#endregion
 //#region src/components/NestedView.d.ts
 interface NestedViewProps {
   children?: ReactNode;
+  errorBoundary?: false | ((error: Error) => ReactNode);
 }
-/**
- * A component that renders the current view of the nested router layer.
- *
- * 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_runtime0.JSX.Element;
+declare const _default: react0.MemoExoticComponent<(props: NestedViewProps) => react_jsx_runtime1.JSX.Element>;
 //#endregion
 //#region src/components/NotFound.d.ts
 declare function NotFoundPage(props: {
   style?: CSSProperties;
-}): react_jsx_runtime0.JSX.Element;
+}): react_jsx_runtime1.JSX.Element;
 //#endregion
 //#region src/contexts/AlephaContext.d.ts
 declare const AlephaContext: react0.Context<Alepha | undefined>;
@@ -524,7 +659,6 @@ interface UseActiveHook {
   isActive: boolean;
   anchorProps: AnchorProps;
   isPending: boolean;
-  name?: string;
 }
 //#endregion
 //#region src/hooks/useAlepha.d.ts
@@ -537,7 +671,7 @@ interface UseActiveHook {
  *
  * - alepha.state() for state management
  * - alepha.inject() for dependency injection
- * - alepha.emit() for event handling
+ * - alepha.events.emit() for event handling
  * etc...
  */
 declare const useAlepha: () => Alepha;
@@ -561,7 +695,7 @@ declare const useInject: <T extends object>(service: Service<T>) => T;
 /**
  * Not well tested. Use with caution.
  */
-declare const useQueryParams: <T extends TObject>(schema: T, options?: UseQueryParamsHookOptions) => [Static<T>, (data: Static<T>) => void];
+declare const useQueryParams: <T extends TObject>(schema: T, options?: UseQueryParamsHookOptions) => [Partial<Static<T>>, (data: Static<T>) => void];
 interface UseQueryParamsHookOptions {
   format?: "base64" | "querystring";
   key?: string;
@@ -576,8 +710,8 @@ declare class ReactRouter<T extends object> {
   get pages(): PageRoute[];
   get browser(): ReactBrowserProvider | undefined;
   path(name: keyof VirtualRouter<T>, config?: {
-    params?: Record<string, string>;
-    query?: Record<string, string>;
+    params?: Record<string, any>;
+    query?: Record<string, any>;
   }): string;
   getURL(): URL;
   get location(): Location;
@@ -589,12 +723,8 @@ declare class ReactRouter<T extends object> {
   invalidate(props?: Record<string, any>): Promise<void>;
   go(path: string, options?: RouterGoOptions): Promise<void>;
   go(path: keyof VirtualRouter<T>, options?: RouterGoOptions): Promise<void>;
-  anchor(path: string, options?: {
-    params?: Record<string, any>;
-  }): AnchorProps;
-  anchor(path: keyof VirtualRouter<T>, options?: {
-    params?: Record<string, any>;
-  }): AnchorProps;
+  anchor(path: string, options?: RouterGoOptions): AnchorProps;
+  anchor(path: keyof VirtualRouter<T>, options?: RouterGoOptions): AnchorProps;
   base(path: string): string;
   /**
    * Set query params.
@@ -629,20 +759,18 @@ type VirtualRouter<T> = { [K in keyof T as T[K] extends PageDescriptor ? K : nev
 declare const useRouter: <T extends object = any>() => ReactRouter<T>;
 //#endregion
 //#region src/hooks/useRouterEvents.d.ts
+type Hook<T extends keyof Hooks> = ((ev: Hooks[T]) => void) | {
+  priority?: "first" | "last";
+  callback: (ev: Hooks[T]) => void;
+};
 /**
  * Subscribe to various router events.
  */
 declare const useRouterEvents: (opts?: {
-  onBegin?: (ev: {
-    state: ReactRouterState;
-  }) => void;
-  onEnd?: (ev: {
-    state: ReactRouterState;
-  }) => void;
-  onError?: (ev: {
-    state: ReactRouterState;
-    error: Error;
-  }) => void;
+  onBegin?: Hook<"react:transition:begin">;
+  onError?: Hook<"react:transition:error">;
+  onEnd?: Hook<"react:transition:end">;
+  onSuccess?: Hook<"react:transition:success">;
 }, deps?: any[]) => void;
 //#endregion
 //#region src/hooks/useRouterState.d.ts
@@ -684,6 +812,7 @@ declare class ReactServerProvider {
   protected readonly log: _alepha_logger1.Logger;
   protected readonly alepha: Alepha;
   protected readonly pageApi: ReactPageProvider;
+  protected readonly serverProvider: ServerProvider;
   protected readonly serverStaticProvider: ServerStaticProvider;
   protected readonly serverRouterProvider: ServerRouterProvider;
   protected readonly serverTimingProvider: ServerTimingProvider;
@@ -695,6 +824,7 @@ declare class ReactServerProvider {
     REACT_ROOT_ID: string;
   };
   protected readonly ROOT_DIV_REGEX: RegExp;
+  protected preprocessedTemplate: PreprocessedTemplate | null;
   readonly onConfigure: _alepha_core14.HookDescriptor<"configure">;
   get template(): string;
   protected registerPages(templateLoader: TemplateLoader): Promise<void>;
@@ -704,17 +834,21 @@ declare class ReactServerProvider {
   /**
    * For testing purposes, creates a render function that can be used.
    */
-  protected createRenderFunction(name: string, withIndex?: boolean): (options?: PageDescriptorRenderOptions) => Promise<{
-    state: ReactRouterState;
-    html: string;
-  }>;
+  protected createRenderFunction(name: string, withIndex?: boolean): (options?: PageDescriptorRenderOptions) => Promise<PageDescriptorRenderResult>;
   protected createHandler(route: PageRoute, templateLoader: TemplateLoader): ServerHandler;
   renderToHtml(template: string, state: ReactRouterState, hydration?: boolean): string | Redirection;
+  protected preprocessTemplate(template: string): PreprocessedTemplate;
   protected fillTemplate(response: {
     html: string;
   }, app: string, script: string): void;
 }
 type TemplateLoader = () => Promise<string | undefined>;
+interface PreprocessedTemplate {
+  beforeApp: string;
+  afterApp: string;
+  beforeScript: string;
+  afterScript: string;
+}
 //#endregion
 //#region src/index.d.ts
 declare module "@alepha/core" {
@@ -732,11 +866,15 @@ declare module "@alepha/core" {
       html: string;
     };
     "react:browser:render": {
+      root: HTMLDivElement;
+      element: ReactNode;
       state: ReactRouterState;
       hydration?: ReactHydrationState;
     };
     "react:transition:begin": {
+      previous: ReactRouterState;
       state: ReactRouterState;
+      animation?: PageAnimation;
     };
     "react:transition:success": {
       state: ReactRouterState;
@@ -762,5 +900,5 @@ declare module "@alepha/core" {
  */
 declare const AlephaReact: _alepha_core14.Service<_alepha_core14.Module>;
 //#endregion
-export { $page, AlephaContext, AlephaReact, AnchorProps, ClientOnly, CreateLayersResult, ErrorBoundary, ErrorHandler, ErrorViewer, Layer, Link, LinkProps, NestedView, NotFoundPage as NotFound, PageConfigSchema, PageDescriptor, PageDescriptorOptions, PageDescriptorRenderOptions, PageDescriptorRenderResult, PageRequestConfig, PageResolve, PageRoute, PageRouteEntry, PreviousLayerData, ReactBrowserProvider, ReactBrowserRendererOptions, ReactHydrationState, ReactPageProvider, ReactRouter, ReactRouterState, ReactServerProvider, Redirection, RouterGoOptions, RouterLayerContext, RouterLayerContextValue, RouterStackItem, TPropsDefault, TPropsParentDefault, TransitionOptions, UseActiveHook, UseActiveOptions, UseQueryParamsHookOptions, UseSchemaReturn, VirtualRouter, isPageRoute, ssrSchemaLoading, useActive, useAlepha, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState, useSchema, useStore };
+export { $page, AlephaContext, AlephaReact, AnchorProps, ClientOnly, CreateLayersResult, ErrorBoundary, ErrorHandler, ErrorViewer, Layer, Link, LinkProps, _default as NestedView, NotFoundPage as NotFound, PageAnimation, PageConfigSchema, PageDescriptor, PageDescriptorOptions, PageDescriptorRenderOptions, PageDescriptorRenderResult, PageRequestConfig, PageResolve, PageRoute, PageRouteEntry, PreviousLayerData, ReactBrowserProvider, ReactBrowserRendererOptions, ReactHydrationState, ReactPageProvider, ReactRouter, ReactRouterState, ReactServerProvider, Redirection, RouterGoOptions, RouterLayerContext, RouterLayerContextValue, RouterRenderOptions, RouterStackItem, TPropsDefault, TPropsParentDefault, TransitionOptions, UseActiveHook, UseActiveOptions, UseQueryParamsHookOptions, UseSchemaReturn, VirtualRouter, isPageRoute, ssrSchemaLoading, useActive, useAlepha, useClient, useInject, useQueryParams, useRouter, useRouterEvents, useRouterState, useSchema, useStore };
 //# sourceMappingURL=index.d.ts.map