vinojs 0.0.1 → 0.1.0

package/README.md

@@ -0,0 +1,172 @@
+# Vino
+
+Hono + Vite meta-framework designed for Cloudflare Workers.
+
+Early WIP - core changes will happen
+
+- **Pages** — filesystem routes in `src/pages` using Nitro path syntax
+- **Layouts** — `src/layout` files wrap matching routes
+- **Server** — your Hono app; Vino mounts pages onto it
+- **SSR** — `hono/jsx`
+- **Hydration** — `definePage` for a whole page, `src/components/` for widgets (`hono/jsx/dom`)
+- **SSG** — prerender static routes (and dynamic routes with `ssgParams`) at build time; `partial` writes layout shells, `full` writes complete HTML
+- **Dev / deploy** — `@cloudflare/vite-plugin`
+
+## Install
+
+```bash
+pnpm add vinojs hono
+pnpm add -D vite @cloudflare/vite-plugin wrangler
+```
+
+## Quick start
+
+`src/server.ts` — you own the Hono app; extra routes stay on it:
+
+```ts
+import { Hono } from "hono";
+import { createVino, mountVino } from "vinojs";
+import { api } from "./api";
+
+const app = new Hono().route("/api", api);
+mountVino(app);
+export default app;
+export type AppType = typeof app;
+```
+
+`vite.config.ts`:
+
+```ts
+import { defineConfig } from "vite";
+import { cloudflare } from "@cloudflare/vite-plugin";
+import { vino } from "vinojs/vite";
+
+export default defineConfig({
+  plugins: [vino(), cloudflare({ viteEnvironment: { name: "ssr" } })],
+});
+```
+
+`wrangler.jsonc`:
+
+```jsonc
+{
+  "name": "my-app",
+  "main": "./src/server.ts",
+  "compatibility_date": "2026-08-18",
+}
+```
+
+## Routing (`src/pages`)
+
+| File                   | URL           |
+| ---------------------- | ------------- |
+| `index.tsx`            | `/`           |
+| `about.tsx`            | `/about`      |
+| `(marketing)/jobs.tsx` | `/jobs`       |
+| `blog/[slug].tsx`      | `/blog/:slug` |
+| `docs/[...slug].tsx`   | `/docs/*`     |
+
+The file **is** the page. Export a default component, `definePage(...)`, `defineServerPage(...)`, a Hono sub-app, or named `GET` / `POST` handlers.
+
+```tsx
+import { definePage } from "vinojs";
+import { useState } from "hono/jsx";
+
+export default definePage(() => {
+  const [n, setN] = useState(0);
+  return <button onClick={() => setN(n + 1)}>{n}</button>;
+});
+```
+
+```tsx
+import { definePage } from "vinojs";
+
+export default definePage({
+  render: ({ data }) => <h1>{data.title}</h1>,
+  data: async (c) => ({ title: "Hello" }),
+  config: { prerender: "full", clientRouting: true },
+});
+```
+
+`definePage` SSRs with `hono/jsx`, then hydrates `#vino-page` with `hono/jsx/dom`. `data` and `config` are colocated on the page.
+
+Colocate loaders in `*.server.ts` and pass them through `defineServerFn`. The result is a `data` loader today; the same wrapper is how server functions will be called later (no `'use server'`).
+
+```ts
+// [slug].server.ts
+import { defineServerFn } from "vinojs";
+
+export default defineServerFn((c) => {
+  const slug = c.req.param("slug") ?? "";
+  return { slug, title: "Hello" };
+});
+```
+
+```tsx
+// [slug].tsx
+import { definePage } from "vinojs";
+import data from "./[slug].server";
+
+export default definePage({
+  data,
+  render: ({ data }) => <h1>{data.title}</h1>,
+});
+```
+
+`*.server.ts` files are not routes. Client bundles get stubs instead of the implementation.
+
+Use `defineServerPage` for HTML that is never hydrated:
+
+```tsx
+import { defineServerPage } from "vinojs";
+
+export default defineServerPage(() => <h1>About</h1>);
+```
+
+`prerender` may be `'full'` (complete HTML at build), `'partial'` (layout shell + empty `#vino-page`; client fetches content), or `false`.
+
+### Layouts (`src/layout`)
+
+Layout files are compiled with the same path syntax as pages and wrap matching routes (root → leaf). `index.tsx` is the HTML document.
+
+| File        | Wraps                 |
+| ----------- | --------------------- |
+| `index.tsx` | every page            |
+| `blog.tsx`  | `/blog` and `/blog/*` |
+| `admin.tsx` | `/admin`              |
+
+### Hydratable pages
+
+`definePage(...)` SSRs with `hono/jsx`, then hydrates `#vino-page` with `hono/jsx/dom`. `defineServerPage(...)` SSRs only.
+
+### Hydratable components
+
+Put widgets in `src/components/` (or name `$Widget.tsx` / `Widget.component.tsx`). They SSR as `<vino-component>` and hydrate on the client. Pass JSON-serializable props only.
+
+### Navigation
+
+`clientRouting: true` in `definePage({ config })` or `vino({ clientRouting: true })` intercepts same-origin links, fetches page content only (`X-Vino-Nav`), swaps `#vino-page`, and rehydrates. Layout stays mounted. Default is on via the Vite plugin.
+
+## API
+
+- `createVino()` — `vinojs`
+- `mountVino(app)` — `vinojs`
+- `definePage(fn | { render, data?, config? })` — hydrate the page (`vinojs`)
+- `defineServerPage(...)` — SSR only, never hydrate (`vinojs`)
+- `defineServerFn(fn)` — server-only function; pass as `definePage({ data })` (`vinojs`)
+- `createClient()` — `vinojs/client` (injected automatically)
+- `vino({ pagesDir, layoutsDir, clientRouting, prerender })` — `vinojs/vite`
+
+APIs stay on your Hono app. Use `hono/client` `hc` against those routes; page HTML is never fetched through `hc`.
+
+## Example
+
+```bash
+pnpm install
+pnpm build
+pnpm --filter @vinojs/example-basic dev
+```
+
+## License
+
+MIT

