@devframes/next 0.9.0-beta.1 → 0.9.0-beta.3

package/dist/dev-spa.d.mts

@@ -0,0 +1,110 @@
+import { InitDevframeOptions } from "devframe/initiate";
+import { DevframeDefinition, DevframeStorageScope } from "devframe";
+//#region src/config.d.ts
+/**
+ * Minimal shape of the bits of `next.config` this helper reads/writes, so the
+ * package doesn't pull Next's full config type graph into its `.d.ts` bundle.
+ * Any real `NextConfig` structurally satisfies it.
+ */
+interface DevframeNextConfig {
+  skipTrailingSlashRedirect?: boolean;
+  [key: string]: unknown;
+}
+/**
+ * Apply the Next config settings a devframe **host** requires, preserving
+ * everything else.
+ *
+ * Sets `skipTrailingSlashRedirect: true`: mounted devframe SPAs are served at
+ * `/__<id>/` and reference their assets relatively (`./_next/…`). Next's
+ * default trailing-slash redirect (`/__git/` → `/__git`) would re-root those
+ * relative paths and 404 every asset, leaving the panel unstyled and unable to
+ * connect. Serving the base path verbatim keeps relative resolution intact.
+ *
+ * ```js [next.config.mjs]
+ * import { withDevframe } from '@devframes/next/dev-spa'
+ *
+ * export default withDevframe({
+ *   // ...your own Next config
+ * })
+ * ```
+ */
+declare function withDevframe<T extends DevframeNextConfig>(nextConfig?: T): T;
+//#endregion
+//#region src/handler.d.ts
+interface CreateDevframeNextHandlerOptions {
+  /**
+   * Mount base for the SPA. Defaults to `def.basePath ?? '/__<id>/'` — the
+   * hosted-adapter default, so the devframe shares the Next app's origin
+   * without colliding with its routes.
+   */
+  base?: string;
+  /** Bind host for the side-car RPC/WS server. Default: `def.cli?.host ?? 'localhost'`. */
+  host?: string;
+  /** Pin the side-car port. Default: resolved from `def.cli?.port` via `get-port-please`. */
+  port?: number;
+  /** Flag bag forwarded to `def.setup(ctx, { flags })`. */
+  flags?: Record<string, unknown>;
+  /**
+   * Whether the side-car runs its own auth gate. **Gates by default**
+   * (devframe's interactive OTP unless the definition's `cli.auth` opts
+   * out), so the side-car socket isn't silently reachable by anything that
+   * can open it. Pass `false` to opt out for a single-user localhost host,
+   * or a handler for a custom scheme.
+   */
+  auth?: InitDevframeOptions['auth'];
+  /** Origin the Next app is reachable at, for docks needing an absolute URL. */
+  resolveOrigin?: () => string;
+  /** Override where persisted devframe state lives (defaults under the cwd / home). */
+  getStorageDir?: (scope: DevframeStorageScope) => string;
+  /**
+   * Expose the route-based MCP server (Streamable-HTTP) at `<base>__mcp` —
+   * on the Next app's own origin, through the same catch-all route as the
+   * SPA — and advertise it in the handler's `__connection.json`. Overrides
+   * `def.cli?.mcp`, `undefined` falls through to it, `false` disables the
+   * route regardless.
+   */
+  mcp?: InitDevframeOptions['mcp'];
+  /**
+   * Memoization key for the handler. Next re-runs route modules across
+   * dev-time reloads; the key makes a re-run return the live handler instead
+   * of leaking side-car servers. Default: `@devframes/next:<def.id>:<base>`.
+   */
+  key?: string;
+}
+interface DevframeNextHandler {
+  /**
+   * WHATWG-`fetch` handler for the catch-all App Router route. Serves the
+   * plugin's built SPA at `base` and answers `<base>__connection.json` with
+   * the RPC endpoint. Awaits {@link DevframeNextHandler.ready} so the first
+   * request doesn't race the server boot.
+   */
+  fetch: (request: Request) => Promise<Response>;
+  /** Resolves once the side-car RPC/WS server is listening. */
+  ready: Promise<void>;
+  /** Shut the side-car server down (call from an app-lifecycle hook / test). */
+  close: () => Promise<void>;
+}
+/**
+ * Host a **single** devframe from a Next.js App Router app — the Next
+ * counterpart to `devframeViteBridge`, reduced to memoization + defaults over
+ * `initDevframe` (Next's route handlers can't accept WS upgrades, so the
+ * RPC socket lives on the instance's side-car port, advertised at
+ * `<base>__connection.json`).
+ *
+ * ```ts [app/%5F_my-tool/[[...path]]/route.ts]
+ * import myDevframe from '@/devframe'
+ * import { createDevframeNextHandler } from '@devframes/next/dev-spa'
+ *
+ * export const runtime = 'nodejs'
+ * export const dynamic = 'force-dynamic'
+ *
+ * const handler = createDevframeNextHandler(myDevframe)
+ * export const GET = handler.fetch
+ * ```
+ *
+ * For a hub hosting many devframes at once, use `createDevframeNextHost`
+ * directly with `@devframes/hub`.
+ */
+declare function createDevframeNextHandler(def: DevframeDefinition, options?: CreateDevframeNextHandlerOptions): DevframeNextHandler;
+//#endregion
+export { type CreateDevframeNextHandlerOptions, type DevframeNextConfig, type DevframeNextHandler, createDevframeNextHandler, withDevframe };

package/dist/dev-spa.mjs

