@ilha/router 0.3.6 → 0.3.8

package/README.md

@@ -562,6 +562,8 @@ RouterLink.toString({ href: "/about", label: "About" });
 
 Wraps a page island with a layout handler. Used internally by the Vite plugin codegen — also available for manual composition.
 
+On client hydration, `wrapLayout` mounts the full layout island (layout child slots `p:*` and the keyed page slot `k:page`) from existing SSR DOM — it does not re-render layout markup from serialized props. Interactive components in `+layout.tsx` (state, event handlers, nested islands) hydrate the same way as the page.
+
 ```ts
 import { wrapLayout } from "@ilha/router";
 

package/dist/index.js

@@ -1,2 +1,2 @@
-import { C as wrapError, E as setHistoryMode, S as useRoute, T as getHistoryMode, _ as routeParams, a as RouterView, b as router, c as enableLinkInterception, d as loader, f as navigate, g as routeHash, h as redirect, i as RouterLink, l as error, m as prime, n as LoaderError, o as composeLoaders, p as prefetch, r as Redirect, s as defineLayout, t as LOADER_ENDPOINT, u as isActive, v as routePath, w as wrapLayout, x as src_default, y as routeSearch } from "./src-BFZ-RQw6.js";
+import { C as wrapError, E as setHistoryMode, S as useRoute, T as getHistoryMode, _ as routeParams, a as RouterView, b as router, c as enableLinkInterception, d as loader, f as navigate, g as routeHash, h as redirect, i as RouterLink, l as error, m as prime, n as LoaderError, o as composeLoaders, p as prefetch, r as Redirect, s as defineLayout, t as LOADER_ENDPOINT, u as isActive, v as routePath, w as wrapLayout, x as src_default, y as routeSearch } from "./src-BBvRqv3b.js";
 export { LOADER_ENDPOINT, LoaderError, Redirect, RouterLink, RouterView, composeLoaders, src_default as default, defineLayout, enableLinkInterception, error, getHistoryMode, isActive, loader, navigate, prefetch, prime, redirect, routeHash, routeParams, routePath, routeSearch, router, setHistoryMode, useRoute, wrapError, wrapLayout };

package/dist/{src-BFZ-RQw6.js → src-BBvRqv3b.js}

@@ -180,7 +180,48 @@ function composeLoaders(loaders) {
 	};
 }
 function wrapLayout(layout, page) {
-	return layout(page);
+	const Wrapped = layout(Object.assign(page.key("page"), { toString: page.toString.bind(page) }));
+	function pageMountHost(host) {
+		return host.querySelector("[data-ilha-slot=\"k:page\"]") ?? host;
+	}
+	function preparePageMountHost(outer, mountHost) {
+		if (mountHost.hasAttribute("data-ilha-state")) return;
+		const outerState = outer.getAttribute("data-ilha-state");
+		if (!outerState) return;
+		try {
+			const snapshot = JSON.parse(outerState);
+			delete snapshot._skipOnMount;
+			mountHost.setAttribute("data-ilha-state", JSON.stringify(snapshot));
+		} catch {}
+	}
+	const layoutMount = Wrapped.mount.bind(Wrapped);
+	const layoutInternal = Wrapped[ISLAND_MOUNT_INTERNAL];
+	function prepareLayoutMountHost(host) {
+		preparePageMountHost(host, pageMountHost(host));
+		host.removeAttribute("data-ilha-state");
+	}
+	Wrapped.mount = (host, props) => {
+		prepareLayoutMountHost(host);
+		return layoutMount(host, props);
+	};
+	Wrapped[ISLAND_MOUNT_INTERNAL] = (host, props) => {
+		prepareLayoutMountHost(host);
+		if (typeof layoutInternal === "function") return layoutInternal(host, props);
+		return {
+			unmount: layoutMount(host, props),
+			updateProps: () => {}
+		};
+	};
+	Wrapped.hydratable = async (props, opts) => {
+		if (!opts?.name) throw new Error("wrapLayout: hydratable requires options.name");
+		const resolvedProps = props ?? {};
+		const pageBlock = await page.hydratable(resolvedProps, opts);
+		const openTag = pageBlock.match(/^<([a-zA-Z][\w-]*)\s([^>]*)>/);
+		if (!openTag) return pageBlock;
+		const layoutInner = Wrapped.toString(resolvedProps);
+		return `<${openTag[1]} ${openTag[2]}>${layoutInner}</${openTag[1]}>`;
+	};
+	return Wrapped;
 }
 function wrapError(handler, page) {
 	const Wrapper = ilha.render(() => {
@@ -246,6 +287,10 @@ function wrapError(handler, page) {
 			};
 		}
 	};
+	Wrapper.hydratable = async (props, opts) => {
+		if (!opts?.name) throw new Error("wrapError: hydratable requires options.name");
+		return page.hydratable(props ?? {}, opts);
+	};
 	return Wrapper;
 }
 function defineLayout(layout) {

package/dist/vite.d.ts

@@ -18,7 +18,7 @@ import SassEmbedded from "sass-embedded";
 import Less from "less";
 import Stylus from "stylus";
 
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/hmrPayload.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/hmrPayload.d.ts
 type HotPayload = ConnectedPayload | PingPayload | UpdatePayload | FullReloadPayload | CustomPayload | ErrorPayload | PrunePayload;
 interface ConnectedPayload {
   type: 'connected';
@@ -83,7 +83,7 @@ interface ErrorPayload {
   };
 }
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/dist/node/chunks/moduleRunnerTransport.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/dist/node/chunks/moduleRunnerTransport.d.ts
 //#region src/shared/invokeMethods.d.ts
 interface FetchFunctionOptions {
   cached?: boolean;
@@ -136,7 +136,7 @@ interface ViteFetchResult {
   invalidate: boolean;
 }
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/customEvent.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/customEvent.d.ts
 interface CustomEventMap {
   // client events
   'vite:beforeUpdate': UpdatePayload;
@@ -6297,13 +6297,13 @@ interface TransformOptions$1 extends BindingEnhancedTransformOptions {}
 * @category Utilities
 */
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/internal/esbuildOptions.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/internal/esbuildOptions.d.ts
 /* eslint-enable @typescript-eslint/ban-ts-comment */
 type EsbuildTarget = string | string[];
 type EsbuildTransformOptions = esbuild.TransformOptions;
 type DepsOptimizerEsbuildOptions = Omit<esbuild.BuildOptions, 'bundle' | 'entryPoints' | 'external' | 'write' | 'watch' | 'outdir' | 'outfile' | 'outbase' | 'outExtension' | 'metafile'>;
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/metadata.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/metadata.d.ts
 interface AssetMetadata {
   importedAssets: Set<string>;
   importedCss: Set<string>;
@@ -6346,16 +6346,16 @@ declare module 'rolldown' {
   }
 }
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/internal/terserOptions.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/internal/terserOptions.d.ts
 /* eslint-enable @typescript-eslint/ban-ts-comment */
 type TerserMinifyOptions = Terser.MinifyOptions;
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/internal/lightningcssOptions.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/internal/lightningcssOptions.d.ts
 /* eslint-enable @typescript-eslint/ban-ts-comment */
 type LightningCSSOptions = Omit<Lightningcss.BundleAsyncOptions<Lightningcss.CustomAtRules>, 'filename' | 'resolver' | 'minify' | 'sourceMap' | 'analyzeDependencies' // properties not overridden by Vite, but does not make sense to set by end users
 | 'inputSourceMap' | 'projectRoot'>;
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/internal/cssPreprocessorOptions.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/internal/cssPreprocessorOptions.d.ts
 /* eslint-enable @typescript-eslint/ban-ts-comment */
 // https://github.com/type-challenges/type-challenges/issues/29285
 type IsAny<T> = boolean extends (T extends never ? true : false) ? true : false;
@@ -6374,7 +6374,7 @@ declare global {
   interface HTMLLinkElement {}
 }
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/types/importGlob.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/types/importGlob.d.ts
 /**
  * Declare Worker in case DOM is not added to the tsconfig lib causing
  * Worker interface is not defined. For developers with DOM lib added,
@@ -6385,7 +6385,7 @@ declare global {
   interface Worker {}
 }
 //#endregion
-//#region ../../node_modules/.bun/vite@8.0.14+1472ca47ea14e560/node_modules/vite/dist/node/index.d.ts
+//#region ../../node_modules/.bun/vite@8.0.14+9357385a17cbd143/node_modules/vite/dist/node/index.d.ts
 //#region \0rolldown/runtime.js
 //#endregion
 //#region ../../node_modules/.pnpm/@vitejs+devtools@0.1.24_typescript@6.0.3_vite@packages+vite/node_modules/@vitejs/devtools/dist/cli-commands.d.ts

package/dist/vite.js

@@ -1,4 +1,4 @@
-import { C as wrapError, w as wrapLayout } from "./src-BFZ-RQw6.js";
+import { C as wrapError, w as wrapLayout } from "./src-BBvRqv3b.js";
 import { mkdir, readFile, readdir, writeFile } from "node:fs/promises";
 import { basename, dirname, extname, join, relative, resolve } from "node:path";
 //#region src/vite.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ilha/router",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "description": "A tiny SPA router for Ilha",
   "license": "MIT",
   "author": "Ryuz <ryuzer@proton.me>",
@@ -30,7 +30,7 @@
     "test": "bun test"
   },
   "dependencies": {
-    "ilha": "0.6.0",
+    "ilha": "0.6.1",
     "rou3": "0.8.1"
   },
   "devDependencies": {