package/dist/client.d.mts

@@ -0,0 +1,41 @@
+import { u as VinoPayload } from "./types-CQITdkpF.mjs";
+//#region src/client/create-client.d.ts
+interface CreateClientOptions {
+  hydrate?: (vnode: unknown, el: Element) => void | Promise<void>;
+  createElement?: (type: unknown, props: unknown) => unknown;
+}
+type ComponentLoaders = Record<string, () => Promise<Record<string, unknown>>>;
+type ClientPageLoaders = Record<string, () => Promise<{
+  default?: unknown;
+}>>;
+type VinoHmrPayload = {
+  kind: "component";
+  id: string;
+  mod?: Record<string, unknown>;
+} | {
+  kind: "client-page";
+  id: string;
+  mod?: {
+    default?: unknown;
+  };
+} | {
+  kind: "ssr";
+} | {
+  kind: "layout";
+} | {
+  kind: "registry";
+  components?: ComponentLoaders;
+  clientPages?: ClientPageLoaders;
+};
+type HmrFn = (payload: VinoHmrPayload) => void;
+/**
+ * Fill partial shells, hydrate `#vino-page` / `<vino-component>`, and intercept
+ * same-origin links with content-only swaps when `clientRouting` is enabled.
+ */
+declare function createClient(options?: CreateClientOptions): {
+  ready: Promise<VinoPayload | null>;
+  hmr: HmrFn;
+};
+//#endregion
+export { type CreateClientOptions, type VinoHmrPayload, createClient };
+//# sourceMappingURL=client.d.mts.map

package/dist/client.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.mts","names":[],"sources":["../src/client/create-client.ts"],"mappings":";;UAIiB;EACf,WAAW,gBAAgB,IAAI,mBAAmB;EAClD,iBAAiB,eAAe;;KAG7B,mBAAmB,qBAAqB,QAAQ;KAChD,oBAAoB,qBAAqB;EAAU;;KAc5C;EACN;EAAmB;EAAY,MAAM;;EACrC;EAAqB;EAAY;IAAQ;;;EACzC;;EACA;;EACA;EAAkB,aAAa;EAAkB,cAAc;;KAEhE,SAAS,SAAS;;;;;iBAgVP,aAAa,UAAS"}

package/dist/client.mjs