@@ -0,0 +1,105 @@
+import { homedir } from "node:os";
+import { join } from "node:path";
+import process from "node:process";
+import { initDevframe } from "devframe/initiate";
+//#region src/config.ts
+/**
+* Apply the Next config settings a devframe **host** requires, preserving
+* everything else.
+*
+* Sets `skipTrailingSlashRedirect: true`: mounted devframe SPAs are served at
+* `/__<id>/` and reference their assets relatively (`./_next/…`). Next's
+* default trailing-slash redirect (`/__git/` → `/__git`) would re-root those
+* relative paths and 404 every asset, leaving the panel unstyled and unable to
+* connect. Serving the base path verbatim keeps relative resolution intact.
+*
+* ```js [next.config.mjs]
+* import { withDevframe } from '@devframes/next/dev-spa'
+*
+* export default withDevframe({
+*   // ...your own Next config
+* })
+* ```
+*/
+function withDevframe(nextConfig = {}) {
+	return {
+		...nextConfig,
+		skipTrailingSlashRedirect: nextConfig.skipTrailingSlashRedirect ?? true
+	};
+}
+//#endregion
+//#region src/handler.ts
+/** Ensure a mount base has a single leading and trailing slash. */
+function normalizeBase(base) {
+	return `/${base}/`.replace(/\/{2,}/g, "/");
+}
+const REGISTRY_KEY = Symbol.for("@devframes/next:handler-registry");
+/**
+* Handlers memoized per key on `globalThis`. Next re-evaluates route modules
+* on every dev-time reload, so without this each reload would start a fresh
+* side-car WebSocket server and leak the previous one.
+*/
+function handlerRegistry() {
+	const holder = globalThis;
+	holder[REGISTRY_KEY] ??= /* @__PURE__ */ new Map();
+	return holder[REGISTRY_KEY];
+}
+function defaultGetStorageDir(scope) {
+	const cwd = process.cwd();
+	if (scope === "workspace") return join(cwd, ".devframe");
+	if (scope === "project") return join(cwd, "node_modules/.devframe");
+	return join(homedir(), ".devframe");
+}
+/**
+* Host a **single** devframe from a Next.js App Router app — the Next
+* counterpart to `devframeViteBridge`, reduced to memoization + defaults over
+* `initDevframe` (Next's route handlers can't accept WS upgrades, so the
+* RPC socket lives on the instance's side-car port, advertised at
+* `<base>__connection.json`).
+*
+* ```ts [app/%5F_my-tool/[[...path]]/route.ts]
+* import myDevframe from '@/devframe'
+* import { createDevframeNextHandler } from '@devframes/next/dev-spa'
+*
+* export const runtime = 'nodejs'
+* export const dynamic = 'force-dynamic'
+*
+* const handler = createDevframeNextHandler(myDevframe)
+* export const GET = handler.fetch
+* ```
+*
+* For a hub hosting many devframes at once, use `createDevframeNextHost`
+* directly with `@devframes/hub`.
+*/
+function createDevframeNextHandler(def, options = {}) {
+	const distDir = def.cli?.distDir;
+	if (!distDir) throw new Error(`[@devframes/next] createDevframeNextHandler("${def.id}") needs a built SPA to serve, but "cli.distDir" is not set on the devframe definition.`);
+	const base = normalizeBase(options.base ?? def.basePath ?? `/__${def.id}/`);
+	const key = options.key ?? `@devframes/next:${def.id}:${base}`;
+	const registry = handlerRegistry();
+	const memoized = registry.get(key);
+	if (memoized) return memoized;
+	const instance = initDevframe(def, {
+		base,
+		distDir,
+		host: options.host,
+		flags: options.flags,
+		auth: options.auth,
+		mcp: options.mcp,
+		ws: options.port != null ? { port: options.port } : { sidecar: true },
+		...options.resolveOrigin ? { origin: options.resolveOrigin } : {},
+		getStorageDir: options.getStorageDir ?? defaultGetStorageDir
+	});
+	const handler = {
+		fetch: (request) => instance.handler(request),
+		ready: instance.ready,
+		close: async () => {
+			if (registry.get(key) === handler) registry.delete(key);
+			await instance.close();
+		}
+	};
+	registry.set(key, handler);
+	return handler;
+}
+//#endregion
+export { createDevframeNextHandler, withDevframe };

package/dist/hub-client.d.mts

@@ -0,0 +1,29 @@
+import { DevframeClientHost, DevframeClientHost as DevframeClientHost$1, DevframeClientHostOptions, DevframeClientHostOptions as DevframeClientHostOptions$1 } from "@devframes/hub/client";
+//#region src/hub-client.d.ts
+interface UseDevframeHubClientOptions extends DevframeClientHostOptions$1 {
+  /**
+   * Hub mount base to connect to. Forwarded as `connect.baseURL` when no
+   * `rpc` / `connect.baseURL` is supplied.
+   *
+   * @default '/__devframes/'
+   */
+  base?: string;
+}
+/**
+ * Boot the devframes-hub **client runtime** inside a React (Next.js) page —
+ * the browser half of {@link import('./hub').nextDevframeHub}. Connects RPC to
+ * the hub (defaulting `base` to `/__devframes/`), assembles the shared
+ * `DevframeClientContext`, imports each dock's client script into the page,
+ * and disposes on unmount. Returns the {@link DevframeClientHost} once ready
+ * (`null` while connecting).
+ *
+ * Only needed when you render your own dock UI (or override the hub's `ui`).
+ * With the default `@devframes/hub-ui`, its injected `embedded.js` boots the
+ * client for you, so the page needs no client code.
+ *
+ * `renderers` is read once on mount; memoize it at the call site if it isn't a
+ * stable reference.
+ */
+declare function useDevframeHubClient(options?: UseDevframeHubClientOptions): DevframeClientHost$1 | null;
+//#endregion
+export { type DevframeClientHost, type DevframeClientHostOptions, UseDevframeHubClientOptions, useDevframeHubClient };

package/dist/hub-client.mjs

@@ -0,0 +1,51 @@
+"use client";
+import { useEffect, useState } from "react";
+import { createDevframeClientHost } from "@devframes/hub/client";
+//#region src/hub-client.tsx
+/** Default hub mount base — mirrors `@devframes/hub`'s `DEVFRAMES_HUB_BASE`. */
+const DEVFRAMES_HUB_BASE = "/__devframes/";
+/**
+* Boot the devframes-hub **client runtime** inside a React (Next.js) page —
+* the browser half of {@link import('./hub').nextDevframeHub}. Connects RPC to
+* the hub (defaulting `base` to `/__devframes/`), assembles the shared
+* `DevframeClientContext`, imports each dock's client script into the page,
+* and disposes on unmount. Returns the {@link DevframeClientHost} once ready
+* (`null` while connecting).
+*
+* Only needed when you render your own dock UI (or override the hub's `ui`).
+* With the default `@devframes/hub-ui`, its injected `embedded.js` boots the
+* client for you, so the page needs no client code.
+*
+* `renderers` is read once on mount; memoize it at the call site if it isn't a
+* stable reference.
+*/
+function useDevframeHubClient(options = {}) {
+	const { base = DEVFRAMES_HUB_BASE, rpc, connect } = options;
+	const [host, setHost] = useState(null);
+	useEffect(() => {
+		let disposed = false;
+		let created;
+		createDevframeClientHost({
+			...options,
+			...rpc ? { rpc } : { connect: {
+				baseURL: base,
+				...connect
+			} }
+		}).then((next) => {
+			if (disposed) {
+				next.dispose();
+				return;
+			}
+			created = next;
+			setHost(next);
+		});
+		return () => {
+			disposed = true;
+			created?.dispose();
+			setHost(null);
+		};
+	}, [base, rpc]);
+	return host;
+}
+//#endregion
+export { useDevframeHubClient };

