akanjs 2.3.6-rc.2 → 2.3.6-rc.4

package/server/hmr/clientScript.ts

@@ -1,8 +1,16 @@
 
 
+const SYNC_NAVIGATION_ENABLED =
+  process.env.AKAN_PUBLIC_SYNC_NAVIGATION === "true" ||
+  process.env.AKAN_PUBLIC_SYNC_NAVIGATION === "1" ||
+  process.env.SYNC_DOMAIN === "true" ||
+  process.env.SYNC_DOMAIN === "1";
+
 export const HMR_CLIENT_SCRIPT = `(function(){
   if (self.__AKAN_HMR_INSTALLED__) return;
   self.__AKAN_HMR_INSTALLED__ = true;
+  var syncNavigationEnabled = ${JSON.stringify(SYNC_NAVIGATION_ENABLED)};
+  var syncNavigationClientId = Math.random().toString(36).slice(2) + Date.now().toString(36);
   var proto = location.protocol === "https:" ? "wss:" : "ws:";
   var url = proto + "//" + location.host + "/_akan/hmr";
   var attempts = 0;
@@ -22,6 +30,19 @@ export const HMR_CLIENT_SCRIPT = `(function(){
   var overlayJobs = {};
   var buildErrorStates = {};
   self.__AKAN_HMR_PHASE__ = null;
+  self.__AKAN_DEV_SYNC_NAVIGATION__ = function(href, kind){
+    if (self.__AKAN_DEV_SYNC_NAVIGATION_APPLYING__ || !syncNavigationEnabled || !socket || socket.readyState !== WebSocket.OPEN) return;
+    try {
+      socket.send(JSON.stringify({
+        type: "sync-navigation",
+        clientId: syncNavigationClientId,
+        href: new URL(href, location.origin).pathname + new URL(href, location.origin).search + new URL(href, location.origin).hash,
+        kind: kind || "push"
+      }));
+    } catch(e) {
+      console.warn("[akan-hmr] sync navigation send failed", e);
+    }
+  };
 
   self.$RefreshReg$ = self.$RefreshReg$ || function(type, id){
     if (refreshRuntime) refreshRuntime.register(type, id);
@@ -71,6 +92,13 @@ export const HMR_CLIENT_SCRIPT = `(function(){
         }
         return;
       }
+      if (msg.type === "sync-navigation") {
+        if (!syncNavigationEnabled || msg.clientId === syncNavigationClientId || !msg.href) return;
+        window.dispatchEvent(new CustomEvent("akan:sync-navigation", {
+          detail: { href: msg.href, kind: msg.kind || "push" }
+        }));
+        return;
+      }
       if (msg.type === "build-status") { handleBuildStatus(msg); return; }
       if (msg.type === "ok") {
         clearBuildErrorOverlay({

package/server/hmr/wsHub.ts

@@ -22,6 +22,7 @@ export type HmrMessage =
       routeIds?: string[];
     }
   | { type: "css-update"; cssAssets?: Record<string, { cssUrl: string; cssRelPath: string }> }
+  | { type: "sync-navigation"; clientId: string; href: string; kind?: "push" | "replace" | "back" | "pop" }
   | { type: "ok"; generation?: number }
   | {
       type: "build-status";
@@ -63,4 +64,32 @@ export class HmrWsHub {
     const payload = JSON.stringify(msg);
     this.#publish?.(HMR_WS_TOPIC, payload);
   }
+
+  handleMessage(message: string): void {
+    if (!isSyncNavigationEnabled()) return;
+    let parsed: unknown;
+    try {
+      parsed = JSON.parse(message);
+    } catch {
+      return;
+    }
+    if (!isSyncNavigationMessage(parsed)) return;
+    this.broadcast(parsed);
+  }
 }
+
+const isSyncNavigationEnabled = () =>
+  process.env.AKAN_PUBLIC_SYNC_NAVIGATION === "true" ||
+  process.env.AKAN_PUBLIC_SYNC_NAVIGATION === "1" ||
+  process.env.SYNC_DOMAIN === "true" ||
+  process.env.SYNC_DOMAIN === "1";
+
+const isSyncNavigationMessage = (value: unknown): value is Extract<HmrMessage, { type: "sync-navigation" }> => {
+  if (!value || typeof value !== "object") return false;
+  const msg = value as Partial<Extract<HmrMessage, { type: "sync-navigation" }>>;
+  if (msg.type !== "sync-navigation") return false;
+  if (typeof msg.clientId !== "string" || msg.clientId.length === 0) return false;
+  if (typeof msg.href !== "string" || msg.href.length === 0) return false;
+  if (msg.kind === undefined) return true;
+  return msg.kind === "push" || msg.kind === "replace" || msg.kind === "back" || msg.kind === "pop";
+};

package/server/routeElementComposer.tsx

@@ -2,11 +2,13 @@ import type {
   Head,
   LayoutErrorRender,
   LayoutFallbackRoute,
+  PageConfig,
   LayoutNotFoundRender,
   PathRoute,
   ResolvedHead,
   RouteRender,
 } from "akanjs/client";
+import { getExplicitPageConfigKeys, resolvePageState } from "../client/frameConfig";
 import { Children, cloneElement, isValidElement, type ReactElement, type ReactNode, Suspense } from "react";
 import { resolveHeadResult } from "./metadata";
 import { type AkanRouteSegmentState, createAkanRouteSegments, createAkanSegmentOutletKey } from "./routeState";
@@ -14,6 +16,47 @@ import { isAkanRscPartialCommitEnabled } from "./rscPartialCommit";
 import { AkanSegmentOutletReference } from "./rscSegmentOutletReference";
 
 export class RouteElementComposer {
+  static async resolveSsrFramePathRoute({
+    pathRoute,
+    basePath,
+  }: {
+    pathRoute: PathRoute;
+    basePath?: string | null;
+  }): Promise<PathRoute> {
+    const pageConfigChain = await RouteElementComposer.#resolvePageConfigChain(pathRoute);
+    return {
+      ...pathRoute,
+      pageState: resolvePageState({
+        configChain: pageConfigChain,
+        path: pathRoute.path,
+        basePath: basePath ?? undefined,
+        platform: "web",
+        deviceSafeArea: { top: 0, bottom: 0 },
+        cssSafeArea: { top: 0, bottom: 0 },
+      }),
+      pageConfigChain,
+      explicitPageConfigKeys: getExplicitPageConfigKeys(pageConfigChain),
+    };
+  }
+
+  static async resolveSsrFallbackFrameState({
+    route,
+    basePath,
+  }: {
+    route: PathRoute | LayoutFallbackRoute;
+    basePath?: string | null;
+  }) {
+    const pageConfigChain = await RouteElementComposer.#resolveLayoutPageConfigChain(route);
+    return resolvePageState({
+      configChain: pageConfigChain,
+      path: route.path,
+      basePath: basePath ?? undefined,
+      platform: "web",
+      deviceSafeArea: { top: 0, bottom: 0 },
+      cssSafeArea: { top: 0, bottom: 0 },
+    });
+  }
+
   static compose({
     pathRoute,
     params,
@@ -231,6 +274,19 @@ export class RouteElementComposer {
     return [...pathRoute.renderRootLayouts, ...pathRoute.renderLayouts, pathRoute.renderPage];
   }
 
+  static async #resolveLayoutPageConfigChain(route: PathRoute | LayoutFallbackRoute): Promise<PageConfig[]> {
+    const configs = await Promise.all(
+      [...route.renderRootLayouts, ...route.renderLayouts].map((render) => render.getLayoutPageConfig?.()),
+    );
+    return configs.filter((config): config is PageConfig => Boolean(config));
+  }
+
+  static async #resolvePageConfigChain(pathRoute: PathRoute): Promise<PageConfig[]> {
+    const layoutConfigs = await RouteElementComposer.#resolveLayoutPageConfigChain(pathRoute);
+    const pageConfig = await pathRoute.renderPage.getPageConfig?.();
+    return [...layoutConfigs, ...(pageConfig ? [pageConfig] : [])];
+  }
+
   static #composeLoadingFallback(renders: RouteRender[], params: Record<string, string>): ReactNode {
     let element: ReactNode = null;
     for (let i = renders.length - 1; i >= 0; i--) {

package/server/routeTreeBuilder.ts

@@ -18,6 +18,7 @@ import {
   parseRouteModuleKey,
   routeSegmentToTreePath,
 } from "akanjs/common";
+import { validatePageConfig } from "../client/frameConfig";
 import { resolveHeadExport, resolveMetadataHead } from "./metadata";
 
 export type PagesContext = Record<string, () => Promise<RouteModule>>;
@@ -55,6 +56,7 @@ export class RouteTreeBuilder {
   ]);
   static readonly #rootLayoutExports = new Set([
     "default",
+    "pageConfig",
     "head",
     "metadata",
     "generateHead",
@@ -72,6 +74,7 @@ export class RouteTreeBuilder {
   ]);
   static readonly #layoutRouteExports = new Set([
     "default",
+    "pageConfig",
     "head",
     "metadata",
     "generateHead",
@@ -271,6 +274,7 @@ export class RouteTreeBuilder {
       RouteTreeBuilder.#moduleCacheStats.cacheMisses += 1;
       const mod = await loader();
       RouteTreeBuilder.#validateRouteModuleExports(key, kind, mod);
+      validatePageConfig(key, "pageConfig" in mod ? mod.pageConfig : undefined);
       if (!loaded) {
         RouteTreeBuilder.#moduleCacheStats.loadedModuleCount += 1;
         RouteTreeBuilder.#moduleCacheStats.loadedModuleKeys.push(key);
@@ -354,6 +358,10 @@ export class RouteTreeBuilder {
         return "pageConfig" in mod ? mod.pageConfig : undefined;
       };
     } else {
+      routeRender.getLayoutPageConfig = async () => {
+        const mod = await loadModule();
+        return "pageConfig" in mod ? mod.pageConfig : undefined;
+      };
       routeRender.resolveNotFound = async () => {
         const mod = (await loadModule()) as LayoutModule;
         routeRender.NotFound = mod.NotFound;

package/server/routing/apiRouter.ts

@@ -130,7 +130,10 @@ export class ApiRouter {
       },
       message: async (ws, message) => {
         const data = ws.data as WsTaggedData | undefined;
-        if (data?.kind === "akan-hmr") return; 
+        if (data?.kind === "akan-hmr") {
+          if (typeof message === "string" && typeof hmrHub?.handleMessage === "function") hmrHub.handleMessage(message);
+          return;
+        }
         try {
           if (typeof message === "string") {
             const msg = JSON.parse(message) as WebsocketReqData;

package/server/rscClient.tsx

@@ -47,6 +47,9 @@ declare global {
     | undefined;
   var __AKAN_RSC_REFRESH__: ((options?: { buildId?: number }) => Promise<void>) | undefined;
   var __AKAN_RSC_CLEAR_CACHE__: (() => void) | undefined;
+  var __AKAN_DEV_SYNC_NAVIGATION__: ((href: string, kind: "push" | "replace" | "back" | "pop") => void) | undefined;
+  var __AKAN_DEV_SYNC_NAVIGATION_APPLYING__: boolean | undefined;
+  var __AKAN_GET_SYNC_ROUTE_HREF__: ((href: string) => string) | undefined;
 }
 
 function decodeBase64(b64: string): Uint8Array {
@@ -514,6 +517,11 @@ function Root(): ReactNode {
 
 window.addEventListener("popstate", () => {
   void globalThis.__AKAN_RSC_NAVIGATE__?.(window.location.href, { replace: true, scrollToTop: false });
+  window.setTimeout(() => {
+    if (globalThis.__AKAN_DEV_SYNC_NAVIGATION_APPLYING__) return;
+    const href = globalThis.__AKAN_GET_SYNC_ROUTE_HREF__?.(window.location.href) ?? window.location.href;
+    globalThis.__AKAN_DEV_SYNC_NAVIGATION__?.(href, "pop");
+  }, 0);
 });
 
 const hydrate = () => hydrateRoot(document, createElement(Root));

package/server/rscWorker.tsx

@@ -12,6 +12,7 @@ import {
   getRequestPolicy,
   getRequestTheme,
   requestStorage,
+  setRequestFrameState,
   untrackedCookies,
   untrackedRequest,
   updateRequestPolicy,
@@ -1164,6 +1165,12 @@ export class RscRenderer {
     error?: unknown;
     digest?: string;
   }): Promise<ReactNode | null> {
+    setRequestFrameState(
+      await RouteElementComposer.resolveSsrFallbackFrameState({
+        route,
+        basePath: this.#getBasePath(url),
+      }),
+    );
     const body = await RouteElementComposer.composeFallback({
       kind,
       route,
@@ -1218,17 +1225,22 @@ export class RscRenderer {
     this.#logger.verbose(
       `composing route element pathname=${url.pathname} search=${url.search || "(none)"} params=${JSON.stringify(match.params)}`,
     );
-    const routeHead = await RouteElementComposer.resolveHeadWithMetadata({
+    const pathRoute = await RouteElementComposer.resolveSsrFramePathRoute({
       pathRoute: match.pathRoute,
+      basePath: this.#getBasePath(url),
+    });
+    setRequestFrameState(pathRoute.pageState);
+    const routeHead = await RouteElementComposer.resolveHeadWithMetadata({
+      pathRoute,
       params: match.params,
       searchParams,
     });
     const routeHeadSnapshot = this.#createRouteHeadSnapshot(url, routeHead, {
-      isSpecialRoute: match.pathRoute.isSpecialRoute,
+      isSpecialRoute: pathRoute.isSpecialRoute,
       hasExplicitLanguageAlternates: routeHead.hasExplicitLanguageAlternates,
     });
     const body = RouteElementComposer.compose({
-      pathRoute: match.pathRoute,
+      pathRoute,
       params: match.params,
       searchParams,
     });
@@ -1245,7 +1257,7 @@ export class RscRenderer {
             : (routeHead.node ?? this.#renderDefaultHead())}
           {!routeHeadSnapshot &&
           shouldRenderLocaleAlternates({
-            isSpecialRoute: match.pathRoute.isSpecialRoute,
+            isSpecialRoute: pathRoute.isSpecialRoute,
             hasExplicitLanguageAlternates: routeHead.hasExplicitLanguageAlternates,
           })
             ? this.#renderLocaleAlternates(url)
@@ -1266,8 +1278,13 @@ export class RscRenderer {
     this.#logger.verbose(
       `composing route suffix pathname=${url.pathname} start=${patchStartIndex} params=${JSON.stringify(match.params)}`,
     );
-    return RouteElementComposer.composeSuffix({
+    const pathRoute = await RouteElementComposer.resolveSsrFramePathRoute({
       pathRoute: match.pathRoute,
+      basePath: this.#getBasePath(url),
+    });
+    setRequestFrameState(pathRoute.pageState);
+    return RouteElementComposer.composeSuffix({
+      pathRoute,
       params: match.params,
       searchParams,
       patchStartIndex,
@@ -1315,6 +1332,14 @@ export class RscRenderer {
     return <title key="title">{process.env.AKAN_PUBLIC_APP_NAME ?? "Akan App"}</title>;
   }
 
+  #getBasePath(url: URL): string | null {
+    return getBasePathFromPathname(url.pathname, {
+      basePaths: this.#basePaths,
+      i18n: this.#i18n,
+      headerBasePath: untrackedRequest()?.headers.get("x-base-path"),
+    });
+  }
+
   async #resolveRouteHeadSnapshot(
     url: URL,
     match: { pathRoute: PathRoute; params: Record<string, string> },

package/store/baseSt.ts

@@ -44,8 +44,8 @@ export class BaseStore extends store("base" as const, () => ({
     bottomInset: 0,
     gesture: true,
     cache: false,
-    topSafeAreaColor: "transparent",
-    bottomSafeAreaColor: "transparent",
+    topSafeAreaColor: "var(--color-base-100, Canvas)",
+    bottomSafeAreaColor: "var(--color-base-100, Canvas)",
   } as PageState,
   devMode: false,
   deviceToken: "" as string,

package/types/client/capacitor.d.ts

@@ -12,6 +12,7 @@ export type CapacitorAppModule = {
     App: {
         addListener: (eventName: string, listenerFunc: (...args: unknown[]) => void) => Promise<unknown> | unknown;
         removeAllListeners: () => Promise<void> | void;
+        exitApp?: () => Promise<void> | void;
         getInfo: () => Promise<{
             id: string;
             version: string;
@@ -128,6 +129,9 @@ export type CapacitorKeyboardModule = {
     Keyboard: {
         show: () => Promise<void> | void;
         hide: () => Promise<void> | void;
+        setResizeMode?: (options: {
+            mode: "body" | "ionic" | "native" | "none";
+        }) => Promise<void> | void;
         addListener: (eventName: string, listenerFunc: (info: CapacitorKeyboardInfo) => void) => Promise<unknown> | unknown;
         removeAllListeners: () => Promise<void> | void;
     };

package/types/client/csrTypes.d.ts

@@ -5,15 +5,19 @@ import type { AnimatedComponent, AnimatedProps, Interpolation, SpringValue } fro
 import type { RouterInstance } from "./router.d.ts";
 import type { ReactFont } from "./types.d.ts";
 export type TransitionType = "none" | "fade" | "bottomUp" | "stack" | "scaleOut";
+export type PageSafeAreaConfig = boolean | "top" | "bottom" | {
+    top?: boolean;
+    bottom?: boolean;
+    android?: "auto" | "edge-to-edge" | "none";
+};
 /** Per-page CSR configuration for transition, safe-area, and gesture behavior. */
 export interface PageConfig {
     transition?: TransitionType;
-    safeArea?: boolean | "top" | "bottom";
-    topInset?: boolean | number;
-    /**
-     * @default 48px
-     */
-    bottomInset?: boolean | number;
+    safeArea?: PageSafeAreaConfig;
+    /** Top chrome reservation in px. Use true for the default 48px reservation. */
+    topInset?: number | boolean;
+    /** Bottom chrome reservation in px. Use true for the default 48px reservation. */
+    bottomInset?: number | boolean;
     gesture?: boolean;
     cache?: boolean;
     /**
@@ -100,6 +104,7 @@ export interface RouteRender {
     resolveError?: () => PromiseOrObject<LayoutErrorRender | undefined>;
     resolveHead?: ResolveHead;
     getPageConfig?: () => PromiseOrObject<PageConfig | undefined>;
+    getLayoutPageConfig?: () => PromiseOrObject<PageConfig | undefined>;
 }
 export interface WebAppManifestIcon {
     src: string;
@@ -161,6 +166,7 @@ export interface PageModule {
 }
 export interface LayoutModule {
     default?: LayoutRender;
+    pageConfig?: PageConfig;
     head?: Head;
     metadata?: AkanMetadata;
     generateHead?: GenerateHead;
@@ -179,6 +185,8 @@ export interface LayoutModule {
 export type RouteModule = PageModule | LayoutModule;
 export interface Route {
     PageConfig?: PageConfig;
+    pageConfig?: PageConfig;
+    layoutPageConfig?: PageConfig;
     path: string;
     renderPage?: RouteRender;
     renderLayout?: RouteRender;
@@ -186,6 +194,8 @@ export interface Route {
     isSpecialRoute?: boolean;
     loader?: () => unknown;
     pageState?: PageState;
+    pageConfigChain?: PageConfig[];
+    explicitPageConfigKeys?: Partial<Record<keyof PageConfig, boolean>>;
     children: Map<string, Route>;
 }
 export type AnimatedDivProps = AnimatedComponent<"div"> extends ForwardRefExoticComponent<AnimatedProps<infer P>> ? P : never;
@@ -229,9 +239,23 @@ export interface Location {
     pathRoute: PathRoute;
     hash: string;
 }
+export type CsrNavigationPhase = "idle" | "preparing" | "transitioning";
+export type CsrNavigationKind = "push" | "replace" | "back" | "popForward" | "popBack";
+export interface NavigationIntent {
+    id: number;
+    kind: CsrNavigationKind;
+    from: Location;
+    to: Location;
+    scrollTop: number;
+    scrollToTop?: boolean;
+    createdAt: number;
+}
 export interface LocationState {
     location: Location;
     prevLocation: Location | null;
+    pendingLocation?: Location | null;
+    navigationIntent?: NavigationIntent | null;
+    phase: CsrNavigationPhase;
 }
 export interface History {
     type: "initial" | "forward" | "back";
@@ -252,6 +276,9 @@ export interface RouteState {
     clientHeight: number;
     location: Location;
     prevLocation: Location | null;
+    pendingLocation: Location | null;
+    navigationIntent: NavigationIntent | null;
+    phase: CsrNavigationPhase;
     history: RefObject<History>;
     topSafeAreaRef: RefObject<HTMLDivElement | null>;
     bottomSafeAreaRef: RefObject<HTMLDivElement | null>;
@@ -263,6 +290,8 @@ export interface RouteState {
     }>;
     router: RouterInstance;
     pathRoutes: PathRoute[];
+    registerFrameSlot: (path: string, slot: FrameSlotRegistration, bucket?: FrameSlotBucket) => () => void;
+    frameLayout: FrameLayoutState;
 }
 export type UseCsrTransition = CsrTransitionStyles & {
     pageBind: (...args: unknown[]) => ReactDOMAttributes;
@@ -277,11 +306,12 @@ export type CsrContextType = RouteState & UseCsrTransition;
 export declare const csrContext: import("react").Context<CsrContextType>;
 export declare const useCsr: () => CsrContextType;
 export interface PathContextType {
-    pageType: "current" | "prev" | "cached";
+    pageType: "current" | "prev" | "cached" | "pending";
     location: Location;
     prefix?: string;
     gestureEnabled: boolean;
     setGestureEnabled: (enabled: boolean) => void;
+    registerFrameSlot: (slot: FrameSlotRegistration) => () => void;
 }
 export declare const pathContext: import("react").Context<PathContextType>;
 export declare const usePathCtx: () => PathContextType;
@@ -290,11 +320,99 @@ export interface PathRoute {
     pathSegments: string[];
     renderPage: RouteRender;
     pageState: PageState;
+    pageConfigChain?: PageConfig[];
+    explicitPageConfigKeys?: Partial<Record<keyof PageConfig, boolean>>;
     renderRootLayouts: RouteRender[];
     renderLayouts: RouteRender[];
     resolveHead?: ResolveHead;
     isSpecialRoute?: boolean;
 }
+export type FrameSlotScope = "page" | "layout";
+export type FrameSlotType = "topInset" | "bottomInset";
+export type FrameSlotBucket = "active" | "pending";
+export type FrameLayer = "page" | "topChrome" | "bottomChrome" | "keyboard" | "overlay";
+export type FrameSlotRole = "topChrome" | "bottomChrome" | "keyboardAccessory";
+export type FramePlatformProfile = "ios" | "android" | "web" | "mobileWeb";
+export interface FrameViewportState {
+    width: number;
+    height: number;
+    visualWidth: number;
+    visualHeight: number;
+    visualOffsetTop: number;
+}
+export interface KeyboardFrameState {
+    height: number;
+    offset: number;
+    visible: boolean;
+    sticky: boolean;
+    frozen?: boolean;
+    source?: "native" | "visualViewport" | "fallback";
+    animationDuration?: number;
+    animationEasing?: string;
+}
+export interface FrameContentViewportState {
+    top: number;
+    bottom: number;
+    height: number;
+}
+export interface KeyboardAccessoryFrameState {
+    top: number;
+    bottom: number;
+    height: number;
+    visible: boolean;
+    slotHeight: number;
+}
+export interface FrameSnapshot {
+    location: Location;
+    pageState: PageState;
+    viewport: FrameViewportState;
+    frameSlots: FrameSlotRegistration[];
+    measuredAt: number;
+}
+export interface TransitionActionContext {
+    plan: TransitionPlan;
+}
+export interface TransitionAction {
+    type: "page" | "topChrome" | "bottomChrome" | "keyboard" | "safeArea" | (string & {});
+    run: (ctx: TransitionActionContext) => Promise<void> | void;
+}
+export interface TransitionPlan {
+    id: number;
+    intent: NavigationIntent;
+    type: TransitionType;
+    direction: "forward" | "back";
+    fromFrame: FrameSnapshot;
+    toFrame: FrameSnapshot;
+    actions: TransitionAction[];
+    duration: number;
+}
+export interface FrameLayerZIndex {
+    page: number;
+    previousPage: number;
+    cachedPage: number;
+    topChrome: number;
+    bottomChrome: number;
+    keyboard: number;
+    overlay: number;
+}
+export interface FrameLayoutState {
+    viewport: FrameViewportState;
+    keyboard: KeyboardFrameState;
+    contentViewport: FrameContentViewportState;
+    keyboardAccessory: KeyboardAccessoryFrameState;
+    platformProfile: FramePlatformProfile;
+    zIndex: FrameLayerZIndex;
+    pageStateByPath: Map<string, PageState>;
+}
+export interface FrameSlotRegistration {
+    scope?: FrameSlotScope;
+    type: FrameSlotType;
+    role?: FrameSlotRole;
+    height?: number;
+    estimatedHeight?: number;
+    source?: "navbar" | "topInset" | "bottomInset" | "bottomTab" | (string & {});
+    cache?: boolean;
+}
 export interface LayoutFallbackRoute {
     path: string;
     pathSegments: string[];

package/types/client/frameConfig.d.ts

@@ -0,0 +1,19 @@
+import type { PageConfig, PageState } from "./csrTypes.d.ts";
+export type DevicePlatform = "ios" | "android" | "web" | (string & {});
+export type SafeAreaInsets = {
+    top: number;
+    bottom: number;
+};
+export interface ResolvePageStateOptions {
+    configChain?: PageConfig[];
+    path: string;
+    basePath?: string;
+    platform: DevicePlatform;
+    deviceSafeArea: SafeAreaInsets;
+    cssSafeArea?: SafeAreaInsets;
+}
+export declare function validatePageConfig(routeKey: string, config?: PageConfig): void;
+export declare function mergePageConfigs(configChain?: PageConfig[]): PageConfig;
+export declare function getExplicitPageConfigKeys(configChain?: PageConfig[]): Partial<Record<keyof PageConfig, boolean>>;
+export declare function resolvePageState({ configChain, path, basePath, platform, deviceSafeArea, cssSafeArea, }: ResolvePageStateOptions): PageState;
+export declare function readCssSafeAreaInsets(): SafeAreaInsets;

package/types/client/frameDebug.d.ts

@@ -0,0 +1,3 @@
+type DebugPayload = Record<string, unknown>;
+export declare function debugFrame(event: string, payload?: DebugPayload): void;
+export {};

package/types/client/index.d.ts

@@ -4,6 +4,8 @@ export * from "./createFont.d.ts";
 export * from "./csrTypes.d.ts";
 export * from "./decorators.d.ts";
 export * from "./device.d.ts";
+export * from "./frameConfig.d.ts";
+export * from "./frameDebug.d.ts";
 export * from "./locale.d.ts";
 export * from "./makePageProto.d.ts";
 export * from "./router.d.ts";

package/types/client/router.d.ts

@@ -43,6 +43,8 @@ export declare class AkanNotFoundError extends Error {
 }
 declare global {
     var __AKAN_ROUTER__: Router | undefined;
+    var __AKAN_DEV_SYNC_NAVIGATION__: ((href: string, kind: "push" | "replace" | "back" | "pop") => void) | undefined;
+    var __AKAN_DEV_SYNC_NAVIGATION_APPLYING__: boolean | undefined;
 }
 export declare const getPathInfo: (requestUrl: string, lang: string, prefix: string) => {
     path: string;

package/types/fetch/requestStorage.d.ts

@@ -12,6 +12,7 @@ export interface AkanDynamicUsage {
 export interface AkanRequestStore {
     request: Request;
     theme?: AkanTheme;
+    frameState?: unknown;
     queryCache: Map<string, Promise<unknown>>;
     policy: AkanRequestPolicy;
     dynamicUsage: AkanDynamicUsage;
@@ -29,6 +30,8 @@ export declare function createRequestStore(request: Request, policy?: Partial<Om
 /** Stores theme preference on the active request when server rendering. */
 export declare function setRequestTheme(theme: AkanTheme | undefined): void;
 export declare function getRequestTheme(): AkanTheme | undefined;
+export declare function setRequestFrameState(frameState: unknown): void;
+export declare function getRequestFrameState<FrameState = unknown>(): FrameState | undefined;
 export declare function pushRequestFallback(storeOrRequest: Request | AkanRequestStore): () => void;
 /** Returns the active server request store from AsyncLocalStorage or the fallback stack. */
 export declare function getRequestStore(): AkanRequestStore | undefined;