npm - @moku-labs/web - Versions diffs - 1.17.0 → 2.0.1 - Mend

@moku-labs/web 1.17.0 → 2.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (12) hide show

package/README.md +1 -1
package/dist/browser.d.mts +111 -108
package/dist/browser.mjs +189 -189
package/dist/index.cjs +198 -198
package/dist/index.d.cts +111 -108
package/dist/index.d.mts +111 -108
package/dist/index.mjs +198 -198
package/dist/{render-KdufA3_b.cjs → render-DHUcHCYs.cjs} +4 -4
package/dist/{render-UO4nimWr.mjs → render-yXHc9BWI.mjs} +4 -4
package/dist/testing.d.mts +59 -56
package/dist/testing.mjs +50 -50
package/package.json +3 -3

package/dist/index.cjs CHANGED Viewed

@@ -9147,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).
@@ -9181,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);
 		}
 	};
 }
@@ -9206,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",
@@ -9223,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
@@ -9234,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",
@@ -9274,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.
@@ -9282,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;
 }
 /**
@@ -9291,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 }));
 */
@@ -9313,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.
@@ -9324,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));
@@ -9350,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
@@ -9459,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);
 		}
 	};
 }
@@ -9489,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.
 *
@@ -9506,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,
@@ -9529,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 = {};
@@ -9661,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,
@@ -9710,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");
@@ -9721,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);
@@ -9743,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);
 */
@@ -9765,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
 		});
@@ -9774,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);
 */
@@ -9789,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
@@ -9832,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;
@@ -10312,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
@@ -10334,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.
@@ -10351,7 +10351,7 @@ function resolveSpaConfig(config) {
 		swapSelector,
 		viewTransitions: config.viewTransitions ?? false,
 		progressBar: config.progressBar ?? true,
-		components: config.components ?? []
+		islands: config.islands ?? []
 	};
 }
 /**
@@ -10368,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,
@@ -10390,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.
@@ -10473,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) ?? "";
@@ -10510,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)) {
@@ -10523,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
@@ -10609,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).
@@ -10671,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);
 	};
@@ -10706,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();
 		},
 		/**
@@ -10730,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).
@@ -10755,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.
@@ -10780,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
@@ -10848,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). */
@@ -10904,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.
 	*
@@ -10930,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
@@ -11924,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.
 *
@@ -12035,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
@@ -12148,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`.
@@ -12160,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",
@@ -12258,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}).
@@ -12272,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
@@ -13257,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;