package/dist/hub.d.mts

@@ -0,0 +1,197 @@
+import { DevframeHubUi, HubInstance, InitHubOptions } from "@devframes/hub/initiate";
+import { ConnectionMeta, DevframeHost, DevframeNodeContext, DevframeStorageScope } from "devframe";
+//#region src/host.d.ts
+interface CreateDevframeNextHostOptions {
+  /**
+   * Public origin the Next app is reachable at, e.g. `http://localhost:3000`.
+   * Surfaced through {@link DevframeHost.resolveOrigin} for docks that need an
+   * absolute iframe URL.
+   */
+  resolveOrigin: () => string;
+  /**
+   * Resolve a directory the host owns for persisted devframe state, per
+   * {@link DevframeHost.getStorageDir}.
+   */
+  getStorageDir: (scope: DevframeStorageScope) => string;
+  /**
+   * Initial connection meta served at every base registered via
+   * {@link DevframeHost.mountConnectionMeta}. Usually unknown until the
+   * side-car RPC/WS server has started — publish it later with
+   * {@link DevframeNextHost.setConnectionMeta}.
+   */
+  connectionMeta?: ConnectionMeta;
+}
+interface DevframeNextHostMcpOptions {
+  /** Name reported in the MCP handshake. Default: `'devframe (next)'`. */
+  serverName?: string;
+  /** Version reported in the MCP handshake. Default: `'0.0.0'`. */
+  serverVersion?: string;
+  /** Expose shared-state keys as MCP resources / `devframe:state:read`. Default: `true`. */
+  exposeSharedState?: boolean | ((key: string) => boolean);
+  /**
+   * Origin allow-list beyond the loopback default. `false` disables the
+   * origin gate entirely. Note the MCP route rejects `Origin`-less requests
+   * (see `createMcpFetchHandler`).
+   */
+  allowedOrigins?: readonly string[] | false;
+}
+interface DevframeNextHost {
+  /**
+   * The {@link DevframeHost} to hand to `createHubContext` / `createHostContext`.
+   * Its `mountStatic` / `mountConnectionMeta` calls accumulate into the
+   * {@link DevframeNextHost.fetch} handler below.
+   */
+  host: DevframeHost;
+  /**
+   * A WHATWG-`fetch` handler that serves every mounted SPA (with SPA
+   * fallback, correct content types, and path-traversal guarding — all from
+   * devframe's own `serveStaticHandler`) and answers `<base>/__connection.json`
+   * for each base registered via `mountConnectionMeta`. Delegate a Next App
+   * Router route handler straight to it:
+   *
+   * ```ts
+   * export async function GET(request: Request) {
+   *   return (await ensureHub()).fetch(request)
+   * }
+   * ```
+   */
+  fetch: (request: Request) => Promise<Response>;
+  /**
+   * Publish the live connection meta once the RPC/WS server is up. Until this
+   * is called (and without an initial `connectionMeta`), meta requests answer
+   * `503` so a racing client retries rather than caching a wrong endpoint.
+   */
+  setConnectionMeta: (meta: ConnectionMeta) => void;
+  /**
+   * Serve an MCP Streamable-HTTP endpoint at `path` **in-process** — on the
+   * Next app's own origin, through the same catch-all route as the SPAs (the
+   * `/_next/mcp` shape). Built on `createMcpFetchHandler` from
+   * `devframe/adapters/mcp` (imported lazily: `@modelcontextprotocol/server`
+   * stays an optional peer). Advertise the path in the connection meta
+   * (`mcp: { path }` — same origin, no port) and register the instance via
+   * `registerDevframeInstance` so `devframe connect` can discover it.
+   */
+  mountMcp: (ctx: DevframeNodeContext, path: string, options?: DevframeNextHostMcpOptions) => Promise<{
+    dispose: () => Promise<void>;
+  }>;
+}
+/**
+ * Build a Node-runtime {@link DevframeHost} for a Next.js App Router app that
+ * hosts one or more devframes, plus the single `fetch` handler its catch-all
+ * route delegates to.
+ *
+ * This is the hosted-adapter counterpart to `devframeViteBridge` for the Next
+ * runtime, which — being webpack/Turbopack rather than Vite — can't reuse the
+ * Vite middleware path. Instead of hand-rolling static serving in a route
+ * handler, static mounts are registered on an internal h3 app and served
+ * through devframe's shared `serveStaticHandler` (`app.fetch` makes h3 a
+ * WHATWG-`fetch` handler, exactly what an App Router route returns).
+ *
+ * Pins Node runtime (`export const runtime = 'nodejs'` in the route) because
+ * the static handler streams from the filesystem.
+ */
+declare function createDevframeNextHost(options: CreateDevframeNextHostOptions): DevframeNextHost;
+//#endregion
+//#region src/hub.d.ts
+interface NextDevframeHubOptions {
+  /**
+   * Mount base the hub answers under — every frame lives at `<base><id>/`,
+   * so the App Router needs one catch-all route under it. Default:
+   * `/__devframes/`.
+   */
+  base?: string;
+  /**
+   * Pin the side-car RPC/WS port. Next route handlers can't accept WebSocket
+   * upgrades, so the socket always runs on a side-car server; default walks a
+   * free port near 9777.
+   */
+  port?: number;
+  /** Bind host for the side-car server. Default: `localhost`. */
+  host?: string;
+  /** Working directory for the hub context. Default: `process.cwd()`. */
+  cwd?: string;
+  /**
+   * Devframes to mount. Load built-in plugin packages through a
+   * bundler-ignored dynamic `import()` (their node code + `import.meta.url`
+   * dist lookups don't survive static Next bundling) and pass them here —
+   * `initHub` resolves async/factory entries.
+   */
+  devframes?: InitHubOptions['devframes'];
+  /** Prebuilt dock-renderer modules forwarded to `initHub({ renderers })`. */
+  renderers?: InitHubOptions['renderers'];
+  /** Extra RPC declarations registered at context creation. */
+  rpcDeclarations?: InitHubOptions['rpcDeclarations'];
+  /** Runs once the context exists and every devframe is mounted. */
+  configure?: (ctx: Parameters<NonNullable<InitHubOptions['configure']>>[0]) => void | Promise<void>;
+  /**
+   * The hub's UI slot. Defaults to `@devframes/hub-ui`'s `createUi()` (loaded
+   * through a bundler-ignored dynamic `import()` so its `import.meta.url` asset
+   * lookups resolve at request time). Pass your own {@link DevframeHubUi} to
+   * swap the viewer, or `false` for a headless hub.
+   */
+  ui?: DevframeHubUi | false;
+  /** The hub's single auth gate. Gates by default; `false` opts out. */
+  auth?: InitHubOptions['auth'];
+  /**
+   * Expose the aggregate MCP endpoint at `<base>__mcp`. Default: `true`
+   * (the Next hub's agent surface rides the same catch-all route).
+   */
+  mcp?: InitHubOptions['mcp'];
+  /** Public origin the Next app is reachable at. Default: derived from `PORT`. */
+  origin?: InitHubOptions['origin'];
+  /** Publish this hub in the global instance registry. Default: off. */
+  register?: InitHubOptions['register'];
+  /** Override where persisted devframe state lives. */
+  getStorageDir?: InitHubOptions['getStorageDir'];
+  /** Name for the hub instance (logs, diagnostics, MCP server). */
+  name?: string;
+  /** Version for the hub instance (logs, diagnostics, MCP server). */
+  version?: string;
+}
+/**
+ * Build a devframes-hub for a Next.js App Router app: one `initHub()` call
+ * mounting every devframe under `<base><id>/` behind one web-standard
+ * `handler`, with the RPC socket on a side-car (Next routes can't accept WS
+ * upgrades) and the aggregate MCP route on by default. The UI defaults to
+ * `@devframes/hub-ui`'s `createUi()`, loaded lazily via a bundler-ignored
+ * dynamic `import()` so its asset lookups resolve at request time; pass `ui`
+ * to swap it or `ui: false` for a headless hub.
+ *
+ * Prefer {@link nextDevframeHub} at a route module — it memoizes this on
+ * `globalThis` so Next's dev-time route re-evaluation reuses one instance
+ * instead of leaking a side-car per reload.
+ */
+declare function createNextDevframeHub(options?: NextDevframeHubOptions): Promise<HubInstance>;
+/** A route-facing hub handle whose instance is memoized on `globalThis`. */
+interface NextDevframeHubHandle {
+  /** The normalized mount base this hub answers under. */
+  base: string;
+  /** Delegate an App Router catch-all route straight to this. */
+  handler: (request: Request) => Promise<Response>;
+  /** Await the underlying {@link HubInstance} (building it on first access). */
+  ready: () => Promise<HubInstance>;
+  /** Tear down the memoized instance (side-car, MCP sessions) and forget it. */
+  close: () => Promise<void>;
+}
+/**
+ * Route-facing devframes-hub for a Next.js App Router app, memoized on
+ * `globalThis` by mount base so Next's dev-time route re-evaluation reuses
+ * one instance instead of leaking a side-car per reload. Build it once at the
+ * catch-all route module and delegate the verbs to it:
+ *
+ * ```ts
+ * // app/__devframes/[[...path]]/route.ts
+ * export const runtime = 'nodejs'
+ * export const dynamic = 'force-dynamic'
+ *
+ * import { nextDevframeHub } from '@devframes/next/hub'
+ *
+ * const hub = nextDevframeHub({ devframes: [] })
+ * export const GET = (req: Request) => hub.handler(req)
+ * export const POST = (req: Request) => hub.handler(req)
+ * export const DELETE = (req: Request) => hub.handler(req)
+ * ```
+ */
+declare function nextDevframeHub(options?: NextDevframeHubOptions): NextDevframeHubHandle;
+//#endregion
+export { type CreateDevframeNextHostOptions, type DevframeNextHost, type DevframeNextHostMcpOptions, NextDevframeHubHandle, NextDevframeHubOptions, createDevframeNextHost, createNextDevframeHub, nextDevframeHub };