@@ -0,0 +1,287 @@
+import { c as PAGE_SLOT_ID, l as PAYLOAD_SCRIPT_ID, o as NAV_HEADER, t as COMPONENT_TAG } from "./constants-BVT2bJEd.mjs";
+import { s as resolvePageRender } from "./definePage-Ba4r-TFh.mjs";
+//#region src/client/create-client.ts
+const islands = /* @__PURE__ */ new Map();
+let pageRoot = null;
+let componentLoaders;
+let clientPageLoaders;
+let hmrListener;
+const hmrPending = [];
+const hmrGlobal = globalThis;
+function dispatchHmr(payload) {
+	if (hmrListener) hmrListener(payload);
+	else hmrPending.push(payload);
+}
+hmrGlobal.__VINO_HMR__ = dispatchHmr;
+function bindHmr(fn) {
+	hmrListener = fn;
+	const queued = hmrPending.splice(0);
+	for (const payload of queued) fn(payload);
+}
+function pruneDisconnected() {
+	for (const [el, rec] of islands) {
+		if (el.isConnected) continue;
+		rec.root?.unmount();
+		islands.delete(el);
+	}
+	if (pageRoot && !pageRoot.el.isConnected) {
+		pageRoot.root?.unmount();
+		pageRoot = null;
+	}
+}
+function readPayload(root = document) {
+	const el = root.querySelector(`#${PAYLOAD_SCRIPT_ID}`);
+	if (!el?.textContent) return null;
+	try {
+		return JSON.parse(el.textContent);
+	} catch {
+		return null;
+	}
+}
+function writePayload(payload) {
+	let el = document.getElementById(PAYLOAD_SCRIPT_ID);
+	if (!el) {
+		el = document.createElement("script");
+		el.id = PAYLOAD_SCRIPT_ID;
+		el.type = "application/json";
+		document.body.appendChild(el);
+	}
+	el.textContent = JSON.stringify(payload).replaceAll("<", "\\u003c");
+}
+async function loadDom() {
+	const [{ hydrateRoot }, { createElement }] = await Promise.all([import("hono/jsx/dom/client"), import("hono/jsx/dom")]);
+	return {
+		hydrateRoot,
+		createElement
+	};
+}
+async function getComponentLoaders() {
+	componentLoaders ??= (await import("virtual:vino/components")).components;
+	return componentLoaders;
+}
+async function getClientPageLoaders() {
+	clientPageLoaders ??= (await import("virtual:vino/client-pages")).clientPages;
+	return clientPageLoaders;
+}
+function vnodeFor(options, createElement, type, props) {
+	return options.createElement ? options.createElement(type, props) : createElement(type, props);
+}
+async function mountVnode(options, el, vnode, existing) {
+	if (existing) {
+		existing.render(vnode);
+		return existing;
+	}
+	if (options.hydrate) {
+		await options.hydrate(vnode, el);
+		return null;
+	}
+	const { hydrateRoot } = await loadDom();
+	return hydrateRoot(el, vnode);
+}
+async function hydrateComponents(options, root = document) {
+	const components = await getComponentLoaders();
+	const { createElement } = await loadDom();
+	const nodes = root.querySelectorAll(COMPONENT_TAG);
+	for (const el of nodes) {
+		const id = el.getAttribute("data-component");
+		const exportName = el.getAttribute("data-export") ?? "default";
+		const propsJson = el.getAttribute("data-props") ?? "{}";
+		if (!id) continue;
+		const loader = components[id];
+		if (!loader) {
+			console.warn(`[vino] missing hydratable component ${id}`);
+			continue;
+		}
+		const Component = (await loader())[exportName];
+		if (typeof Component !== "function") continue;
+		const props = JSON.parse(propsJson);
+		const vnode = vnodeFor(options, createElement, Component, props);
+		const previous = islands.get(el);
+		if (previous?.root) previous.root.unmount();
+		const mounted = await mountVnode(options, el, vnode, null);
+		islands.set(el, {
+			id,
+			exportName,
+			props,
+			root: mounted
+		});
+	}
+}
+async function hydrateClientPage(payload, options) {
+	if (!payload.clientPage) return;
+	const root = document.getElementById(PAGE_SLOT_ID);
+	if (!root) return;
+	const load = (await getClientPageLoaders())[payload.clientPage];
+	if (!load) return;
+	const mod = await load();
+	await renderClientPage(payload.clientPage, mod, payload, options, root);
+}
+async function renderClientPage(path, mod, payload, options, root) {
+	const Page = resolvePageRender(mod.default);
+	if (!Page) return;
+	const { createElement } = await loadDom();
+	const vnode = vnodeFor(options, createElement, Page, {
+		data: payload.data,
+		params: payload.params
+	});
+	const reuse = pageRoot?.el === root ? pageRoot.root : null;
+	if (pageRoot && pageRoot.el !== root) pageRoot.root?.unmount();
+	pageRoot = {
+		el: root,
+		path,
+		root: await mountVnode(options, root, vnode, reuse)
+	};
+}
+async function patchComponent(id, mod, options) {
+	const { createElement } = await loadDom();
+	for (const [el, rec] of islands) {
+		if (rec.id !== id) continue;
+		if (!el.isConnected) {
+			rec.root?.unmount();
+			islands.delete(el);
+			continue;
+		}
+		const Component = mod[rec.exportName];
+		if (typeof Component !== "function") continue;
+		rec.root = await mountVnode(options, el, vnodeFor(options, createElement, Component, rec.props), rec.root);
+	}
+}
+async function patchClientPage(path, mod, options) {
+	const payload = readPayload();
+	if (!payload?.clientPage || payload.clientPage !== path) return;
+	const root = document.getElementById(PAGE_SLOT_ID);
+	if (!root) return;
+	await renderClientPage(path, mod, payload, options, root);
+}
+function syncNav(path) {
+	const links = document.querySelectorAll("nav a[href]");
+	for (const link of links) {
+		if (!(link instanceof HTMLAnchorElement)) continue;
+		const href = link.getAttribute("href");
+		if (!href || href.startsWith("http")) continue;
+		if (href === path || href !== "/" && (path === href || path.startsWith(`${href}/`))) link.setAttribute("aria-current", "page");
+		else link.removeAttribute("aria-current");
+	}
+}
+async function hydrateSlot(options, payload) {
+	pruneDisconnected();
+	if (payload) await hydrateClientPage(payload, options);
+	await hydrateComponents(options, document.getElementById("vino-page") ?? document);
+	if (payload?.path) syncNav(payload.path);
+	return payload;
+}
+function parseContentFragment(html) {
+	const doc = new DOMParser().parseFromString(`<!DOCTYPE html><html><body>${html}</body></html>`, "text/html");
+	const payload = readPayload(doc);
+	return {
+		slot: doc.getElementById(PAGE_SLOT_ID),
+		payload,
+		title: payload?.title
+	};
+}
+async function fetchContent(href) {
+	const url = new URL(href, location.href);
+	return parseContentFragment(await (await fetch(url.href, { headers: { [NAV_HEADER]: "1" } })).text());
+}
+async function applyContent(href, push, options, fragment) {
+	const { slot: nextSlot, payload: nextPayload, title } = fragment;
+	if (nextPayload?.clientRouting === false && push) {
+		location.href = href;
+		return nextPayload;
+	}
+	const current = document.getElementById(PAGE_SLOT_ID);
+	if (current && nextSlot) current.replaceWith(nextSlot);
+	else if (nextSlot) document.body.appendChild(nextSlot);
+	if (nextPayload) writePayload(nextPayload);
+	if (title) document.title = title;
+	else if (nextPayload?.title) document.title = nextPayload.title;
+	const url = new URL(href, location.href);
+	if (push) history.pushState({ vino: true }, "", url.href);
+	return hydrateSlot(options, nextPayload ?? readPayload());
+}
+async function navigate(href, push, options) {
+	return applyContent(href, push, options, await fetchContent(href));
+}
+async function fillPartialShell(options, payload) {
+	if (!payload?.partial) return payload;
+	const slot = document.getElementById(PAGE_SLOT_ID);
+	if (!slot) return payload;
+	if (slot.childNodes.length > 0) return hydrateSlot(options, {
+		...payload,
+		partial: false
+	});
+	const fragment = await fetchContent(location.href);
+	return applyContent(location.href, false, options, fragment);
+}
+function bindRouting(options, payload) {
+	if (!payload?.clientRouting) return;
+	document.addEventListener("click", (event) => {
+		const target = event.target;
+		if (!(target instanceof Element)) return;
+		const anchor = target.closest("a");
+		if (!anchor || !shouldIntercept(anchor) || isModifiedClick(event)) return;
+		if (!document.getElementById("vino-page")) return;
+		event.preventDefault();
+		navigate(anchor.href, true, options);
+	});
+	window.addEventListener("popstate", () => {
+		navigate(location.href, false, options);
+	});
+}
+function isModifiedClick(event) {
+	return event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0;
+}
+function shouldIntercept(anchor) {
+	if (anchor.hasAttribute("download") || anchor.target && anchor.target !== "_self") return false;
+	if (anchor.origin !== location.origin) return false;
+	if (anchor.getAttribute("rel")?.includes("external")) return false;
+	return true;
+}
+async function handleHmr(payload, options) {
+	if (payload.kind === "registry") {
+		if (payload.components) componentLoaders = payload.components;
+		if (payload.clientPages) clientPageLoaders = payload.clientPages;
+		return;
+	}
+	if (payload.kind === "layout") {
+		location.reload();
+		return;
+	}
+	if (payload.kind === "ssr") {
+		if (!document.getElementById("vino-page")) {
+			location.reload();
+			return;
+		}
+		await navigate(location.href, false, options);
+		return;
+	}
+	if (payload.kind === "component" && payload.mod) {
+		await patchComponent(payload.id, payload.mod, options);
+		return;
+	}
+	if (payload.kind === "client-page" && payload.mod) await patchClientPage(payload.id, payload.mod, options);
+}
+/**
+* Fill partial shells, hydrate `#vino-page` / `<vino-component>`, and intercept
+* same-origin links with content-only swaps when `clientRouting` is enabled.
+*/
+function createClient(options = {}) {
+	const hmr = (payload) => {
+		handleHmr(payload, options);
+	};
+	bindHmr(hmr);
+	return {
+		ready: (async () => {
+			let payload = readPayload();
+			if (payload?.partial) payload = await fillPartialShell(options, payload) ?? payload;
+			else payload = await hydrateSlot(options, payload) ?? payload;
+			bindRouting(options, payload);
+			return payload;
+		})(),
+		hmr
+	};
+}
+//#endregion
+export { createClient };
+
+//# sourceMappingURL=client.mjs.map

