@moku-labs/web 1.16.1 → 2.0.0

package/dist/index.cjs

@@ -8039,17 +8039,22 @@ function createApi$1(ctx) {
 		* @example
 		* await api.update(["src/islands/board.ts"]);
 		*/
-		update(changes, options = {}) {
+		async update(changes, options = {}) {
 			const overrides = devBuildOverrides({
 				og: options.og ?? false,
 				sitemap: options.sitemap ?? false,
 				feeds: options.feeds ?? false
 			});
-			return ctx.require(buildPlugin).run({
-				skipClean: true,
-				overrides,
-				changed: changes
-			});
+			ctx.state.render.setDriven(true);
+			try {
+				return await ctx.require(buildPlugin).run({
+					skipClean: true,
+					overrides,
+					changed: changes
+				});
+			} finally {
+				ctx.state.render.setDriven(false);
+			}
 		},
 		/**
 		* Dev loop: build once, serve `dist/` in-process (live-reload injected), watch
@@ -8342,6 +8347,7 @@ function createPanelRenderer(options = {}) {
 	let idle = false;
 	let idleStartedAt = 0;
 	let serveMode = false;
+	let driven = false;
 	let ticker;
 	/**
 	* Render one phase-tree row: a spinning cyan glyph + dim name while running, or a green
@@ -8503,7 +8509,7 @@ function createPanelRenderer(options = {}) {
 		* render.phase({ phase: "pages", status: "done", durationMs: 12 });
 		*/
 		phase(phase) {
-			if (rebuilding) return;
+			if (rebuilding || driven) return;
 			if (!color) {
 				if (phase.status === "done") write(`  ${palette.green("✓")} ${phase.phase}${durationSuffix(palette, phase.durationMs)}`);
 				return;
@@ -8537,7 +8543,7 @@ function createPanelRenderer(options = {}) {
 		* render.built({ outDir: "dist", pageCount: 12, durationMs: 840 });
 		*/
 		built(summary) {
-			if (rebuilding) return;
+			if (rebuilding || driven) return;
 			if (color && phaseOpen) {
 				let frame = (0, _moku_labs_common_cli.cursorUp)(phaseDrawn);
 				for (const row of phaseRows) frame += `${_moku_labs_common_cli.CLEAR_LINE}${renderPhaseRow(row)}\n`;
@@ -8711,6 +8717,20 @@ function createPanelRenderer(options = {}) {
 			if (detail !== void 0) for (const line of detail.split("\n")) write(`      ${palette.dim(line)}`);
 		},
 		/**
+		* Mark the build TUI as externally driven: when `on`, the per-phase build tree and the BUILD
+		* summary are suppressed so an external dev driver (e.g. the worker's `dev({ onChange })` loop,
+		* which calls `update()` and renders its own concise rebuild line) is the sole source of rebuild
+		* output. Off by default; a standalone `build()` / `serve()` renders the full TUI as before.
+		*
+		* @param on - Whether an external driver owns the dev TUI.
+		* @example
+		* render.setDriven(true);  // before an externally-driven update()
+		* render.setDriven(false); // after it settles
+		*/
+		setDriven(on) {
+			driven = on;
+		},
+		/**
 		* Stop every animation and release the interval timer (serve()'s teardown calls this).
 		*
 		* @example
@@ -9127,15 +9147,15 @@ const cliPlugin = createPlugin$1("cli", {
 function createApi(ctx) {
 	return {
 		/**
-		* Register a component definition (last-registered-wins); warns on collision.
+		* Register a island definition (last-registered-wins); warns on collision.
 		*
-		* @param component - The component definition created via `createComponent`.
+		* @param island - The island definition created via `createIsland`.
 		* @example
 		* app.spa.register(counter);
 		*/
-		register(component) {
-			if (ctx.state.registeredComponents.has(component.name)) ctx.log.warn("spa:component-collision", { name: component.name });
-			ctx.state.kernel?.register(component);
+		register(island) {
+			if (ctx.state.registeredIslands.has(island.name)) ctx.log.warn("spa:island-collision", { name: island.name });
+			ctx.state.kernel?.register(island);
 		},
 		/**
 		* Programmatically navigate to a path (client runtime; no-op without a DOM).
@@ -9161,13 +9181,13 @@ function createApi(ctx) {
 		* Resolve a registered island's api by name (the cross-island seam). Returns
 		* `undefined` when no provider with that name is currently registered.
 		*
-		* @param name - The provider island's component name.
+		* @param name - The provider island's island name.
 		* @returns The provider's api, or `undefined`.
 		* @example
-		* app.spa.component("lightbox");
+		* app.spa.island("lightbox");
 		*/
-		component(name) {
-			return ctx.state.componentApis.get(name);
+		island(name) {
+			return ctx.state.islandApis.get(name);
 		}
 	};
 }
@@ -9186,15 +9206,89 @@ function spaEvents(register) {
 	return {
 		"spa:navigate": register("A navigation has been intercepted and is starting."),
 		"spa:navigated": register("The swap completed and the new URL is active."),
-		"spa:component-mount": register("A component instance attached to an element."),
-		"spa:component-unmount": register("A component instance detached from an element.")
+		"spa:island-mount": register("A island instance attached to an element."),
+		"spa:island-unmount": register("A island instance detached from an element.")
 	};
 }
 //#endregion
+//#region src/plugins/spa/head.ts
+/** Single-element head selectors synced by replace/append/remove on navigation. */
+const META_SELECTORS = [
+	"meta[name=\"description\"]",
+	"meta[property=\"og:title\"]",
+	"meta[property=\"og:description\"]",
+	"meta[property=\"og:url\"]",
+	"meta[property=\"og:image\"]",
+	"meta[property=\"og:type\"]",
+	"meta[property=\"og:locale\"]",
+	"meta[name=\"twitter:card\"]",
+	"meta[name=\"twitter:title\"]",
+	"meta[name=\"twitter:description\"]",
+	"meta[name=\"twitter:image\"]",
+	"meta[name=\"twitter:site\"]",
+	"link[rel=\"canonical\"]"
+];
+/** Head element groups fully replaced (remove-all-then-clone) on navigation. */
+const REPLACE_ALL_SELECTORS = [
+	"script[type=\"application/ld+json\"]",
+	"link[rel=\"alternate\"][hreflang]",
+	"meta[property^=\"article:\"]"
+];
+/**
+* Sync a single head element by selector between the fetched and live document:
+* replace when both exist, append when only the new doc has it, remove when only
+* the live doc has it.
+*
+* @param selector - CSS selector for the head element to sync.
+* @param doc - The fetched document (DOMParser-parsed).
+* @example
+* syncElement('link[rel="canonical"]', doc);
+*/
+function syncElement(selector, doc) {
+	const newElement = doc.querySelector(selector);
+	const oldElement = document.querySelector(selector);
+	if (newElement && oldElement) oldElement.replaceWith(newElement.cloneNode(true));
+	else if (newElement) document.head.append(newElement.cloneNode(true));
+	else if (oldElement) oldElement.remove();
+}
+/**
+* Remove all live matches for a selector and re-clone the fetched document's
+* matches into the live `<head>`.
+*
+* @param selector - CSS selector for the element group to replace wholesale.
+* @param doc - The fetched document (DOMParser-parsed).
+* @example
+* replaceAllBySelector('script[type="application/ld+json"]', doc);
+*/
+function replaceAllBySelector(selector, doc) {
+	for (const element of document.querySelectorAll(selector)) element.remove();
+	for (const element of doc.querySelectorAll(selector)) document.head.append(element.cloneNode(true));
+}
+/**
+* Syncs the live document `<head>` after a navigation from the fetched document
+* (whose head was composed by the `head` plugin). Recomputes
+* title/meta/canonical/JSON-LD/hreflang/`<html lang>` once and applies them.
+* The `head` API is accepted to bind the structural dependency (spec/09 deps).
+*
+* @param _head - The head plugin API (dependency binding; composition reused via the fetched doc).
+* @param doc - The fetched document parsed from the navigated page's HTML.
+* @example
+* syncHead(headApi, parsedDoc);
+*/
+function syncHead(_head, doc) {
+	if (typeof document === "undefined") return;
+	const newTitle = doc.querySelector("title")?.textContent;
+	if (newTitle) document.title = newTitle;
+	const newLang = doc.documentElement.lang;
+	if (newLang) document.documentElement.lang = newLang;
+	for (const selector of META_SELECTORS) syncElement(selector, doc);
+	for (const selector of REPLACE_ALL_SELECTORS) replaceAllBySelector(selector, doc);
+}
+//#endregion
 //#region src/plugins/spa/types.ts
-var types_exports$7 = /* @__PURE__ */ require_convention.__exportAll({ COMPONENT_HOOK_NAMES: () => COMPONENT_HOOK_NAMES });
+var types_exports$7 = /* @__PURE__ */ require_convention.__exportAll({ ISLAND_HOOK_NAMES: () => ISLAND_HOOK_NAMES });
 /** Allowed hook names — single source of truth for fail-fast validation. */
-const COMPONENT_HOOK_NAMES = [
+const ISLAND_HOOK_NAMES = [
 	"onCreate",
 	"onMount",
 	"onNavStart",
@@ -9203,10 +9297,10 @@ const COMPONENT_HOOK_NAMES = [
 	"onDestroy"
 ];
 //#endregion
-//#region src/plugins/spa/components.ts
+//#region src/plugins/spa/islands.ts
 /**
-* @file spa plugin — component lifecycle, mounting, the plugin-mirror authoring
-* surface (`createComponent` with a typed `{ state, render, events, api }` spec),
+* @file spa plugin — island lifecycle, mounting, the plugin-mirror authoring
+* surface (`createIsland` with a typed `{ state, render, events, api }` spec),
 * the per-instance state + microtask-batched render scheduler, declarative
 * delegated events, and the cross-island api registry.
 * @see README.md
@@ -9214,8 +9308,8 @@ const COMPONENT_HOOK_NAMES = [
 /** Error prefix for spa fail-fast failures (spec/11 Part-3). */
 const ERROR_PREFIX$2 = "[web]";
 /** The set of legal hook names, frozen for O(1) membership checks. */
-const HOOK_NAME_SET = new Set(COMPONENT_HOOK_NAMES);
-/** The spec-only keys that select the plugin-mirror form of {@link createComponent}. */
+const HOOK_NAME_SET = new Set(ISLAND_HOOK_NAMES);
+/** The spec-only keys that select the plugin-mirror form of {@link createIsland}. */
 const SPEC_KEYS = new Set([
 	"state",
 	"render",
@@ -9254,7 +9348,7 @@ let renderChunk;
 let commitVNodeFunction;
 /**
 * Load the lazy `./render` chunk (once) and cache its `commitVNode` for synchronous
-* use by later renders. Awaited by a component's `mountPromise` so the test harness's
+* use by later renders. Awaited by a island's `mountPromise` so the test harness's
 * `settle()` can deterministically flush a VNode render.
 *
 * @returns A promise that resolves once `commitVNode` is available.
@@ -9262,7 +9356,7 @@ let commitVNodeFunction;
 * await loadRenderChunk();
 */
 async function loadRenderChunk() {
-	renderChunk ??= Promise.resolve().then(() => require("./render-KdufA3_b.cjs"));
+	renderChunk ??= Promise.resolve().then(() => require("./render-DHUcHCYs.cjs"));
 	commitVNodeFunction = (await renderChunk).commitVNode;
 }
 /**
@@ -9271,7 +9365,7 @@ async function loadRenderChunk() {
 * a Preact `VNode` → committed through the lazy gate (loading it on demand if needed).
 *
 * @param host - The island host element to render into.
-* @param result - The value returned by the component's `render`.
+* @param result - The value returned by the island's `render`.
 * @example
 * commitResult(host, h(View, { items }));
 */
@@ -9293,7 +9387,7 @@ function commitResult(host, result) {
 	loadRenderChunk().then(() => commitVNodeFunction?.(vnode, host)).catch(() => {});
 }
 /**
-* Run a component's `render(state, ctx)` and commit the result now. Guards against
+* Run a island's `render(state, ctx)` and commit the result now. Guards against
 * synchronous re-entrancy (a render that calls `ctx.flush`) with a depth cap.
 *
 * @param instance - The instance to render.
@@ -9304,7 +9398,7 @@ function commitResult(host, result) {
 function runRender(instance) {
 	const render = instance.def.spec?.render;
 	if (!render) return;
-	if (instance.renderDepth > MAX_RENDER_DEPTH) throw new Error(`${ERROR_PREFIX$2} component "${instance.def.name}" render re-entered ${MAX_RENDER_DEPTH}+ times\n  → a render must not synchronously trigger its own render (avoid ctx.flush() inside render)`);
+	if (instance.renderDepth > MAX_RENDER_DEPTH) throw new Error(`${ERROR_PREFIX$2} island "${instance.def.name}" render re-entered ${MAX_RENDER_DEPTH}+ times\n  → a render must not synchronously trigger its own render (avoid ctx.flush() inside render)`);
 	instance.renderDepth += 1;
 	try {
 		commitResult(instance.el, render(instance.state ?? {}, instance.ctx));
@@ -9330,12 +9424,12 @@ function scheduleRender(instance) {
 	});
 }
 /**
-* Build the single per-instance {@link ComponentContext} reused by every hook, event
+* Build the single per-instance {@link IslandContext} reused by every hook, event
 * handler, and render. Route fields (`params`/`meta`/`locale`/`url`) and `data` read
 * through the instance so a navigation update is reflected without rebuilding the ctx;
-* `state`/`set`/`flush`/`cleanup`/`component` are bound to the instance + plugin state.
+* `state`/`set`/`flush`/`cleanup`/`island` are bound to the instance + plugin state.
 *
-* @param state - The plugin state (for the cross-island `component` resolver).
+* @param state - The plugin state (for the cross-island `island` resolver).
 * @param instance - The instance the context is bound to.
 * @returns The instance-bound context.
 * @example
@@ -9439,13 +9533,13 @@ function buildContext(state, instance) {
 		/**
 		* Resolve another island's registered api by name (`undefined` when absent).
 		*
-		* @param name - The provider island's component name.
+		* @param name - The provider island's island name.
 		* @returns The provider's api, or `undefined`.
 		* @example
-		* ctx.component("lightbox");
+		* ctx.island("lightbox");
 		*/
-		component(name) {
-			return state.componentApis.get(name);
+		island(name) {
+			return state.islandApis.get(name);
 		}
 	};
 }
@@ -9469,7 +9563,7 @@ function matchTarget(host, event, selector) {
 	return matched && host.contains(matched) ? matched : void 0;
 }
 /**
-* Attach a component's declarative `events` map: one real listener per event TYPE on
+* Attach a island's declarative `events` map: one real listener per event TYPE on
 * the host (dispatch walks `closest(selector)` for each registered selector), each
 * removed via the instance's cleanup registry on destroy.
 *
@@ -9486,7 +9580,7 @@ function attachEvents(instance, events) {
 		const space = key.indexOf(" ");
 		const type = (space === -1 ? key : key.slice(0, space)).trim();
 		const selector = space === -1 ? "" : key.slice(space + 1).trim();
-		if (type === "") throw new Error(`${ERROR_PREFIX$2} component "${instance.def.name}" event key must start with an event type: "${key}"\n  → use "<type>" or "<type> <selector>" (e.g. "click [data-action]")`);
+		if (type === "") throw new Error(`${ERROR_PREFIX$2} island "${instance.def.name}" event key must start with an event type: "${key}"\n  → use "<type>" or "<type> <selector>" (e.g. "click [data-action]")`);
 		const list = byType.get(type) ?? [];
 		list.push({
 			selector,
@@ -9509,62 +9603,62 @@ function attachEvents(instance, events) {
 * Validate a single hook entry: its key must be a known hook name and its value
 * must be a function. Throws fail-fast on the first violation.
 *
-* @param componentName - The owning component name (for error messages).
+* @param islandName - The owning island name (for error messages).
 * @param source - The raw authoring object being validated.
 * @param key - The hook key to validate.
-* @throws {Error} If `key` is not in `COMPONENT_HOOK_NAMES`.
+* @throws {Error} If `key` is not in `ISLAND_HOOK_NAMES`.
 * @throws {TypeError} If the hook value is not a function.
 * @example
 * validateHookEntry("counter", source, "onMount");
 */
-function validateHookEntry(componentName, source, key) {
-	if (!HOOK_NAME_SET.has(key)) throw new Error(`${ERROR_PREFIX$2} unknown component hook "${key}" on "${componentName}"\n  → valid hooks: ${COMPONENT_HOOK_NAMES.join(", ")}\n  → spec keys: state, render, events, api`);
-	if (typeof source[key] !== "function") throw new TypeError(`${ERROR_PREFIX$2} component hook "${key}" on "${componentName}" must be a function\n  → provide a function or omit the hook`);
+function validateHookEntry(islandName, source, key) {
+	if (!HOOK_NAME_SET.has(key)) throw new Error(`${ERROR_PREFIX$2} unknown island hook "${key}" on "${islandName}"\n  → valid hooks: ${ISLAND_HOOK_NAMES.join(", ")}\n  → spec keys: state, render, events, api`);
+	if (typeof source[key] !== "function") throw new TypeError(`${ERROR_PREFIX$2} island hook "${key}" on "${islandName}" must be a function\n  → provide a function or omit the hook`);
 }
 /**
 * Validate the spec extras (`state`/`render`/`api` must be functions; `events` must be
 * a plain object of functions). Throws fail-fast on the first violation.
 *
-* @param componentName - The owning component name (for error messages).
+* @param islandName - The owning island name (for error messages).
 * @param extras - The partitioned spec extras to validate.
 * @throws {TypeError} If a present extra has the wrong shape.
 * @example
 * validateSpecExtras("board", { state: () => ({}) });
 */
-function validateSpecExtras(componentName, extras) {
+function validateSpecExtras(islandName, extras) {
 	for (const key of [
 		"state",
 		"render",
 		"api"
-	]) if (extras[key] !== void 0 && typeof extras[key] !== "function") throw new TypeError(`${ERROR_PREFIX$2} component "${key}" on "${componentName}" must be a function\n  → provide a function or omit it`);
+	]) if (extras[key] !== void 0 && typeof extras[key] !== "function") throw new TypeError(`${ERROR_PREFIX$2} island "${key}" on "${islandName}" must be a function\n  → provide a function or omit it`);
 	if (extras.events !== void 0) {
 		const events = extras.events;
-		if (!(typeof events === "object")) throw new TypeError(`${ERROR_PREFIX$2} component "events" on "${componentName}" must be an object of handlers`);
-		for (const [key, handler] of Object.entries(events)) if (typeof handler !== "function") throw new TypeError(`${ERROR_PREFIX$2} component event "${key}" on "${componentName}" must be a function`);
+		if (!(typeof events === "object")) throw new TypeError(`${ERROR_PREFIX$2} island "events" on "${islandName}" must be an object of handlers`);
+		for (const [key, handler] of Object.entries(events)) if (typeof handler !== "function") throw new TypeError(`${ERROR_PREFIX$2} island event "${key}" on "${islandName}" must be a function`);
 	}
 }
 /**
-* Create a validated component definition. Accepts either the legacy hooks-only form
-* (`createComponent("counter", { onMount() {} })`) or the plugin-mirror spec form
-* (`createComponent("board", { state, render, events, api, ...hooks })`). Spec-only
+* Create a validated island definition. Accepts either the legacy hooks-only form
+* (`createIsland("counter", { onMount() {} })`) or the plugin-mirror spec form
+* (`createIsland("board", { state, render, events, api, ...hooks })`). Spec-only
 * keys (`state`/`render`/`events`/`api`) are partitioned out before hook-name
 * validation, so a real typo (e.g. `onMout`) still throws immediately while the spec
 * keys are accepted.
 *
-* @param name - Unique component name.
+* @param name - Unique island name.
 * @param spec - Lifecycle hooks, or the `{ state, render, events, api, ...hooks }` spec.
-* @returns A `ComponentDef` ready to `register`.
+* @returns A `IslandDef` ready to `register`.
 * @throws {Error} If `name` is empty, a hook key is unknown, or an extra/hook value has the wrong shape.
 * @example
-* const counter = createComponent("counter", { onMount({ el }) { el.textContent = "0"; } });
+* const counter = createIsland("counter", { onMount({ el }) { el.textContent = "0"; } });
 * @example
-* const list = createComponent<{ items: string[] }>("list", {
+* const list = createIsland<{ items: string[] }>("list", {
 *   state: () => ({ items: [] }),
 *   render: (s) => h(List, { items: s.items })
 * });
 */
-function createComponent(name, spec) {
-	if (name.trim() === "") throw new Error(`${ERROR_PREFIX$2} component name must be a non-empty string\n  → pass a unique name to createComponent("name", hooks)`);
+function createIsland(name, spec) {
+	if (name.trim() === "") throw new Error(`${ERROR_PREFIX$2} island name must be a non-empty string\n  → pass a unique name to createIsland("name", hooks)`);
 	const source = spec;
 	const hooks = {};
 	const extras = {};
@@ -9641,30 +9735,30 @@ function disposeInstance(state, instance) {
 	} catch {}
 	instance.cleanups.length = 0;
 	instance.renderScheduled = false;
-	if (instance.api !== void 0 && state.componentApis.get(instance.def.name) === instance.api) state.componentApis.delete(instance.def.name);
+	if (instance.api !== void 0 && state.islandApis.get(instance.def.name) === instance.api) state.islandApis.delete(instance.def.name);
 }
 /**
-* Mounts a single `data-component` element: classifies persistent vs page-specific,
+* Mounts a single `data-island` element: classifies persistent vs page-specific,
 * builds the instance + its bound context, initializes per-instance `state`, registers
 * its `api`, attaches declarative `events`, fires `onCreate` then `onMount` (capturing
 * an async `onMount` + render-chunk load as `mountPromise`), schedules the initial
-* render, records it, and emits `spa:component-mount`. No-ops if the element is already
-* mounted, has no component name, or names an unregistered component.
+* render, records it, and emits `spa:island-mount`. No-ops if the element is already
+* mounted, has no island name, or names an unregistered island.
 *
-* @param state - The plugin state (registeredComponents + instances + componentApis).
-* @param emit - The event emitter for spa:component-mount.
+* @param state - The plugin state (registeredIslands + instances + islandApis).
+* @param emit - The event emitter for spa:island-mount.
 * @param swapArea - The swap-region element, or null when none was found.
 * @param data - The current page data payload.
-* @param element - The candidate element carrying a `data-component` attribute.
+* @param element - The candidate element carrying a `data-island` attribute.
 * @param route - The matched-route slice for the current URL (params/meta/locale/url).
 * @example
 * mountElement(state, emit, swapArea, data, element, route);
 */
 function mountElement(state, emit, swapArea, data, element, route = EMPTY_ROUTE) {
 	if (state.instances.has(element)) return;
-	const name = element.dataset.component;
+	const name = element.dataset.island;
 	if (!name) return;
-	const definition = state.registeredComponents.get(name);
+	const definition = state.registeredIslands.get(name);
 	if (!definition) return;
 	const instance = {
 		def: definition,
@@ -9690,7 +9784,7 @@ function mountElement(state, emit, swapArea, data, element, route = EMPTY_ROUTE)
 	if (spec?.state) instance.state = spec.state(instance.ctx);
 	if (spec?.api) {
 		instance.api = spec.api(instance.ctx);
-		state.componentApis.set(definition.name, instance.api);
+		state.islandApis.set(definition.name, instance.api);
 	}
 	if (spec?.events) attachEvents(instance, spec.events);
 	runHook(instance, "onCreate");
@@ -9701,20 +9795,20 @@ function mountElement(state, emit, swapArea, data, element, route = EMPTY_ROUTE)
 	if (onMountResult && typeof onMountResult.then === "function") pending.push(onMountResult);
 	instance.mountPromise = pending.length > 0 ? Promise.all(pending).then(() => {}) : void 0;
 	state.instances.set(element, instance);
-	emit("spa:component-mount", {
+	emit("spa:island-mount", {
 		name: definition.name,
 		el: element
 	});
 }
 /**
-* Scans the swap region, mounts components for matching `data-component` elements,
+* Scans the swap region, mounts islands for matching `data-island` elements,
 * classifies persistent (outside swap area) vs page-specific (inside), runs
-* `onCreate`/`onMount` + initial render, and emits `spa:component-mount` per instance.
+* `onCreate`/`onMount` + initial render, and emits `spa:island-mount` per instance.
 * Already-mounted elements are skipped.
 *
-* @param state - The plugin state (registeredComponents + instances + componentApis).
-* @param emit - The event emitter for spa:component-mount.
-* @param swapSelector - CSS selector bounding page-specific components.
+* @param state - The plugin state (registeredIslands + instances + islandApis).
+* @param emit - The event emitter for spa:island-mount.
+* @param swapSelector - CSS selector bounding page-specific islands.
 * @param route - The matched-route slice for the current URL (params/meta/locale/url).
 * @example
 * scanAndMount(state, emit, "main > section", route);
@@ -9723,16 +9817,16 @@ function scanAndMount(state, emit, swapSelector, route = EMPTY_ROUTE) {
 	if (typeof document === "undefined") return;
 	const swapArea = document.querySelector(swapSelector);
 	const data = extractPageData(document);
-	for (const element of document.querySelectorAll("[data-component]")) mountElement(state, emit, swapArea, data, element, route);
+	for (const element of document.querySelectorAll("[data-island]")) mountElement(state, emit, swapArea, data, element, route);
 }
 /**
 * Unmounts page-specific instances inside the swap region (runs `onUnMount` then
 * `onDestroy`, then their cleanup disposers + api unregister), removes them from state,
-* and emits `spa:component-unmount`. Persistent instances (outside the swap area) are
+* and emits `spa:island-unmount`. Persistent instances (outside the swap area) are
 * left in place.
 *
 * @param state - The plugin state holding live instances.
-* @param emit - The event emitter for spa:component-unmount.
+* @param emit - The event emitter for spa:island-unmount.
 * @example
 * unmountPageSpecific(state, emit);
 */
@@ -9745,7 +9839,7 @@ function unmountPageSpecific(state, emit) {
 		runHook(instance, "onDestroy");
 		disposeInstance(state, instance);
 		state.instances.delete(element);
-		emit("spa:component-unmount", {
+		emit("spa:island-unmount", {
 			name: instance.def.name,
 			el: element
 		});
@@ -9754,11 +9848,11 @@ function unmountPageSpecific(state, emit) {
 /**
 * Disposes ALL live instances (persistent and page-specific) on teardown: runs
 * `onUnMount` then `onDestroy`, then their cleanup disposers + api unregister, emits
-* `spa:component-unmount`, and clears the instance + api maps. Used by the kernel's
+* `spa:island-unmount`, and clears the instance + api maps. Used by the kernel's
 * `dispose` on plugin stop.
 *
 * @param state - The plugin state holding live instances.
-* @param emit - The event emitter for spa:component-unmount.
+* @param emit - The event emitter for spa:island-unmount.
 * @example
 * unmountAll(state, emit);
 */
@@ -9769,13 +9863,13 @@ function unmountAll(state, emit) {
 		runHook(instance, "onUnMount");
 		runHook(instance, "onDestroy");
 		disposeInstance(state, instance);
-		emit("spa:component-unmount", {
+		emit("spa:island-unmount", {
 			name: instance.def.name,
 			el: element
 		});
 	}
 	state.instances.clear();
-	state.componentApis.clear();
+	state.islandApis.clear();
 }
 /**
 * Fires `onNavStart` on every currently-mounted instance (persistent instances
@@ -9812,80 +9906,6 @@ function notifyNavEnd(state, route = EMPTY_ROUTE) {
 	}
 }
 //#endregion
-//#region src/plugins/spa/head.ts
-/** Single-element head selectors synced by replace/append/remove on navigation. */
-const META_SELECTORS = [
-	"meta[name=\"description\"]",
-	"meta[property=\"og:title\"]",
-	"meta[property=\"og:description\"]",
-	"meta[property=\"og:url\"]",
-	"meta[property=\"og:image\"]",
-	"meta[property=\"og:type\"]",
-	"meta[property=\"og:locale\"]",
-	"meta[name=\"twitter:card\"]",
-	"meta[name=\"twitter:title\"]",
-	"meta[name=\"twitter:description\"]",
-	"meta[name=\"twitter:image\"]",
-	"meta[name=\"twitter:site\"]",
-	"link[rel=\"canonical\"]"
-];
-/** Head element groups fully replaced (remove-all-then-clone) on navigation. */
-const REPLACE_ALL_SELECTORS = [
-	"script[type=\"application/ld+json\"]",
-	"link[rel=\"alternate\"][hreflang]",
-	"meta[property^=\"article:\"]"
-];
-/**
-* Sync a single head element by selector between the fetched and live document:
-* replace when both exist, append when only the new doc has it, remove when only
-* the live doc has it.
-*
-* @param selector - CSS selector for the head element to sync.
-* @param doc - The fetched document (DOMParser-parsed).
-* @example
-* syncElement('link[rel="canonical"]', doc);
-*/
-function syncElement(selector, doc) {
-	const newElement = doc.querySelector(selector);
-	const oldElement = document.querySelector(selector);
-	if (newElement && oldElement) oldElement.replaceWith(newElement.cloneNode(true));
-	else if (newElement) document.head.append(newElement.cloneNode(true));
-	else if (oldElement) oldElement.remove();
-}
-/**
-* Remove all live matches for a selector and re-clone the fetched document's
-* matches into the live `<head>`.
-*
-* @param selector - CSS selector for the element group to replace wholesale.
-* @param doc - The fetched document (DOMParser-parsed).
-* @example
-* replaceAllBySelector('script[type="application/ld+json"]', doc);
-*/
-function replaceAllBySelector(selector, doc) {
-	for (const element of document.querySelectorAll(selector)) element.remove();
-	for (const element of doc.querySelectorAll(selector)) document.head.append(element.cloneNode(true));
-}
-/**
-* Syncs the live document `<head>` after a navigation from the fetched document
-* (whose head was composed by the `head` plugin). Recomputes
-* title/meta/canonical/JSON-LD/hreflang/`<html lang>` once and applies them.
-* The `head` API is accepted to bind the structural dependency (spec/09 deps).
-*
-* @param _head - The head plugin API (dependency binding; composition reused via the fetched doc).
-* @param doc - The fetched document parsed from the navigated page's HTML.
-* @example
-* syncHead(headApi, parsedDoc);
-*/
-function syncHead(_head, doc) {
-	if (typeof document === "undefined") return;
-	const newTitle = doc.querySelector("title")?.textContent;
-	if (newTitle) document.title = newTitle;
-	const newLang = doc.documentElement.lang;
-	if (newLang) document.documentElement.lang = newLang;
-	for (const selector of META_SELECTORS) syncElement(selector, doc);
-	for (const selector of REPLACE_ALL_SELECTORS) replaceAllBySelector(selector, doc);
-}
-//#endregion
 //#region src/plugins/spa/progress.ts
 /** Delay before the bar appears, so fast navigations show no indicator. */
 const START_DELAY_MS = 150;
@@ -10292,7 +10312,7 @@ const defaultSpaConfig = {
 	swapSelector: "main > section",
 	viewTransitions: false,
 	progressBar: true,
-	components: []
+	islands: []
 };
 /**
 * Whether a selector is syntactically valid (parseable by the DOM). Falls back
@@ -10314,8 +10334,8 @@ function isValidSelector(selector) {
 }
 /**
 * Validates the spa config and applies defaults (Part-3 errors on an empty or
-* syntactically-invalid `swapSelector`). Component-hook validation runs later in
-* `createComponent` when the components are registered.
+* syntactically-invalid `swapSelector`). Island-hook validation runs later in
+* `createIsland` when the islands are registered.
 *
 * @param config - The raw spa config to validate.
 * @returns The fully-resolved config with defaults applied.
@@ -10331,7 +10351,7 @@ function resolveSpaConfig(config) {
 		swapSelector,
 		viewTransitions: config.viewTransitions ?? false,
 		progressBar: config.progressBar ?? true,
-		components: config.components ?? []
+		islands: config.islands ?? []
 	};
 }
 /**
@@ -10348,9 +10368,9 @@ function resolveSpaConfig(config) {
 */
 function createState(_ctx) {
 	return {
-		registeredComponents: /* @__PURE__ */ new Map(),
+		registeredIslands: /* @__PURE__ */ new Map(),
 		instances: /* @__PURE__ */ new Map(),
-		componentApis: /* @__PURE__ */ new Map(),
+		islandApis: /* @__PURE__ */ new Map(),
 		currentUrl: "",
 		destroyRouter: null,
 		started: false,
@@ -10370,15 +10390,15 @@ function createState(_ctx) {
 /** Error prefix for spa kernel failures (spec/11 Part-3). */
 const ERROR_PREFIX = "[web]";
 /**
-* Registers a component definition into state (last-registered-wins).
+* Registers a island definition into state (last-registered-wins).
 *
-* @param state - The plugin state holding registeredComponents.
-* @param component - The component definition to register.
+* @param state - The plugin state holding registeredIslands.
+* @param island - The island definition to register.
 * @example
-* registerComponent(state, counter);
+* registerIsland(state, counter);
 */
-function registerComponent(state, component) {
-	state.registeredComponents.set(component.name, component);
+function registerIsland(state, island) {
+	state.registeredIslands.set(island.name, island);
 }
 /**
 * Resolve the current document URL (pathname + search), or `""` when headless.
@@ -10453,15 +10473,15 @@ function createSpaKernel(state, config, emit, deps) {
 		});
 	};
 	/**
-	* Build the matched-route slice (params/meta/locale/url) for the component context at `path`,
+	* Build the matched-route slice (params/meta/locale/url) for the island context at `path`,
 	* so islands read their route's params/meta directly. An unmatched path yields an empty slice.
 	*
 	* @param path - The URL (pathname + search) to match.
 	* @returns The route slice for the matched route.
 	* @example
-	* scanAndMount(state, emit, resolved.swapSelector, componentRouteContext(pathname));
+	* scanAndMount(state, emit, resolved.swapSelector, islandRouteContext(pathname));
 	*/
-	const componentRouteContext = (path) => {
+	const islandRouteContext = (path) => {
 		const matchPath = path.split("?")[0] ?? path;
 		const hit = deps.router.match(matchPath);
 		const locale = hit?.params.lang ?? (typeof document === "undefined" ? "" : document.documentElement.lang) ?? "";
@@ -10490,7 +10510,7 @@ function createSpaKernel(state, config, emit, deps) {
 		syncHead(deps.head, doc);
 		unmountPageSpecific(state, emit);
 		if (!swapRegion(doc, resolved.swapSelector, resolved.viewTransitions, () => {
-			const routeSlice = componentRouteContext(pathname);
+			const routeSlice = islandRouteContext(pathname);
 			scanAndMount(state, emit, resolved.swapSelector, routeSlice);
 			notifyNavEnd(state, routeSlice);
 		}, applyPendingScroll)) {
@@ -10503,7 +10523,7 @@ function createSpaKernel(state, config, emit, deps) {
 		emit("spa:navigated", { url: pathname });
 	};
 	/**
-	* Begin a navigation: start progress, notify components, emit navigate.
+	* Begin a navigation: start progress, notify islands, emit navigate.
 	*
 	* @param pathname - The destination pathname.
 	* @example
@@ -10589,11 +10609,11 @@ function createSpaKernel(state, config, emit, deps) {
 	const commitDataRender = async (pathname, resolvedRender, signal) => {
 		if (signal?.aborted) return;
 		const { route, vnode, routeContext, region } = resolvedRender;
-		const { renderVNode } = await Promise.resolve().then(() => require("./render-KdufA3_b.cjs"));
+		const { renderVNode } = await Promise.resolve().then(() => require("./render-DHUcHCYs.cjs"));
 		if (signal?.aborted) return;
 		syncDataHead(deps.head, route, routeContext);
 		unmountPageSpecific(state, emit);
-		const routeSlice = componentRouteContext(pathname);
+		const routeSlice = islandRouteContext(pathname);
 		/**
 		* Render the VNode into the region and re-mount its islands in one paint — the
 		* swap body handed to `runSwap` (optionally wrapped in a View Transition).
@@ -10651,14 +10671,14 @@ function createSpaKernel(state, config, emit, deps) {
 	* await bootRender("/b/abc123");
 	*/
 	const bootRender = async (pathname) => {
-		const routeSlice = componentRouteContext(pathname);
+		const routeSlice = islandRouteContext(pathname);
 		const resolvedRender = await resolveDataRender(pathname);
 		if (resolvedRender === false) {
 			scanAndMount(state, emit, resolved.swapSelector, routeSlice);
 			return;
 		}
 		const { vnode, region } = resolvedRender;
-		const { renderVNode } = await Promise.resolve().then(() => require("./render-KdufA3_b.cjs"));
+		const { renderVNode } = await Promise.resolve().then(() => require("./render-DHUcHCYs.cjs"));
 		renderVNode(vnode, region);
 		scanAndMount(state, emit, resolved.swapSelector, routeSlice);
 	};
@@ -10686,13 +10706,13 @@ function createSpaKernel(state, config, emit, deps) {
 	};
 	return {
 		/**
-		* Register config components and seed currentUrl from the document.
+		* Register config islands and seed currentUrl from the document.
 		*
 		* @example
 		* kernel.init();
 		*/
 		init() {
-			for (const component of resolved.components) registerComponent(state, component);
+			for (const island of resolved.islands) registerIsland(state, island);
 			state.currentUrl = currentLocationUrl();
 		},
 		/**
@@ -10710,18 +10730,18 @@ function createSpaKernel(state, config, emit, deps) {
 			const matchPath = state.currentUrl.split("?")[0] ?? state.currentUrl;
 			const hit = deps.router.match(matchPath);
 			if (hit?.route._handlers.render && isClientOnlyRoute(deps.router.mode(), hit.route)) bootRender(state.currentUrl);
-			else scanAndMount(state, emit, resolved.swapSelector, componentRouteContext(state.currentUrl));
+			else scanAndMount(state, emit, resolved.swapSelector, islandRouteContext(state.currentUrl));
 			state.started = true;
 		},
 		/**
-		* Register a component definition (last-registered-wins).
+		* Register a island definition (last-registered-wins).
 		*
-		* @param component - The component definition to register.
+		* @param island - The island definition to register.
 		* @example
 		* kernel.register(counter);
 		*/
-		register(component) {
-			registerComponent(state, component);
+		register(island) {
+			registerIsland(state, island);
 		},
 		/**
 		* Process a navigation to `path` (fetch then swap; full reload on error).
@@ -10735,13 +10755,13 @@ function createSpaKernel(state, config, emit, deps) {
 			navigate(path).catch(() => {});
 		},
 		/**
-		* Scan the swap region and mount components for matching elements.
+		* Scan the swap region and mount islands for matching elements.
 		*
 		* @example
 		* kernel.scan();
 		*/
 		scan() {
-			scanAndMount(state, emit, resolved.swapSelector, componentRouteContext(state.currentUrl));
+			scanAndMount(state, emit, resolved.swapSelector, islandRouteContext(state.currentUrl));
 		},
 		/**
 		* Tear down router listeners, dispose all instances, reset boot state.
@@ -10760,7 +10780,7 @@ function createSpaKernel(state, config, emit, deps) {
 }
 /**
 * Builds the shared kernel from the plugin context, stores it on `ctx.state`,
-* and runs its init step (validate config, register config.components, seed
+* and runs its init step (validate config, register config.islands, seed
 * currentUrl). Captures the OPTIONAL `data` reader when the `data` plugin is
 * composed (enabling client DATA navigation) — resolved by instance via
 * `ctx.require(dataPlugin)`, guarded by `ctx.has("data")` so `data` stays optional
@@ -10828,10 +10848,10 @@ function disposeSpa() {
 /**
 * @file `lazyEmbed` island — activates the static embed facades emitted by the
 * content pipeline's `::embed` directive (pipeline/embed.ts). Mounts on every
-* `[data-component="lazy-embed"]` figure; a click on the facade's button swaps
+* `[data-island="lazy-embed"]` figure; a click on the facade's button swaps
 * it for the real `<iframe loading="lazy">`. Until that click the embedded
 * document costs the page nothing — no request, no third-party JS, no
-* scroll-jacking. Register it in `pluginConfigs.spa.components`; all visual
+* scroll-jacking. Register it in `pluginConfigs.spa.islands`; all visual
 * chrome (`.lazy-embed*` classes) is consumer CSS.
 */
 /** CSS class on the injected `<iframe>` (consumer CSS sizes it). */
@@ -10884,7 +10904,7 @@ function onFacadeClick(event) {
 * Lazy-embed island: facade button click → real `<iframe loading="lazy">`.
 * The companion of the content pipeline's `::embed` directive.
 */
-const lazyEmbed = createComponent("lazy-embed", {
+const lazyEmbed = createIsland("lazy-embed", {
 	/**
 	* Bind the activation click handler when a facade mounts.
 	*
@@ -10910,18 +10930,18 @@ const lazyEmbed = createComponent("lazy-embed", {
 //#region src/plugins/spa/index.ts
 /**
 * @file spa — Complex Plugin (WIRING ONLY, ≤30 lines). All logic lives in the
-* domain files (kernel/router/head/progress/components/lifecycle); index wires.
+* domain files (kernel/router/head/progress/islands/lifecycle); index wires.
 *
 * Depends: router, head.
-* Emits: spa:navigate, spa:navigated, spa:component-mount, spa:component-unmount.
+* Emits: spa:navigate, spa:navigated, spa:island-mount, spa:island-unmount.
 * @see README.md
 */
 /**
 * SPA plugin — progressive client-side navigation layered over the static site:
 * swaps a page region on navigation, with an optional progress bar and View
-* Transitions. Register interactive islands with {@link createComponent}. Depends
-* on router and head; emits `spa:navigate`, `spa:navigated`, `spa:component-mount`,
-* and `spa:component-unmount`.
+* Transitions. Register interactive islands with {@link createIsland}. Depends
+* on router and head; emits `spa:navigate`, `spa:navigated`, `spa:island-mount`,
+* and `spa:island-unmount`.
 *
 * @example Enable view transitions and a custom swap region
 * ```ts
@@ -11904,8 +11924,8 @@ function EmbedFacadeButton(props) {
 //#region src/plugins/content/pipeline/embed.ts
 /** CSS class on the `<figure>` facade wrapping each embed. */
 const EMBED_FIGURE_CLASS = "lazy-embed";
-/** `data-component` name binding the facade to the `lazyEmbed` SPA island. */
-const EMBED_COMPONENT_NAME = "lazy-embed";
+/** `data-island` name binding the facade to the `lazyEmbed` SPA island. */
+const EMBED_ISLAND_NAME = "lazy-embed";
 /**
 * Type guard for an `::embed` leaf directive.
 *
@@ -12015,7 +12035,7 @@ function collectAttributes$1(attributes) {
 * ```
 */
 function embedFacadeHtml(facade, props, dimensions) {
-	return `<figure class="${EMBED_FIGURE_CLASS}" data-component="${EMBED_COMPONENT_NAME}" data-embed-src="${escapeAttribute(props.src)}" data-embed-title="${escapeAttribute(props.title)}"${dimensions ? ` data-embed-width="${dimensions.width}" data-embed-height="${dimensions.height}" style="aspect-ratio: ${dimensions.width} / ${dimensions.height}; max-width: ${dimensions.width}px;"` : ""}>${(0, preact_render_to_string.renderToString)((0, preact.h)(facade, props))}</figure>`;
+	return `<figure class="${EMBED_FIGURE_CLASS}" data-island="${EMBED_ISLAND_NAME}" data-embed-src="${escapeAttribute(props.src)}" data-embed-title="${escapeAttribute(props.title)}"${dimensions ? ` data-embed-width="${dimensions.width}" data-embed-height="${dimensions.height}" style="aspect-ratio: ${dimensions.width} / ${dimensions.height}; max-width: ${dimensions.width}px;"` : ""}>${(0, preact_render_to_string.renderToString)((0, preact.h)(facade, props))}</figure>`;
 }
 /**
 * Normalize the provider's `embed` config value (`boolean | options`) to a plain
@@ -12128,7 +12148,7 @@ function GalleryTrack(props) {
 *
 * Rewrites `::gallery{src="./images/dir/" caption="…"}` leaf directives into a
 * static swipeable image set at the mdast stage (BEFORE the remark-rehype bridge):
-* a framework-owned `<div class="gallery" data-component="gallery">` carrying the
+* a framework-owned `<div class="gallery" data-island="gallery">` carrying the
 * island hook, wrapping inner content rendered (at build time, to static markup)
 * by a Preact component — the built-in {@link GalleryTrack} by default, or a
 * consumer component via `gallery.component`.
@@ -12140,12 +12160,12 @@ function GalleryTrack(props) {
 * transform reads `<contentDir>/<slug>/<src>` from disk, sorts its images, and
 * resolves each to its shared `/<slug>/<dir>/<file>` URL (identical from every
 * locale page, mirroring co-located images). The companion gallery SPA island
-* (consumer-provided) wires swipe/keyboard/lightbox on `[data-component="gallery"]`.
+* (consumer-provided) wires swipe/keyboard/lightbox on `[data-island="gallery"]`.
 */
 /** CSS class on the `<div>` wrapping each gallery. */
 const GALLERY_WRAPPER_CLASS = "gallery";
-/** `data-component` name binding the gallery to its SPA island. */
-const GALLERY_COMPONENT_NAME = "gallery";
+/** `data-island` name binding the gallery to its SPA island. */
+const GALLERY_ISLAND_NAME = "gallery";
 /** Image file extensions a gallery folder expands over. */
 const IMAGE_EXTENSIONS = new Set([
 	".webp",
@@ -12238,7 +12258,7 @@ function collectAttributes(attributes) {
 }
 /**
 * Build the static gallery HTML for one directive: the framework-owned `<div>`
-* (island hook in `data-component`) wrapping the component's inner content, SSR'd
+* (island hook in `data-island`) wrapping the component's inner content, SSR'd
 * to static markup.
 *
 * @param component - The gallery component (default {@link GalleryTrack}).
@@ -12252,7 +12272,7 @@ function collectAttributes(attributes) {
 * ```
 */
 function galleryHtml(component, slides, caption, attributes) {
-	return `<div class="${GALLERY_WRAPPER_CLASS}" data-component="${GALLERY_COMPONENT_NAME}">${(0, preact_render_to_string.renderToString)((0, preact.h)(component, {
+	return `<div class="${GALLERY_WRAPPER_CLASS}" data-island="${GALLERY_ISLAND_NAME}">${(0, preact_render_to_string.renderToString)((0, preact.h)(component, {
 		slides,
 		caption,
 		attributes
@@ -13237,7 +13257,7 @@ Object.defineProperty(exports, "cloudflareBindings", {
 });
 exports.contentPlugin = contentPlugin;
 exports.createApp = createApp;
-exports.createComponent = createComponent;
+exports.createIsland = createIsland;
 exports.createPlugin = createPlugin;
 exports.createUrls = createUrls;
 exports.dataPlugin = dataPlugin;