package/dist/hub.mjs

@@ -0,0 +1,185 @@
+import { DEVFRAMES_HUB_BASE, initHub } from "@devframes/hub/initiate";
+import { cleanDoubleSlashes, withLeadingSlash, withTrailingSlash } from "ufo";
+import { DEVFRAME_CONNECTION_META_FILENAME } from "devframe/constants";
+import { serveStaticHandler } from "devframe/utils/serve-static";
+import { H3 } from "h3";
+//#region src/host.ts
+const META_SUFFIX = `/${DEVFRAME_CONNECTION_META_FILENAME}`;
+/** Drop trailing slashes from a mount base (`/__git/` → `/__git`). */
+function stripTrailingSlash(base) {
+	return base.replace(/\/+$/, "");
+}
+/**
+* Build a Node-runtime {@link DevframeHost} for a Next.js App Router app that
+* hosts one or more devframes, plus the single `fetch` handler its catch-all
+* route delegates to.
+*
+* This is the hosted-adapter counterpart to `devframeViteBridge` for the Next
+* runtime, which — being webpack/Turbopack rather than Vite — can't reuse the
+* Vite middleware path. Instead of hand-rolling static serving in a route
+* handler, static mounts are registered on an internal h3 app and served
+* through devframe's shared `serveStaticHandler` (`app.fetch` makes h3 a
+* WHATWG-`fetch` handler, exactly what an App Router route returns).
+*
+* Pins Node runtime (`export const runtime = 'nodejs'` in the route) because
+* the static handler streams from the filesystem.
+*/
+function createDevframeNextHost(options) {
+	const app = new H3();
+	const metaBases = /* @__PURE__ */ new Set();
+	const mcpMounts = /* @__PURE__ */ new Map();
+	let connectionMeta = options.connectionMeta;
+	const host = {
+		mountStatic(base, distDir) {
+			const staticApp = new H3();
+			staticApp.use(serveStaticHandler(distDir));
+			app.mount(stripTrailingSlash(base), staticApp);
+		},
+		mountConnectionMeta(base) {
+			metaBases.add(stripTrailingSlash(base));
+		},
+		resolveOrigin: options.resolveOrigin,
+		getStorageDir: options.getStorageDir
+	};
+	async function fetch(request) {
+		const { pathname } = new URL(request.url);
+		const mcp = mcpMounts.get(stripTrailingSlash(pathname));
+		if (mcp) return mcp.fetch(request);
+		if (pathname.endsWith(META_SUFFIX) && metaBases.has(pathname.slice(0, -META_SUFFIX.length))) {
+			if (!connectionMeta) return new Response(null, { status: 503 });
+			return Response.json(connectionMeta);
+		}
+		const response = await app.fetch(request);
+		if (response.status === 404) return new Response(null, { status: 404 });
+		return response;
+	}
+	return {
+		host,
+		fetch,
+		setConnectionMeta(meta) {
+			connectionMeta = meta;
+		},
+		async mountMcp(ctx, path, mcpOptions = {}) {
+			const { createMcpFetchHandler } = await import("devframe/adapters/mcp");
+			const handler = createMcpFetchHandler(ctx, {
+				serverName: mcpOptions.serverName ?? "devframe (next)",
+				serverVersion: mcpOptions.serverVersion ?? "0.0.0",
+				exposeSharedState: mcpOptions.exposeSharedState ?? true,
+				allowedOrigins: mcpOptions.allowedOrigins
+			});
+			const key = stripTrailingSlash(path);
+			mcpMounts.set(key, handler);
+			return { dispose: async () => {
+				mcpMounts.delete(key);
+				await handler.dispose();
+			} };
+		}
+	};
+}
+//#endregion
+//#region src/hub.ts
+/**
+* Build a devframes-hub for a Next.js App Router app: one `initHub()` call
+* mounting every devframe under `<base><id>/` behind one web-standard
+* `handler`, with the RPC socket on a side-car (Next routes can't accept WS
+* upgrades) and the aggregate MCP route on by default. The UI defaults to
+* `@devframes/hub-ui`'s `createUi()`, loaded lazily via a bundler-ignored
+* dynamic `import()` so its asset lookups resolve at request time; pass `ui`
+* to swap it or `ui: false` for a headless hub.
+*
+* Prefer {@link nextDevframeHub} at a route module — it memoizes this on
+* `globalThis` so Next's dev-time route re-evaluation reuses one instance
+* instead of leaking a side-car per reload.
+*/
+async function createNextDevframeHub(options = {}) {
+	const base = normalizeBase(options.base ?? DEVFRAMES_HUB_BASE);
+	const ui = options.ui === false ? void 0 : options.ui ?? await loadDefaultUi();
+	return initHub({
+		base,
+		...options.cwd != null ? { cwd: options.cwd } : {},
+		...options.host != null ? { host: options.host } : {},
+		...options.origin != null ? { origin: options.origin } : {},
+		auth: options.auth,
+		ws: options.port != null ? { port: options.port } : { sidecar: true },
+		mcp: options.mcp ?? true,
+		...ui ? { ui } : {},
+		...options.renderers ? { renderers: options.renderers } : {},
+		...options.rpcDeclarations ? { rpcDeclarations: options.rpcDeclarations } : {},
+		...options.register != null ? { register: options.register } : {},
+		...options.getStorageDir ? { getStorageDir: options.getStorageDir } : {},
+		...options.name != null ? { name: options.name } : {},
+		...options.version != null ? { version: options.version } : {},
+		...options.devframes ? { devframes: options.devframes } : {},
+		...options.configure ? { configure: options.configure } : {}
+	});
+}
+function hubRegistry() {
+	const g = globalThis;
+	return g.__devframesNextHubs ??= /* @__PURE__ */ new Map();
+}
+/**
+* Route-facing devframes-hub for a Next.js App Router app, memoized on
+* `globalThis` by mount base so Next's dev-time route re-evaluation reuses
+* one instance instead of leaking a side-car per reload. Build it once at the
+* catch-all route module and delegate the verbs to it:
+*
+* ```ts
+* // app/__devframes/[[...path]]/route.ts
+* export const runtime = 'nodejs'
+* export const dynamic = 'force-dynamic'
+*
+* import { nextDevframeHub } from '@devframes/next/hub'
+*
+* const hub = nextDevframeHub({ devframes: [] })
+* export const GET = (req: Request) => hub.handler(req)
+* export const POST = (req: Request) => hub.handler(req)
+* export const DELETE = (req: Request) => hub.handler(req)
+* ```
+*/
+function nextDevframeHub(options = {}) {
+	const base = normalizeBase(options.base ?? DEVFRAMES_HUB_BASE);
+	const ready = () => {
+		const registry = hubRegistry();
+		let instance = registry.get(base);
+		if (!instance) {
+			instance = createNextDevframeHub({
+				...options,
+				base
+			});
+			registry.set(base, instance);
+		}
+		return instance;
+	};
+	return {
+		base,
+		async handler(request) {
+			return (await ready()).handler(request);
+		},
+		ready,
+		async close() {
+			const registry = hubRegistry();
+			const instance = registry.get(base);
+			if (!instance) return;
+			registry.delete(base);
+			await (await instance).close();
+		}
+	};
+}
+/**
+* Load `@devframes/hub-ui`'s default UI through a bundler-ignored dynamic
+* `import()`: `createUi()` resolves its prebuilt assets via `import.meta.url`,
+* which only points at the published `dist` when Node loads the package at
+* request time — a static import would be rewritten into a Next server chunk.
+*/
+async function loadDefaultUi() {
+	return (await import(
+		/* webpackIgnore: true */
+		/* turbopackIgnore: true */
+		"@devframes/hub-ui"
+)).createUi();
+}
+function normalizeBase(base) {
+	return cleanDoubleSlashes(withTrailingSlash(withLeadingSlash(base)));
+}
+//#endregion
+export { createDevframeNextHost, createNextDevframeHub, nextDevframeHub };