package/dist/client.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.mjs","names":[],"sources":["../src/client/create-client.ts"],"sourcesContent":["import { COMPONENT_TAG, NAV_HEADER, PAGE_SLOT_ID, PAYLOAD_SCRIPT_ID } from \"../vino/constants.ts\";\nimport { resolvePageRender } from \"../vino/definePage.ts\";\nimport type { VinoPayload } from \"../vino/types.ts\";\n\nexport interface CreateClientOptions {\n  hydrate?: (vnode: unknown, el: Element) => void | Promise<void>;\n  createElement?: (type: unknown, props: unknown) => unknown;\n}\n\ntype ComponentLoaders = Record<string, () => Promise<Record<string, unknown>>>;\ntype ClientPageLoaders = Record<string, () => Promise<{ default?: unknown }>>;\n\ninterface DomRoot {\n  render: (vnode: unknown) => void;\n  unmount: () => void;\n}\n\ninterface IslandRecord {\n  id: string;\n  exportName: string;\n  props: Record<string, unknown>;\n  root: DomRoot | null;\n}\n\nexport type VinoHmrPayload =\n  | { kind: \"component\"; id: string; mod?: Record<string, unknown> }\n  | { kind: \"client-page\"; id: string; mod?: { default?: unknown } }\n  | { kind: \"ssr\" }\n  | { kind: \"layout\" }\n  | { kind: \"registry\"; components?: ComponentLoaders; clientPages?: ClientPageLoaders };\n\ntype HmrFn = (payload: VinoHmrPayload) => void;\n\nconst islands = new Map<Element, IslandRecord>();\nlet pageRoot: { el: Element; path: string; root: DomRoot | null } | null = null;\nlet componentLoaders: ComponentLoaders | undefined;\nlet clientPageLoaders: ClientPageLoaders | undefined;\nlet hmrListener: HmrFn | undefined;\nconst hmrPending: VinoHmrPayload[] = [];\n\nconst hmrGlobal = globalThis as typeof globalThis & { __VINO_HMR__?: HmrFn };\n\nfunction dispatchHmr(payload: VinoHmrPayload) {\n  if (hmrListener) hmrListener(payload);\n  else hmrPending.push(payload);\n}\n\nhmrGlobal.__VINO_HMR__ = dispatchHmr;\n\nfunction bindHmr(fn: HmrFn) {\n  hmrListener = fn;\n  const queued = hmrPending.splice(0);\n  for (const payload of queued) fn(payload);\n}\n\nfunction pruneDisconnected() {\n  for (const [el, rec] of islands) {\n    if (el.isConnected) continue;\n    rec.root?.unmount();\n    islands.delete(el);\n  }\n  if (pageRoot && !pageRoot.el.isConnected) {\n    pageRoot.root?.unmount();\n    pageRoot = null;\n  }\n}\n\nfunction readPayload(root: ParentNode = document): VinoPayload | null {\n  const el = root.querySelector(`#${PAYLOAD_SCRIPT_ID}`);\n  if (!el?.textContent) return null;\n  try {\n    return JSON.parse(el.textContent) as VinoPayload;\n  } catch {\n    return null;\n  }\n}\n\nfunction writePayload(payload: VinoPayload) {\n  let el = document.getElementById(PAYLOAD_SCRIPT_ID) as HTMLScriptElement | null;\n  if (!el) {\n    el = document.createElement(\"script\");\n    el.id = PAYLOAD_SCRIPT_ID;\n    el.type = \"application/json\";\n    document.body.appendChild(el);\n  }\n  el.textContent = JSON.stringify(payload).replaceAll(\"<\", \"\\\\u003c\");\n}\n\nasync function loadDom() {\n  const [{ hydrateRoot }, { createElement }] = await Promise.all([\n    import(\"hono/jsx/dom/client\"),\n    import(\"hono/jsx/dom\"),\n  ]);\n  return { hydrateRoot, createElement };\n}\n\nasync function getComponentLoaders(): Promise<ComponentLoaders> {\n  componentLoaders ??= (await import(\"virtual:vino/components\")).components;\n  return componentLoaders;\n}\n\nasync function getClientPageLoaders(): Promise<ClientPageLoaders> {\n  clientPageLoaders ??= (await import(\"virtual:vino/client-pages\")).clientPages;\n  return clientPageLoaders;\n}\n\nfunction vnodeFor(\n  options: CreateClientOptions,\n  createElement: (type: never, props: never) => unknown,\n  type: unknown,\n  props: unknown,\n) {\n  return options.createElement\n    ? options.createElement(type, props)\n    : createElement(type as never, props as never);\n}\n\nasync function mountVnode(\n  options: CreateClientOptions,\n  el: Element,\n  vnode: unknown,\n  existing: DomRoot | null,\n): Promise<DomRoot | null> {\n  if (existing) {\n    existing.render(vnode);\n    return existing;\n  }\n  if (options.hydrate) {\n    await options.hydrate(vnode, el);\n    return null;\n  }\n  const { hydrateRoot } = await loadDom();\n  return hydrateRoot(el as HTMLElement, vnode as never) as DomRoot;\n}\n\nasync function hydrateComponents(options: CreateClientOptions, root: ParentNode = document) {\n  const components = await getComponentLoaders();\n  const { createElement } = await loadDom();\n  const nodes = root.querySelectorAll(COMPONENT_TAG);\n  for (const el of nodes) {\n    const id = el.getAttribute(\"data-component\");\n    const exportName = el.getAttribute(\"data-export\") ?? \"default\";\n    const propsJson = el.getAttribute(\"data-props\") ?? \"{}\";\n    if (!id) continue;\n    const loader = components[id];\n    if (!loader) {\n      console.warn(`[vino] missing hydratable component ${id}`);\n      continue;\n    }\n    const mod = await loader();\n    const Component = mod[exportName];\n    if (typeof Component !== \"function\") continue;\n    const props = JSON.parse(propsJson) as Record<string, unknown>;\n    const vnode = vnodeFor(options, createElement, Component, props);\n    const previous = islands.get(el);\n    if (previous?.root) previous.root.unmount();\n    const mounted = await mountVnode(options, el, vnode, null);\n    islands.set(el, { id, exportName, props, root: mounted });\n  }\n}\n\nasync function hydrateClientPage(payload: VinoPayload, options: CreateClientOptions) {\n  if (!payload.clientPage) return;\n  const root = document.getElementById(PAGE_SLOT_ID);\n  if (!root) return;\n  const clientPages = await getClientPageLoaders();\n  const load = clientPages[payload.clientPage];\n  if (!load) return;\n  const mod = await load();\n  await renderClientPage(payload.clientPage, mod, payload, options, root);\n}\n\nasync function renderClientPage(\n  path: string,\n  mod: { default?: unknown },\n  payload: VinoPayload,\n  options: CreateClientOptions,\n  root: Element,\n) {\n  const Page = resolvePageRender(mod.default);\n  if (!Page) return;\n  const { createElement } = await loadDom();\n  const props = { data: payload.data, params: payload.params };\n  const vnode = vnodeFor(options, createElement, Page, props);\n  const reuse = pageRoot?.el === root ? pageRoot.root : null;\n  if (pageRoot && pageRoot.el !== root) pageRoot.root?.unmount();\n  const mounted = await mountVnode(options, root, vnode, reuse);\n  pageRoot = { el: root, path, root: mounted };\n}\n\nasync function patchComponent(id: string, mod: Record<string, unknown>, options: CreateClientOptions) {\n  const { createElement } = await loadDom();\n  for (const [el, rec] of islands) {\n    if (rec.id !== id) continue;\n    if (!el.isConnected) {\n      rec.root?.unmount();\n      islands.delete(el);\n      continue;\n    }\n    const Component = mod[rec.exportName];\n    if (typeof Component !== \"function\") continue;\n    const vnode = vnodeFor(options, createElement, Component, rec.props);\n    rec.root = await mountVnode(options, el, vnode, rec.root);\n  }\n}\n\nasync function patchClientPage(\n  path: string,\n  mod: { default?: unknown },\n  options: CreateClientOptions,\n) {\n  const payload = readPayload();\n  if (!payload?.clientPage || payload.clientPage !== path) return;\n  const root = document.getElementById(PAGE_SLOT_ID);\n  if (!root) return;\n  await renderClientPage(path, mod, payload, options, root);\n}\n\nfunction syncNav(path: string) {\n  const links = document.querySelectorAll(\"nav a[href]\");\n  for (const link of links) {\n    if (!(link instanceof HTMLAnchorElement)) continue;\n    const href = link.getAttribute(\"href\");\n    if (!href || href.startsWith(\"http\")) continue;\n    const active =\n      href === path || (href !== \"/\" && (path === href || path.startsWith(`${href}/`)));\n    if (active) link.setAttribute(\"aria-current\", \"page\");\n    else link.removeAttribute(\"aria-current\");\n  }\n}\n\nasync function hydrateSlot(options: CreateClientOptions, payload: VinoPayload | null) {\n  pruneDisconnected();\n  if (payload) await hydrateClientPage(payload, options);\n  const slot = document.getElementById(PAGE_SLOT_ID);\n  await hydrateComponents(options, slot ?? document);\n  if (payload?.path) syncNav(payload.path);\n  return payload;\n}\n\nfunction parseContentFragment(html: string): {\n  slot: Element | null;\n  payload: VinoPayload | null;\n  title?: string;\n} {\n  const doc = new DOMParser().parseFromString(\n    `<!DOCTYPE html><html><body>${html}</body></html>`,\n    \"text/html\",\n  );\n  const payload = readPayload(doc);\n  const slot = doc.getElementById(PAGE_SLOT_ID);\n  return { slot, payload, title: payload?.title };\n}\n\nasync function fetchContent(\n  href: string,\n): Promise<{ slot: Element | null; payload: VinoPayload | null; title?: string }> {\n  const url = new URL(href, location.href);\n  const res = await fetch(url.href, { headers: { [NAV_HEADER]: \"1\" } });\n  const html = await res.text();\n  return parseContentFragment(html);\n}\n\nasync function applyContent(\n  href: string,\n  push: boolean,\n  options: CreateClientOptions,\n  fragment: { slot: Element | null; payload: VinoPayload | null; title?: string },\n) {\n  const { slot: nextSlot, payload: nextPayload, title } = fragment;\n  if (nextPayload?.clientRouting === false && push) {\n    location.href = href;\n    return nextPayload;\n  }\n\n  const current = document.getElementById(PAGE_SLOT_ID);\n  if (current && nextSlot) {\n    current.replaceWith(nextSlot);\n  } else if (nextSlot) {\n    document.body.appendChild(nextSlot);\n  }\n\n  if (nextPayload) writePayload(nextPayload);\n  if (title) document.title = title;\n  else if (nextPayload?.title) document.title = nextPayload.title;\n\n  const url = new URL(href, location.href);\n  if (push) history.pushState({ vino: true }, \"\", url.href);\n\n  return hydrateSlot(options, nextPayload ?? readPayload());\n}\n\nasync function navigate(href: string, push: boolean, options: CreateClientOptions) {\n  const fragment = await fetchContent(href);\n  return applyContent(href, push, options, fragment);\n}\n\nasync function fillPartialShell(options: CreateClientOptions, payload: VinoPayload | null) {\n  if (!payload?.partial) return payload;\n  const slot = document.getElementById(PAGE_SLOT_ID);\n  if (!slot) return payload;\n  if (slot.childNodes.length > 0) return hydrateSlot(options, { ...payload, partial: false });\n\n  const fragment = await fetchContent(location.href);\n  return applyContent(location.href, false, options, fragment);\n}\n\nfunction bindRouting(options: CreateClientOptions, payload: VinoPayload | null) {\n  if (!payload?.clientRouting) return;\n  document.addEventListener(\"click\", (event) => {\n    const target = event.target;\n    if (!(target instanceof Element)) return;\n    const anchor = target.closest(\"a\");\n    if (!anchor || !shouldIntercept(anchor) || isModifiedClick(event)) return;\n    // Prefer slot-swap when the page slot exists.\n    if (!document.getElementById(PAGE_SLOT_ID)) return;\n    event.preventDefault();\n    void navigate(anchor.href, true, options);\n  });\n  window.addEventListener(\"popstate\", () => {\n    void navigate(location.href, false, options);\n  });\n}\n\nfunction isModifiedClick(event: MouseEvent) {\n  return event.metaKey || event.ctrlKey || event.shiftKey || event.altKey || event.button !== 0;\n}\n\nfunction shouldIntercept(anchor: HTMLAnchorElement) {\n  if (anchor.hasAttribute(\"download\") || (anchor.target && anchor.target !== \"_self\")) return false;\n  if (anchor.origin !== location.origin) return false;\n  const rel = anchor.getAttribute(\"rel\");\n  if (rel?.includes(\"external\")) return false;\n  return true;\n}\n\nasync function handleHmr(payload: VinoHmrPayload, options: CreateClientOptions) {\n  if (payload.kind === \"registry\") {\n    if (payload.components) componentLoaders = payload.components;\n    if (payload.clientPages) clientPageLoaders = payload.clientPages;\n    return;\n  }\n  if (payload.kind === \"layout\") {\n    location.reload();\n    return;\n  }\n  if (payload.kind === \"ssr\") {\n    if (!document.getElementById(PAGE_SLOT_ID)) {\n      location.reload();\n      return;\n    }\n    await navigate(location.href, false, options);\n    return;\n  }\n  if (payload.kind === \"component\" && payload.mod) {\n    await patchComponent(payload.id, payload.mod, options);\n    return;\n  }\n  if (payload.kind === \"client-page\" && payload.mod) {\n    await patchClientPage(payload.id, payload.mod, options);\n  }\n}\n\n/**\n * Fill partial shells, hydrate `#vino-page` / `<vino-component>`, and intercept\n * same-origin links with content-only swaps when `clientRouting` is enabled.\n */\nexport function createClient(options: CreateClientOptions = {}) {\n  const hmr: HmrFn = (payload) => {\n    void handleHmr(payload, options);\n  };\n  bindHmr(hmr);\n  const ready = (async () => {\n    let payload = readPayload();\n    if (payload?.partial) {\n      payload = (await fillPartialShell(options, payload)) ?? payload;\n    } else {\n      payload = (await hydrateSlot(options, payload)) ?? payload;\n    }\n    bindRouting(options, payload);\n    return payload;\n  })();\n  return { ready, hmr };\n}\n"],"mappings":"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"}