package/dist/index.d.mts

@@ -1,206 +1 @@
-import { InitDevframeOptions } from "devframe/initiate";
-import { ConnectionMeta, DevframeDefinition, DevframeHost, DevframeNodeContext, DevframeStorageScope } from "devframe";
-//#region src/config.d.ts
-/**
- * Minimal shape of the bits of `next.config` this helper reads/writes, so the
- * package doesn't pull Next's full config type graph into its `.d.ts` bundle.
- * Any real `NextConfig` structurally satisfies it.
- */
-interface DevframeNextConfig {
-  skipTrailingSlashRedirect?: boolean;
-  [key: string]: unknown;
-}
-/**
- * Apply the Next config settings a devframe **host** requires, preserving
- * everything else.
- *
- * Sets `skipTrailingSlashRedirect: true`: mounted devframe SPAs are served at
- * `/__<id>/` and reference their assets relatively (`./_next/…`). Next's
- * default trailing-slash redirect (`/__git/` → `/__git`) would re-root those
- * relative paths and 404 every asset, leaving the panel unstyled and unable to
- * connect. Serving the base path verbatim keeps relative resolution intact.
- *
- * ```js [next.config.mjs]
- * import { withDevframe } from '@devframes/next'
- *
- * export default withDevframe({
- *   // ...your own Next config
- * })
- * ```
- */
-declare function withDevframe<T extends DevframeNextConfig>(nextConfig?: T): T;
-//#endregion
-//#region src/handler.d.ts
-interface CreateDevframeNextHandlerOptions {
-  /**
-   * Mount base for the SPA. Defaults to `def.basePath ?? '/__<id>/'` — the
-   * hosted-adapter default, so the devframe shares the Next app's origin
-   * without colliding with its routes.
-   */
-  base?: string;
-  /** Bind host for the side-car RPC/WS server. Default: `def.cli?.host ?? 'localhost'`. */
-  host?: string;
-  /** Pin the side-car port. Default: resolved from `def.cli?.port` via `get-port-please`. */
-  port?: number;
-  /** Flag bag forwarded to `def.setup(ctx, { flags })`. */
-  flags?: Record<string, unknown>;
-  /**
-   * Whether the side-car runs its own auth gate. **Gates by default**
-   * (devframe's interactive OTP unless the definition's `cli.auth` opts
-   * out), so the side-car socket isn't silently reachable by anything that
-   * can open it. Pass `false` to opt out for a single-user localhost host,
-   * or a handler for a custom scheme.
-   */
-  auth?: InitDevframeOptions['auth'];
-  /** Origin the Next app is reachable at, for docks needing an absolute URL. */
-  resolveOrigin?: () => string;
-  /** Override where persisted devframe state lives (defaults under the cwd / home). */
-  getStorageDir?: (scope: DevframeStorageScope) => string;
-  /**
-   * Expose the route-based MCP server (Streamable-HTTP) at `<base>__mcp` —
-   * on the Next app's own origin, through the same catch-all route as the
-   * SPA — and advertise it in the handler's `__connection.json`. Overrides
-   * `def.cli?.mcp`, `undefined` falls through to it, `false` disables the
-   * route regardless.
-   *
-   * @experimental
-   */
-  mcp?: InitDevframeOptions['mcp'];
-  /**
-   * Memoization key for the handler. Next re-runs route modules across
-   * dev-time reloads; the key makes a re-run return the live handler instead
-   * of leaking side-car servers. Default: `@devframes/next:<def.id>:<base>`.
-   */
-  key?: string;
-}
-interface DevframeNextHandler {
-  /**
-   * WHATWG-`fetch` handler for the catch-all App Router route. Serves the
-   * plugin's built SPA at `base` and answers `<base>__connection.json` with
-   * the RPC endpoint. Awaits {@link DevframeNextHandler.ready} so the first
-   * request doesn't race the server boot.
-   */
-  fetch: (request: Request) => Promise<Response>;
-  /** Resolves once the side-car RPC/WS server is listening. */
-  ready: Promise<void>;
-  /** Shut the side-car server down (call from an app-lifecycle hook / test). */
-  close: () => Promise<void>;
-}
-/**
- * Host a **single** devframe from a Next.js App Router app — the Next
- * counterpart to `viteDevBridge`, reduced to memoization + defaults over
- * `initDevframe` (Next's route handlers can't accept WS upgrades, so the
- * RPC socket lives on the instance's side-car port, advertised at
- * `<base>__connection.json`).
- *
- * ```ts [app/%5F_my-tool/[[...path]]/route.ts]
- * import myDevframe from '@/devframe'
- * import { createDevframeNextHandler } from '@devframes/next'
- *
- * export const runtime = 'nodejs'
- * export const dynamic = 'force-dynamic'
- *
- * const handler = createDevframeNextHandler(myDevframe)
- * export const GET = handler.fetch
- * ```
- *
- * For a hub hosting many devframes at once, use `createDevframeNextHost`
- * directly with `@devframes/hub`.
- */
-declare function createDevframeNextHandler(def: DevframeDefinition, options?: CreateDevframeNextHandlerOptions): DevframeNextHandler;
-//#endregion
-//#region src/host.d.ts
-interface CreateDevframeNextHostOptions {
-  /**
-   * Public origin the Next app is reachable at, e.g. `http://localhost:3000`.
-   * Surfaced through {@link DevframeHost.resolveOrigin} for docks that need an
-   * absolute iframe URL.
-   */
-  resolveOrigin: () => string;
-  /**
-   * Resolve a directory the host owns for persisted devframe state, per
-   * {@link DevframeHost.getStorageDir}.
-   */
-  getStorageDir: (scope: DevframeStorageScope) => string;
-  /**
-   * Initial connection meta served at every base registered via
-   * {@link DevframeHost.mountConnectionMeta}. Usually unknown until the
-   * side-car RPC/WS server has started — publish it later with
-   * {@link DevframeNextHost.setConnectionMeta}.
-   */
-  connectionMeta?: ConnectionMeta;
-}
-interface DevframeNextHostMcpOptions {
-  /** Name reported in the MCP handshake. Default: `'devframe (next)'`. */
-  serverName?: string;
-  /** Version reported in the MCP handshake. Default: `'0.0.0'`. */
-  serverVersion?: string;
-  /** Expose shared-state keys as MCP resources / `devframe:state:read`. Default: `true`. */
-  exposeSharedState?: boolean | ((key: string) => boolean);
-  /**
-   * Origin allow-list beyond the loopback default. `false` disables the
-   * origin gate entirely. Note the MCP route rejects `Origin`-less requests
-   * (see `createMcpFetchHandler`).
-   */
-  allowedOrigins?: readonly string[] | false;
-}
-interface DevframeNextHost {
-  /**
-   * The {@link DevframeHost} to hand to `createHubContext` / `createHostContext`.
-   * Its `mountStatic` / `mountConnectionMeta` calls accumulate into the
-   * {@link DevframeNextHost.fetch} handler below.
-   */
-  host: DevframeHost;
-  /**
-   * A WHATWG-`fetch` handler that serves every mounted SPA (with SPA
-   * fallback, correct content types, and path-traversal guarding — all from
-   * devframe's own `serveStaticHandler`) and answers `<base>/__connection.json`
-   * for each base registered via `mountConnectionMeta`. Delegate a Next App
-   * Router route handler straight to it:
-   *
-   * ```ts
-   * export async function GET(request: Request) {
-   *   return (await ensureHub()).fetch(request)
-   * }
-   * ```
-   */
-  fetch: (request: Request) => Promise<Response>;
-  /**
-   * Publish the live connection meta once the RPC/WS server is up. Until this
-   * is called (and without an initial `connectionMeta`), meta requests answer
-   * `503` so a racing client retries rather than caching a wrong endpoint.
-   */
-  setConnectionMeta: (meta: ConnectionMeta) => void;
-  /**
-   * Serve an MCP Streamable-HTTP endpoint at `path` **in-process** — on the
-   * Next app's own origin, through the same catch-all route as the SPAs (the
-   * `/_next/mcp` shape). Built on `createMcpFetchHandler` from
-   * `devframe/adapters/mcp` (imported lazily: `@modelcontextprotocol/server`
-   * stays an optional peer). Advertise the path in the connection meta
-   * (`mcp: { path }` — same origin, no port) and register the instance via
-   * `registerDevframeInstance` so `devframe connect` can discover it.
-   *
-   * @experimental
-   */
-  mountMcp: (ctx: DevframeNodeContext, path: string, options?: DevframeNextHostMcpOptions) => Promise<{
-    dispose: () => Promise<void>;
-  }>;
-}
-/**
- * Build a Node-runtime {@link DevframeHost} for a Next.js App Router app that
- * hosts one or more devframes, plus the single `fetch` handler its catch-all
- * route delegates to.
- *
- * This is the hosted-adapter counterpart to `viteDevBridge` for the Next
- * runtime, which — being webpack/Turbopack rather than Vite — can't reuse the
- * Vite middleware path. Instead of hand-rolling static serving in a route
- * handler, static mounts are registered on an internal h3 app and served
- * through devframe's shared `serveStaticHandler` (`app.fetch` makes h3 a
- * WHATWG-`fetch` handler, exactly what an App Router route returns).
- *
- * Pins Node runtime (`export const runtime = 'nodejs'` in the route) because
- * the static handler streams from the filesystem.
- */
-declare function createDevframeNextHost(options: CreateDevframeNextHostOptions): DevframeNextHost;
-//#endregion
-export { type CreateDevframeNextHandlerOptions, type CreateDevframeNextHostOptions, type DevframeNextConfig, type DevframeNextHandler, type DevframeNextHost, type DevframeNextHostMcpOptions, createDevframeNextHandler, createDevframeNextHost, withDevframe };
+export {}

package/dist/index.mjs

@@ -1,182 +1,4 @@
-import { homedir } from "node:os";
-import { join } from "node:path";
-import process from "node:process";
-import { initDevframe } from "devframe/initiate";
-import { DEVFRAME_CONNECTION_META_FILENAME } from "devframe/constants";
-import { serveStaticHandler } from "devframe/utils/serve-static";
-import { H3 } from "h3";
-//#region src/config.ts
-/**
-* Apply the Next config settings a devframe **host** requires, preserving
-* everything else.
-*
-* Sets `skipTrailingSlashRedirect: true`: mounted devframe SPAs are served at
-* `/__<id>/` and reference their assets relatively (`./_next/…`). Next's
-* default trailing-slash redirect (`/__git/` → `/__git`) would re-root those
-* relative paths and 404 every asset, leaving the panel unstyled and unable to
-* connect. Serving the base path verbatim keeps relative resolution intact.
-*
-* ```js [next.config.mjs]
-* import { withDevframe } from '@devframes/next'
-*
-* export default withDevframe({
-*   // ...your own Next config
-* })
-* ```
-*/
-function withDevframe(nextConfig = {}) {
-	return {
-		...nextConfig,
-		skipTrailingSlashRedirect: nextConfig.skipTrailingSlashRedirect ?? true
-	};
-}
+//#region src/index.ts
+throw new Error("[@devframes/next] has no root export. Import from a scoped subpath instead:\n  • \"@devframes/next/dev-spa\" (+ \"/dev-spa/client\") — host one devframe's SPA\n  • \"@devframes/next/hub\" (+ \"/hub/client\")         — mount a devframes-hub\n");
 //#endregion
-//#region src/handler.ts
-/** Ensure a mount base has a single leading and trailing slash. */
-function normalizeBase(base) {
-	return `/${base}/`.replace(/\/{2,}/g, "/");
-}
-const REGISTRY_KEY = Symbol.for("@devframes/next:handler-registry");
-/**
-* Handlers memoized per key on `globalThis`. Next re-evaluates route modules
-* on every dev-time reload, so without this each reload would start a fresh
-* side-car WebSocket server and leak the previous one.
-*/
-function handlerRegistry() {
-	const holder = globalThis;
-	holder[REGISTRY_KEY] ??= /* @__PURE__ */ new Map();
-	return holder[REGISTRY_KEY];
-}
-function defaultGetStorageDir(scope) {
-	const cwd = process.cwd();
-	if (scope === "workspace") return join(cwd, ".devframe");
-	if (scope === "project") return join(cwd, "node_modules/.devframe");
-	return join(homedir(), ".devframe");
-}
-/**
-* Host a **single** devframe from a Next.js App Router app — the Next
-* counterpart to `viteDevBridge`, reduced to memoization + defaults over
-* `initDevframe` (Next's route handlers can't accept WS upgrades, so the
-* RPC socket lives on the instance's side-car port, advertised at
-* `<base>__connection.json`).
-*
-* ```ts [app/%5F_my-tool/[[...path]]/route.ts]
-* import myDevframe from '@/devframe'
-* import { createDevframeNextHandler } from '@devframes/next'
-*
-* export const runtime = 'nodejs'
-* export const dynamic = 'force-dynamic'
-*
-* const handler = createDevframeNextHandler(myDevframe)
-* export const GET = handler.fetch
-* ```
-*
-* For a hub hosting many devframes at once, use `createDevframeNextHost`
-* directly with `@devframes/hub`.
-*/
-function createDevframeNextHandler(def, options = {}) {
-	const distDir = def.cli?.distDir;
-	if (!distDir) throw new Error(`[@devframes/next] createDevframeNextHandler("${def.id}") needs a built SPA to serve, but "cli.distDir" is not set on the devframe definition.`);
-	const base = normalizeBase(options.base ?? def.basePath ?? `/__${def.id}/`);
-	const key = options.key ?? `@devframes/next:${def.id}:${base}`;
-	const registry = handlerRegistry();
-	const memoized = registry.get(key);
-	if (memoized) return memoized;
-	const instance = initDevframe(def, {
-		base,
-		distDir,
-		host: options.host,
-		flags: options.flags,
-		auth: options.auth,
-		mcp: options.mcp,
-		ws: options.port != null ? { port: options.port } : { sidecar: true },
-		...options.resolveOrigin ? { origin: options.resolveOrigin } : {},
-		getStorageDir: options.getStorageDir ?? defaultGetStorageDir
-	});
-	const handler = {
-		fetch: (request) => instance.handler(request),
-		ready: instance.ready,
-		close: async () => {
-			if (registry.get(key) === handler) registry.delete(key);
-			await instance.close();
-		}
-	};
-	registry.set(key, handler);
-	return handler;
-}
-//#endregion
-//#region src/host.ts
-const META_SUFFIX = `/${DEVFRAME_CONNECTION_META_FILENAME}`;
-/** Drop trailing slashes from a mount base (`/__git/` → `/__git`). */
-function stripTrailingSlash(base) {
-	return base.replace(/\/+$/, "");
-}
-/**
-* Build a Node-runtime {@link DevframeHost} for a Next.js App Router app that
-* hosts one or more devframes, plus the single `fetch` handler its catch-all
-* route delegates to.
-*
-* This is the hosted-adapter counterpart to `viteDevBridge` for the Next
-* runtime, which — being webpack/Turbopack rather than Vite — can't reuse the
-* Vite middleware path. Instead of hand-rolling static serving in a route
-* handler, static mounts are registered on an internal h3 app and served
-* through devframe's shared `serveStaticHandler` (`app.fetch` makes h3 a
-* WHATWG-`fetch` handler, exactly what an App Router route returns).
-*
-* Pins Node runtime (`export const runtime = 'nodejs'` in the route) because
-* the static handler streams from the filesystem.
-*/
-function createDevframeNextHost(options) {
-	const app = new H3();
-	const metaBases = /* @__PURE__ */ new Set();
-	const mcpMounts = /* @__PURE__ */ new Map();
-	let connectionMeta = options.connectionMeta;
-	const host = {
-		mountStatic(base, distDir) {
-			const staticApp = new H3();
-			staticApp.use(serveStaticHandler(distDir));
-			app.mount(stripTrailingSlash(base), staticApp);
-		},
-		mountConnectionMeta(base) {
-			metaBases.add(stripTrailingSlash(base));
-		},
-		resolveOrigin: options.resolveOrigin,
-		getStorageDir: options.getStorageDir
-	};
-	async function fetch(request) {
-		const { pathname } = new URL(request.url);
-		const mcp = mcpMounts.get(stripTrailingSlash(pathname));
-		if (mcp) return mcp.fetch(request);
-		if (pathname.endsWith(META_SUFFIX) && metaBases.has(pathname.slice(0, -META_SUFFIX.length))) {
-			if (!connectionMeta) return new Response(null, { status: 503 });
-			return Response.json(connectionMeta);
-		}
-		const response = await app.fetch(request);
-		if (response.status === 404) return new Response(null, { status: 404 });
-		return response;
-	}
-	return {
-		host,
-		fetch,
-		setConnectionMeta(meta) {
-			connectionMeta = meta;
-		},
-		async mountMcp(ctx, path, mcpOptions = {}) {
-			const { createMcpFetchHandler } = await import("devframe/adapters/mcp");
-			const handler = createMcpFetchHandler(ctx, {
-				serverName: mcpOptions.serverName ?? "devframe (next)",
-				serverVersion: mcpOptions.serverVersion ?? "0.0.0",
-				exposeSharedState: mcpOptions.exposeSharedState ?? true,
-				allowedOrigins: mcpOptions.allowedOrigins
-			});
-			const key = stripTrailingSlash(path);
-			mcpMounts.set(key, handler);
-			return { dispose: async () => {
-				mcpMounts.delete(key);
-				await handler.dispose();
-			} };
-		}
-	};
-}
-//#endregion
-export { createDevframeNextHandler, createDevframeNextHost, withDevframe };
+export {};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@devframes/next",
   "type": "module",
-  "version": "0.9.0-beta.1",
+  "version": "0.9.0-beta.3",
   "description": "Next.js host integration that serves mounted devframes from an App Router route.",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -24,10 +24,22 @@
       "types": "./dist/index.d.mts",
       "default": "./dist/index.mjs"
     },
-    "./client": {
+    "./dev-spa": {
+      "types": "./dist/dev-spa.d.mts",
+      "default": "./dist/dev-spa.mjs"
+    },
+    "./dev-spa/client": {
       "types": "./dist/client.d.mts",
       "default": "./dist/client.mjs"
     },
+    "./hub": {
+      "types": "./dist/hub.d.mts",
+      "default": "./dist/hub.mjs"
+    },
+    "./hub/client": {
+      "types": "./dist/hub-client.d.mts",
+      "default": "./dist/hub-client.mjs"
+    },
     "./package.json": "./package.json"
   },
   "types": "./dist/index.d.mts",
@@ -37,9 +49,17 @@
   "peerDependencies": {
     "next": "^14.0.0 || ^15.0.0 || ^16.0.0",
     "react": "^18.0.0 || ^19.0.0",
-    "devframe": "0.9.0-beta.1"
+    "@devframes/hub": "0.9.0-beta.3",
+    "@devframes/hub-ui": "0.9.0-beta.3",
+    "devframe": "0.9.0-beta.3"
   },
   "peerDependenciesMeta": {
+    "@devframes/hub": {
+      "optional": true
+    },
+    "@devframes/hub-ui": {
+      "optional": true
+    },
     "next": {
       "optional": true
     },
@@ -48,14 +68,17 @@
     }
   },
   "dependencies": {
-    "h3": "^2.0.1-rc.26"
+    "h3": "^2.0.1-rc.26",
+    "ufo": "^1.6.4"
   },
   "devDependencies": {
     "@types/node": "^26.2.0",
     "@types/react": "^19.2.18",
     "react": "^19.2.8",
     "tsdown": "^0.22.14",
-    "devframe": "0.9.0-beta.1"
+    "@devframes/hub": "0.9.0-beta.3",
+    "devframe": "0.9.0-beta.3",
+    "@devframes/hub-ui": "0.9.0-beta.3"
   },
   "scripts": {
     "build": "tsdown",