weifuwu 0.83.0 → 0.84.0

package/dist/index.js

@@ -22,7 +22,7 @@ function createMiddleware(config) {
 
 // src/core/serve.ts
 import http from "node:http";
-import crypto from "node:crypto";
+import crypto2 from "node:crypto";
 var DEFAULT_MAX_BODY = 10 * 1024 * 1024;
 async function readBody(req, maxSize) {
   const limit = maxSize ?? DEFAULT_MAX_BODY;
@@ -95,7 +95,7 @@ function serve(router, options) {
   const port = options?.port ?? 0;
   const hostname2 = options?.hostname ?? "0.0.0.0";
   const server = http.createServer(async (req, res) => {
-    const traceId = req.headers["x-trace-id"] || req.headers["traceparent"]?.split("-")[1] || crypto.randomUUID();
+    const traceId = req.headers["x-trace-id"] || req.headers["traceparent"]?.split("-")[1] || crypto2.randomUUID();
     try {
       const body = await readBody(req, options?.maxBodySize);
       const [request, query] = createRequest(req, body);
@@ -653,9 +653,9 @@ var Router = class _Router {
   }
   // ── Private: Mount ─────────────────────────────────────────
   _mountRouter(prefix, sub, extraMws = []) {
-    const base2 = prefix === "/" ? "" : prefix.replace(/\/$/, "");
+    const base = prefix === "/" ? "" : prefix.replace(/\/$/, "");
     const mountMw = (req, ctx, next) => {
-      ctx.mountPath = (ctx.mountPath || "") + base2;
+      ctx.mountPath = (ctx.mountPath || "") + base;
       return next(req, ctx);
     };
     const allExtra = extraMws.length === 0 && sub.globalMws.length === 0 ? [mountMw] : [mountMw, ...extraMws, ...sub.globalMws];
@@ -665,12 +665,12 @@ var Router = class _Router {
     const routes = [];
     this._collect(sub.root, "", routes);
     for (const { method, path, handler, middlewares } of routes) {
-      this._routeImpl(method, base2 + path, [...allExtra, ...middlewares, handler]);
+      this._routeImpl(method, base + path, [...allExtra, ...middlewares, handler]);
     }
     const wsRoutes = [];
     this._collectWs(sub.wsRoot, "", wsRoutes);
     for (const { path, handler, middlewares } of wsRoutes) {
-      this.ws(base2 + path, ...allExtra, ...middlewares, handler);
+      this.ws(base + path, ...allExtra, ...middlewares, handler);
     }
   }
   _collect(node, prefix, result) {
@@ -736,10 +736,10 @@ var Router = class _Router {
     const params = {};
     for (let i = 0; i < segments.length; i++) {
       if (node.wildcard) {
-        const h = node.handlers.get("*") || node.handlers.get(method) || (method === "HEAD" ? node.handlers.get("GET") : void 0);
-        if (h) {
+        const h2 = node.handlers.get("*") || node.handlers.get(method) || (method === "HEAD" ? node.handlers.get("GET") : void 0);
+        if (h2) {
           params["*"] = segments.slice(i).join("/");
-          return { kind: "route", handler: h, mws: node.middlewares.get(method) || node.middlewares.get("*") || [], params };
+          return { kind: "route", handler: h2, mws: node.middlewares.get(method) || node.middlewares.get("*") || [], params };
         }
       }
       const next = matchChild(node, segments[i], params, false);
@@ -826,18 +826,18 @@ var Router = class _Router {
   async runChain(mws, finalHandler, req, ctx) {
     if (mws.length === 0) return finalHandler(req, ctx);
     let i = 0;
-    const dispatch = (r, c) => {
+    const dispatch3 = (r, c) => {
       if (i >= mws.length) return Promise.resolve(finalHandler(r, c));
       const mw = mws[i++];
       let called = false;
       const next = (r2, c2) => {
         if (called) throw new Error("[router] next() called more than once in middleware");
         called = true;
-        return dispatch(r2, c2);
+        return dispatch3(r2, c2);
       };
       return Promise.resolve(mw(r, c, next));
     };
-    return dispatch(req, ctx);
+    return dispatch3(req, ctx);
   }
   // ── Private: Meta checking ──────────────────────────────────
   /**
@@ -1404,8 +1404,8 @@ function signToken(payload, secret, ttlSeconds) {
 function verifyToken(token, secret) {
   const parts = token.split(".");
   if (parts.length !== 3) return null;
-  const [h, p, s] = parts;
-  const data = `${h}.${p}`;
+  const [h2, p, s] = parts;
+  const data = `${h2}.${p}`;
   const expected = createHmac("sha256", secret).update(data).digest("base64url");
   const sigBuf = Buffer.from(s);
   const expBuf = Buffer.from(expected);
@@ -2262,10 +2262,10 @@ var GROUP = "workers";
 function queue(options) {
   const redis2 = options.redis;
   const prefix = options.prefix ?? "q:";
-  const stream = (name) => `${prefix}${name}`;
+  const stream2 = (name) => `${prefix}${name}`;
   const deadStream = (name) => `${prefix}${name}:dead`;
   async function pushJob(name, payload) {
-    const id = await redis2.command("XADD", stream(name), "*", "payload", JSON.stringify(payload));
+    const id = await redis2.command("XADD", stream2(name), "*", "payload", JSON.stringify(payload));
     return String(id);
   }
   const queueClient = {
@@ -2280,13 +2280,13 @@ function queue(options) {
       });
       return { id };
     },
-    length: async (name) => Number(await redis2.command("XLEN", stream(name))),
+    length: async (name) => Number(await redis2.command("XLEN", stream2(name))),
     worker(name, handler, opts) {
       const consumer = opts?.consumer ?? `${hostname()}-${process.pid}-${Math.random().toString(36).slice(2, 6)}`;
       const concurrency = opts?.concurrency ?? 1;
       const visibilityTimeout = opts?.visibilityTimeout ?? 3e4;
       const blockMs = opts?.blockMs ?? 1e3;
-      const s = stream(name);
+      const s = stream2(name);
       const dead = deadStream(name);
       const delayed = `${prefix}${name}:delayed`;
       let running = false;
@@ -2828,7 +2828,7 @@ import { randomUUID as randomUUID3 } from "node:crypto";
 // src/ai/sse.ts
 function sseResponse(run, options) {
   const encoder = new TextEncoder();
-  const stream = new ReadableStream({
+  const stream2 = new ReadableStream({
     async start(controller) {
       const emit = (name, data) => {
         controller.enqueue(encoder.encode(`event: ${name}
@@ -2855,7 +2855,7 @@ data: ${JSON.stringify(data)}
       options?.onAbort?.();
     }
   });
-  return new Response(stream, {
+  return new Response(stream2, {
     headers: {
       "Content-Type": "text/event-stream",
       "Cache-Control": "no-cache",
@@ -2873,8 +2873,8 @@ var AiError = class extends Error {
     this.code = code;
   }
 };
-async function* parseProviderSse(stream) {
-  const reader = stream.getReader();
+async function* parseProviderSse(stream2) {
+  const reader = stream2.getReader();
   const decoder = new TextDecoder();
   let buffer = "";
   try {
@@ -2966,8 +2966,8 @@ function createEmbeddingClient(ebd) {
 function createAiClient(opts) {
   const embedding = createEmbeddingClient(opts.embedding);
   function endpointFor(params) {
-    const base2 = params.baseUrl ?? opts.baseUrl;
-    return `${base2.replace(/\/$/, "")}/chat/completions`;
+    const base = params.baseUrl ?? opts.baseUrl;
+    return `${base.replace(/\/$/, "")}/chat/completions`;
   }
   function headersFor(params) {
     return { "Content-Type": "application/json", Authorization: `Bearer ${params.apiKey ?? opts.apiKey}` };
@@ -3025,7 +3025,7 @@ function createAiClient(opts) {
     }
     return res.json();
   }
-  function stream(params, options) {
+  function stream2(params, options) {
     const controller = new AbortController();
     const external = options?.signal;
     if (external) {
@@ -3107,7 +3107,7 @@ function createAiClient(opts) {
   }
   return {
     chat,
-    stream,
+    stream: stream2,
     sse,
     streamStep,
     waitApproval,
@@ -3143,7 +3143,7 @@ function createAgent(client, config) {
     }
     return controller;
   }
-  async function stream(messages, options) {
+  async function stream2(messages, options) {
     const controller = createController(options?.signal);
     const emit = options?.emit ?? (() => {
     });
@@ -3265,7 +3265,7 @@ function createAgent(client, config) {
     emit("wf:usage", usage);
     emit("wf:done", { content: "", usage });
   }
-  return { run, stream, runToResult };
+  return { run, stream: stream2, runToResult };
 }
 
 // src/ai/index.ts
@@ -3314,303 +3314,2285 @@ var HtmlSafe = class {
   }
 };
 
-// src/ui-dom/vnode.ts
-var Fragment = /* @__PURE__ */ Symbol("Fragment");
-var Portal = /* @__PURE__ */ Symbol("Portal");
-function isFrag(v) {
-  return v != null && typeof v === "object" && v.type === Fragment;
-}
-function isComp(v) {
-  return v != null && typeof v === "object" && typeof v.type === "function";
+// src/ui-dom/vdom3/types.ts
+function flatten(c) {
+  if (c == null || typeof c === "boolean") return [];
+  if (Array.isArray(c)) return c.flatMap((x) => flatten(x));
+  return [c];
+}
+function childrenOf(v) {
+  if (v.children != null) return flatten(v.children);
+  const c = v.props?.children ?? [];
+  return flatten(c);
+}
+var Fragment = /* @__PURE__ */ Symbol("v3-fragment");
+var Portal = /* @__PURE__ */ Symbol("v3-portal");
+var App = /* @__PURE__ */ Symbol("v3-app");
+
+// src/ui-dom/vdom3/events.ts
+function ev(entity, action, target, payload) {
+  const e = { entity, action, ts: Date.now() };
+  if (target != null) e.target = target;
+  if (payload != null) e.payload = payload;
+  return e;
+}
+function createEventStream(max = 2e4, opts) {
+  const buf = [];
+  let head = 0;
+  let len = 0;
+  let overflowCount = 0;
+  let watermarkFired = false;
+  const watermark = opts?.watermark ?? 0.8;
+  const listeners = /* @__PURE__ */ new Set();
+  const at = (i) => buf[(head + i) % max];
+  const set = (i, evt) => {
+    buf[(head + i) % max] = evt;
+  };
+  const emitOne = (evt, suppressOverflow) => {
+    if (len < max) {
+      set(len, evt);
+      len++;
+    } else {
+      set(0, evt);
+      head = (head + 1) % max;
+      if (!suppressOverflow) {
+        overflowCount++;
+        if (overflowCount % 64 === 1 || overflowCount === 1) {
+          emitOne(ev("stream", "overflow", void 0, {
+            capacity: max,
+            count: overflowCount,
+            dropped: `${evt.entity}:${evt.action}`,
+            droppedTarget: evt.target ?? null
+          }), true);
+        }
+      }
+    }
+  };
+  return {
+    emit(evt) {
+      emitOne(evt, false);
+      if (watermark > 0 && !watermarkFired && len >= max * watermark) {
+        watermarkFired = true;
+        emitOne(ev("stream", "watermark", void 0, { usage: len, capacity: max, ratio: watermark }), true);
+      }
+      for (const fn of listeners) {
+        try {
+          fn(evt);
+        } catch {
+        }
+      }
+    },
+    /** 实时订阅（emit 同步回调——不丢事件——返回退订）。
+     *  重载（见 EventStream 类型）：subscribe(fn) 全部；subscribe(filter, fn) 按层过滤 */
+    subscribe(filterOrFn, maybeFn) {
+      const filter = typeof filterOrFn === "function" ? null : filterOrFn;
+      const fn = typeof filterOrFn === "function" ? filterOrFn : maybeFn;
+      const wrapped = (ev2) => {
+        if (filter == null) {
+          fn(ev2);
+          return;
+        }
+        const list = Array.isArray(filter) ? filter : [filter];
+        if (list.includes(ev2.entity)) fn(ev2);
+      };
+      listeners.add(wrapped);
+      return () => {
+        listeners.delete(wrapped);
+      };
+    },
+    /** 当前有效条数（缓冲占用） */
+    size() {
+      return len;
+    },
+    /** 缓冲容量 */
+    capacity() {
+      return max;
+    },
+    /** 溢出次数（最旧事件被覆盖的次数——事件丢失可审计） */
+    overflowCount() {
+      return overflowCount;
+    },
+    events() {
+      const out = new Array(len);
+      for (let i = 0; i < len; i++) out[i] = at(i);
+      return out;
+    },
+    inverse(evt) {
+      switch (evt.entity + ":" + evt.action) {
+        case "node:insert":
+          return ev("node", "remove", evt.target, { parent: evt.payload?.parent });
+        case "node:remove":
+          return null;
+        // 逆操作需保存被移除节点完整信息——执行器快照配合
+        case "prop:update":
+          return ev("prop", "update", evt.target, { key: evt.payload?.key, value: evt.payload?.prev, prev: evt.payload?.value });
+        case "text:update":
+          return ev("text", "update", evt.target, { value: evt.payload?.prev, prev: evt.payload?.value });
+        case "node:move":
+          return null;
+        // 需保存旧位置
+        default:
+          return null;
+      }
+    },
+    reset() {
+      head = 0;
+      len = 0;
+      overflowCount = 0;
+      watermarkFired = false;
+    }
+  };
 }
-function isPortal(v) {
-  return v != null && typeof v === "object" && v.type === Portal;
+var stream = createEventStream();
+var nodeUid = 0;
+function nextNodeId() {
+  return `n${++nodeUid}`;
 }
-function base(type, props, key = null) {
+
+// src/ui-dom/browser.ts
+function createClientBrowser() {
   return {
-    type,
-    props,
-    key,
-    _child: null,
-    _parentNode: null,
-    _refNode: null,
-    _id: null,
-    _customId: null,
-    _parentVNode: null,
-    _ctxVersion: null,
-    _lifecycle: "fresh"
+    activeElement: () => typeof document !== "undefined" ? document.activeElement : null,
+    byId: (id) => typeof document !== "undefined" ? document.getElementById(id) : null,
+    query: (sel) => typeof document !== "undefined" ? document.querySelector(sel) : null,
+    queryAll: (sel) => typeof document !== "undefined" ? document.querySelectorAll(sel) : null,
+    createElement: (tag) => typeof document !== "undefined" ? document.createElement(tag) : null,
+    createElementNS: (ns, tag) => typeof document !== "undefined" ? document.createElementNS(ns, tag) : null,
+    createDocumentFragment: () => typeof document !== "undefined" ? document.createDocumentFragment() : null,
+    createComment: (text) => typeof document !== "undefined" ? document.createComment(text) : null,
+    createTextNode: (text) => typeof document !== "undefined" ? document.createTextNode(text) : null,
+    addEventListener: (type, fn, options) => {
+      if (typeof window !== "undefined") window.addEventListener(type, fn, options);
+    },
+    removeEventListener: (type, fn, options) => {
+      if (typeof window !== "undefined") window.removeEventListener(type, fn, options);
+    },
+    scrollTo: (y) => {
+      if (typeof window !== "undefined") window.scrollTo(0, y);
+    },
+    matchMedia: (query) => typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia(query) : null,
+    visualViewport: () => {
+      const w = typeof window !== "undefined" ? window : null;
+      return w?.visualViewport ?? null;
+    },
+    scrollingElement: () => typeof document !== "undefined" ? document.scrollingElement : null,
+    bodyElement: () => typeof document !== "undefined" ? document.body : null,
+    bodyAppend: (el) => {
+      if (typeof document !== "undefined") document.body.appendChild(el);
+    },
+    bodyRemove: (el) => {
+      if (typeof document !== "undefined" && el.parentNode) document.body.removeChild(el);
+    },
+    clearBody: () => {
+      if (typeof document !== "undefined") document.body.innerHTML = "";
+    },
+    event: (type, init) => {
+      const w = typeof window !== "undefined" ? window : null;
+      const Ctor = init && (init.key || init.code) ? "KeyboardEvent" : init && (init.clientX !== void 0 || init.clientY !== void 0 || init.pointerId !== void 0) ? "PointerEvent" : "Event";
+      try {
+        return new w[Ctor](type, init);
+      } catch {
+        return new w.Event(type, init);
+      }
+    },
+    dispatchEvent: (target, evt) => typeof target !== "undefined" ? target.dispatchEvent(evt) : false,
+    reload: () => {
+      if (typeof window !== "undefined") window.location.reload();
+    },
+    navigate: (url) => {
+      if (typeof window === "undefined") return;
+      window.history.pushState(null, "", url);
+      window.dispatchEvent(new PopStateEvent("popstate", { state: null }));
+    },
+    downloadFile: (filename, content, mime = "text/plain") => {
+      try {
+        if (typeof document === "undefined" || typeof URL === "undefined" || !URL.createObjectURL) return false;
+        const blob = new Blob([content], { type: mime });
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = url;
+        a.download = filename;
+        document.body.appendChild(a);
+        a.click();
+        document.body.removeChild(a);
+        setTimeout(() => URL.revokeObjectURL(url), 1e3);
+        return true;
+      } catch {
+        return false;
+      }
+    },
+    copyText: async (text) => {
+      const w = typeof window !== "undefined" ? window : null;
+      if (w?.navigator?.clipboard?.writeText) {
+        try {
+          await w.navigator.clipboard.writeText(text);
+          return true;
+        } catch {
+        }
+      }
+      try {
+        if (typeof document === "undefined") return false;
+        const ta = document.createElement("textarea");
+        ta.value = text;
+        ta.style.position = "fixed";
+        ta.style.opacity = "0";
+        document.body.appendChild(ta);
+        ta.select();
+        const ok2 = document.execCommand("copy");
+        document.body.removeChild(ta);
+        return ok2;
+      } catch {
+        return false;
+      }
+    },
+    execCommand: (cmd, value) => typeof document !== "undefined" ? document.execCommand(cmd, false, value) : false,
+    queryCommandState: (cmd) => typeof document !== "undefined" ? document.queryCommandState(cmd) : false,
+    queryCommandValue: (cmd) => typeof document !== "undefined" ? document.queryCommandValue(cmd) : "",
+    selectionText: () => typeof window !== "undefined" ? window.getSelection?.()?.toString() ?? null : null,
+    getSelection: () => typeof window !== "undefined" ? window.getSelection() : null,
+    viewportHeight: () => typeof window !== "undefined" ? window.innerHeight : 0,
+    viewportWidth: () => typeof window !== "undefined" ? window.innerWidth : 0,
+    pathname: () => typeof window !== "undefined" ? window.location.pathname : "",
+    createTreeWalker: (root, whatToShow) => typeof document !== "undefined" ? document.createTreeWalker(root, whatToShow ?? NodeFilter.SHOW_ALL) : null,
+    scrollTop: () => {
+      const d = typeof document !== "undefined" ? document : null;
+      const w = typeof window !== "undefined" ? window : null;
+      return d?.scrollingElement?.scrollTop ?? w?.scrollY ?? 0;
+    },
+    hash: () => typeof window !== "undefined" ? window.location?.hash ?? "" : "",
+    setHash: (h2) => {
+      if (typeof window !== "undefined") window.location.hash = h2;
+    },
+    timeout: (fn, ms) => typeof window !== "undefined" ? window.setTimeout(fn, ms) : 0,
+    rootElement: () => typeof document !== "undefined" ? document.documentElement : null,
+    storageGet: (key) => {
+      try {
+        return typeof window !== "undefined" ? window.localStorage?.getItem(key) ?? null : null;
+      } catch {
+        return null;
+      }
+    },
+    storageSet: (key, value) => {
+      try {
+        if (typeof window !== "undefined") window.localStorage?.setItem(key, value);
+      } catch {
+      }
+    }
   };
 }
-function createVNode(type, props, key = null) {
-  if (type === Fragment) {
-    const v2 = { ...base(type, props, key), type };
-    return v2;
+
+// src/ui-dom/vdom3/comp-index.ts
+var compIndex = /* @__PURE__ */ new Map();
+function indexComponent(v) {
+  if (v._id) compIndex.set(v._id, v);
+}
+
+// src/ui-dom/vdom3/app.ts
+var appRegistry = /* @__PURE__ */ new Map();
+function getAppFactory(appId) {
+  return appRegistry.get(appId) ?? null;
+}
+
+// src/ui-dom/hooks/external.ts
+function useExternal(env, store) {
+  const id = env.selfId();
+  let unsub;
+  if (id) {
+    unsub = store.subscribe(() => env.render([id]));
+    env.onUnmount(() => unsub?.());
   }
-  if (type === Portal) {
-    const v2 = { ...base(type, props, key), type, _remoteEl: null, _placement: "remote" };
-    return v2;
+  return store;
+}
+
+// src/ui-dom/hooks/input.ts
+function useControlled(env, options) {
+  const selfId = env.selfId();
+  const controlled = options.value !== void 0;
+  if (controlled && !options.onChange && options.name) {
+    if (!env.warned.has(options.name)) {
+      env.warned.add(options.name);
+      console.warn(
+        `[weifuwu/${options.name}] \u53D7\u63A7\u6A21\u5F0F\uFF08value \u5DF2\u4F20\uFF09\u4F46\u672A\u63D0\u4F9B onChange\uFF0C\u4EA4\u4E92\u65E0\u6CD5\u751F\u6548\u3002
+\u975E\u53D7\u63A7\uFF1A\u53BB\u6389 value\uFF1B\u53D7\u63A7\uFF1A\u4F20\u5165 onChange={(v) => setValue(v)}`
+      );
+    }
   }
-  if (typeof type === "function") {
-    const v2 = { ...base(type, props, key), type, _render: null, _outputChild: null };
-    return v2;
+  if (!controlled && selfId && !env.uncontrolledValues.has(selfId)) {
+    env.uncontrolledValues.set(selfId, options.value);
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        env.uncontrolledValues.delete(selfId);
+        unsub();
+      }
+    });
   }
-  const v = { ...base(type, props, key), type, el: null };
-  return v;
+  const setValue = (v) => {
+    if (controlled) {
+      options.onChange?.(v);
+      return;
+    }
+    if (selfId) env.uncontrolledValues.set(selfId, v);
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  return {
+    value: controlled ? options.value : selfId ? env.uncontrolledValues.get(selfId) : options.value,
+    setValue,
+    controlled
+  };
 }
-
-// src/ui-dom/vdom2/kind.ts
-function classifyKind(v) {
-  if (v == null || typeof v === "boolean") return "hole";
-  if (typeof v === "string" || typeof v === "number") return "text";
-  if (Array.isArray(v)) return "arr";
-  const vn = v;
-  if (isFrag(vn)) return "frag";
-  if (isPortal(vn)) return "portal";
-  if (isComp(vn)) return "comp";
-  return "native";
+function useControlledInput(env, options) {
+  const selfId = env.selfId();
+  const ctrl = useControlled(env, { value: options.value, onChange: options.onChange, name: options.name });
+  if (selfId && !env.inputStates.has(selfId)) {
+    env.inputStates.set(selfId, { keyword: "", selectedLabel: "" });
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        env.inputStates.delete(selfId);
+        unsub();
+      }
+    });
+  }
+  const state = selfId ? env.inputStates.get(selfId) : { keyword: "", selectedLabel: "" };
+  const dirty = () => {
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  return {
+    ...ctrl,
+    get keyword() {
+      return state.keyword;
+    },
+    setKeyword(v) {
+      state.keyword = v;
+      dirty();
+    },
+    get selectedLabel() {
+      return state.selectedLabel;
+    },
+    setSelectedLabel(v) {
+      state.selectedLabel = v;
+      dirty();
+    }
+  };
+}
+function useAsync(env, fetcher) {
+  const selfId = env.selfId();
+  let disposed = false;
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        disposed = true;
+        unsub();
+      }
+    });
+  }
+  const render = () => {
+    if (disposed) return;
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  const state = { data: void 0, loading: false, error: void 0 };
+  let token = 0;
+  const run = () => {
+    const cur = ++token;
+    state.loading = true;
+    state.error = null;
+    render();
+    Promise.resolve().then(() => fetcher()).then((d) => {
+      if (token === cur) {
+        state.data = d;
+        state.loading = false;
+        render();
+      }
+    }).catch((e) => {
+      if (token === cur) {
+        state.error = e;
+        state.loading = false;
+        render();
+      }
+    });
+  };
+  run();
+  state.reload = run;
+  return state;
 }
 
-// src/ui-dom/vdom2/ctx.ts
-function componentName(type) {
-  return typeof type === "function" ? type.name || "anonymous" : "anonymous";
+// src/ui-dom/vdom3/delegate.ts
+var handlers = /* @__PURE__ */ new Map();
+var roots = /* @__PURE__ */ new Set();
+var registered = /* @__PURE__ */ new Map();
+var rootListeners = /* @__PURE__ */ new Map();
+var globalHandlers = /* @__PURE__ */ new Map();
+var globalRoots = /* @__PURE__ */ new Map();
+var EVENT_MAP = {
+  focus: "focusin",
+  blur: "focusout"
+};
+var NON_BUBBLING = /* @__PURE__ */ new Set(["error", "load", "loadstart", "loadend", "abort", "unload", "resize", "message"]);
+var TEXT_INPUT_EVENTS = /* @__PURE__ */ new Set(["input", "change", "compositionstart", "compositionend"]);
+function bindEvent(nodeId, event, handler, once = false) {
+  let m = handlers.get(event);
+  if (!m) {
+    m = /* @__PURE__ */ new Map();
+    handlers.set(event, m);
+  }
+  m.set(nodeId, { handler, once });
+}
+function unbindEvent(nodeId, event) {
+  if (handlers.get(event)?.delete(nodeId)) {
+    stream.emit(ev("event", "unbind", nodeId, { event }));
+  }
+}
+function bindElementListener(el, event, handler, once = false) {
+  const id = el.getAttribute("data-v3-id");
+  if (!id) return () => {
+  };
+  bindEvent(id, event, handler, once);
+  const root = rootOf(el);
+  if (root) ensureRootEvent(root, event);
+  return () => unbindEvent(id, event);
+}
+function rootOf(node) {
+  let el = node;
+  while (el) {
+    if (el.nodeType === 1 && roots.has(el)) return el;
+    el = el.parentNode;
+  }
+  return null;
+}
+function ensureRootEvent(root, event) {
+  const set = registered.get(root) ?? /* @__PURE__ */ new Set();
+  if (set.has(event)) return;
+  set.add(event);
+  registered.set(root, set);
+  const realEvent = EVENT_MAP[event] ?? event;
+  const fn = (e) => dispatch(e);
+  const useCapture = NON_BUBBLING.has(realEvent);
+  root.addEventListener(realEvent, fn, useCapture ? { capture: true } : void 0);
+  const m = rootListeners.get(root) ?? /* @__PURE__ */ new Map();
+  m.set(realEvent, fn);
+  rootListeners.set(root, m);
+  const rootId = root.hasAttribute("data-wf-portal-key") ? `portal:${root.getAttribute("data-wf-portal-key")}` : "root";
+  stream.emit(ev("event", "bind", rootId, { event: realEvent, delegated: true }));
+}
+function addGlobalListener(target, event, handler, opts) {
+  const realEvent = EVENT_MAP[event] ?? event;
+  let set = globalHandlers.get(realEvent);
+  if (!set) {
+    set = /* @__PURE__ */ new Set();
+    globalHandlers.set(realEvent, set);
+  }
+  set.add(handler);
+  const rootMap = globalRoots.get(target) ?? /* @__PURE__ */ new Map();
+  if (!rootMap.has(realEvent)) {
+    const fn = (e) => {
+      for (const h2 of globalHandlers.get(realEvent) ?? []) {
+        try {
+          h2(e);
+        } catch {
+        }
+      }
+    };
+    const addOpts = opts?.capture ? { capture: true, passive: opts?.passive ?? false } : void 0;
+    target.addEventListener(realEvent, fn, addOpts);
+    rootMap.set(realEvent, fn);
+    globalRoots.set(target, rootMap);
+    stream.emit(ev("event", "bind", target === window ? "window" : "document", { event: realEvent, delegated: true, capture: opts?.capture ?? false }));
+  }
+  return () => {
+    set.delete(handler);
+    if (set.size === 0) {
+      const fn = rootMap.get(realEvent);
+      if (fn) target.removeEventListener(realEvent, fn, opts?.capture ? { capture: true } : void 0);
+      rootMap.delete(realEvent);
+      if (rootMap.size === 0) globalRoots.delete(target);
+      stream.emit(ev("event", "unbind", target === window ? "window" : "document", { event: realEvent }));
+    }
+  };
+}
+function dispatch(e) {
+  let el = e.target;
+  if (el && el.nodeType === 3) el = el.parentElement;
+  const m = handlers.get(e.type);
+  if (!m) return;
+  while (el) {
+    if (!el.hasAttribute?.("data-v3-id")) {
+      const idEl = el.closest?.("[data-v3-id]");
+      if (idEl && idEl !== el) {
+        el = idEl;
+        continue;
+      }
+    }
+    const id = el.getAttribute?.("data-v3-id");
+    if (id) {
+      const entry = m.get(id);
+      if (entry) {
+        try {
+          Object.defineProperty(e, "currentTarget", { value: el, configurable: true });
+        } catch {
+        }
+        try {
+          entry.handler(e);
+        } catch {
+        }
+        if (TEXT_INPUT_EVENTS.has(e.type)) {
+          const value = el?.value ?? null;
+          stream.emit(ev("text", "input", id, { event: e.type, value: typeof value === "string" ? value.slice(0, 100) : null }));
+        }
+        if (entry.once) {
+          m.delete(id);
+          stream.emit(ev("event", "unbind", id, { event: e.type }));
+        }
+        if (e.cancelBubble) break;
+      }
+    }
+    el = el.parentElement;
+  }
 }
 
-// src/ui-dom/vdom2/transform.ts
-function holeDetail(v) {
-  if (v === false) return "false";
-  if (v === null) return "null";
-  if (v === void 0) return "undefined";
-  if (v === true) return "true";
-  if (typeof v === "object") {
-    try {
-      const s = JSON.stringify(v);
-      const d = s != null && s.length > 80 ? s.slice(0, 80) + "\u2026" : s ?? "";
-      return `object ${d}`;
-    } catch {
-      return `object ${Object.prototype.toString.call(v)}`;
+// src/ui-dom/hooks/stable.ts
+function useStableRef(_env, init, cleanup) {
+  const ref = (el) => {
+    if (el) init(el);
+    else cleanup?.();
+  };
+  return ref;
+}
+function useHoverCapable(env) {
+  return typeof window !== "undefined" && !!window.matchMedia?.("(hover: hover)").matches;
+}
+function useReducedMotion(_env) {
+  return typeof window !== "undefined" && !!window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+}
+function useLongPress(env, options) {
+  const { onLongPress, duration = 500 } = options;
+  let timer;
+  let startX = 0;
+  let startY = 0;
+  let startEvent = null;
+  const clear = () => {
+    clearTimeout(timer);
+    timer = void 0;
+  };
+  const selfId = env.selfId();
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        clear();
+        unsub();
+      }
+    });
+  }
+  return {
+    onPointerDown: (e) => {
+      startX = e.clientX ?? 0;
+      startY = e.clientY ?? 0;
+      startEvent = e;
+      clear();
+      timer = setTimeout(() => {
+        timer = void 0;
+        if (startEvent) onLongPress(startEvent);
+      }, duration);
+    },
+    onPointerUp: clear,
+    onPointerLeave: clear,
+    onPointerMove: (e) => {
+      const dx = Math.abs((e.clientX ?? 0) - startX);
+      const dy = Math.abs((e.clientY ?? 0) - startY);
+      if (dx > 10 || dy > 10) clear();
+    },
+    onContextMenu: (e) => {
+      e.preventDefault();
+      onLongPress(e);
+    }
+  };
+}
+function usePresence(env, options) {
+  void options;
+  const selfId = env.selfId();
+  let phase = "closed";
+  let animEndHandler;
+  const finishExit = () => {
+    phase = "closed";
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  let animEndOff = null;
+  const ref = (el) => {
+    if (el) {
+      if (!animEndOff) {
+        animEndHandler = () => {
+          if (phase === "exit") finishExit();
+        };
+        animEndOff = bindElementListener(el, "animationend", animEndHandler);
+      }
+    } else {
+      animEndOff?.();
+      animEndOff = null;
+      animEndHandler = void 0;
+    }
+  };
+  return {
+    get phase() {
+      return phase;
+    },
+    ref,
+    sync: (open2) => {
+      if (open2) phase = "open";
+      else if (phase === "open") phase = "exit";
+      return phase;
+    }
+  };
+}
+function useTween(env, target, opts) {
+  const selfId = env.selfId();
+  const reduced = useReducedMotion(env);
+  const duration = opts?.duration ?? 400;
+  const easeFn = opts?.ease === "linear" ? (p) => p : (p) => 1 - Math.pow(1 - p, 3);
+  let rafId;
+  let currentTarget = target;
+  const handle = {
+    value: reduced ? target : 0,
+    reset: () => {
     }
+  };
+  const rerender = () => {
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  const tweenTo = (to) => {
+    currentTarget = to;
+    if (reduced) {
+      handle.value = to;
+      rerender();
+      return;
+    }
+    if (to === handle.value) return;
+    if (rafId) cancelAnimationFrame(rafId);
+    const from = handle.value;
+    const t0 = performance.now();
+    const step = (t) => {
+      const p = Math.min(1, (t - t0) / duration);
+      handle.value = Math.round(from + (to - from) * easeFn(p));
+      if (p < 1) {
+        rafId = requestAnimationFrame(step);
+        rerender();
+      } else {
+        rafId = void 0;
+        rerender();
+      }
+    };
+    rafId = requestAnimationFrame(step);
+  };
+  handle.reset = (to) => {
+    if (to === currentTarget && rafId) return;
+    tweenTo(to);
+  };
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id !== selfId) return;
+      if (rafId) {
+        cancelAnimationFrame(rafId);
+        rafId = void 0;
+      }
+      unsub();
+    });
+  }
+  queueMicrotask(() => tweenTo(target));
+  return handle;
+}
+
+// src/ui-dom/popup.ts
+var browser = createClientBrowser();
+function computeFixedPosRect(rect, placement = "bottom", gap = 6, center = true) {
+  switch (placement) {
+    case "bottom":
+      return {
+        top: rect.bottom + gap,
+        left: center ? rect.left + rect.width / 2 : rect.left
+      };
+    case "top":
+      return {
+        top: rect.top - gap,
+        left: center ? rect.left + rect.width / 2 : rect.left
+      };
+    case "left":
+      return {
+        top: center ? rect.top + rect.height / 2 : rect.top,
+        left: rect.left - gap
+      };
+    case "right":
+      return {
+        top: center ? rect.top + rect.height / 2 : rect.top,
+        left: rect.right + gap
+      };
   }
-  return `bad-vnode type=${typeof v}`;
 }
-function quoteIfNeeded(s) {
-  return /[\s"=]/.test(s) ? `"${s.replace(/"/g, "'")}"` : s;
+function clampToViewport(pos, panel, margin = 8) {
+  if (!panel) return pos;
+  const r = panel.getBoundingClientRect();
+  if (r.width === 0 && r.height === 0) return pos;
+  const curTop = Number.parseFloat(panel.style.top) || r.top;
+  const curLeft = Number.parseFloat(panel.style.left) || r.left;
+  const dy = pos.top - curTop;
+  const dx = pos.left - curLeft;
+  const target = {
+    top: r.top + dy,
+    bottom: r.bottom + dy,
+    left: r.left + dx,
+    right: r.right + dx
+  };
+  const vw = browser.viewportWidth();
+  const vh = browser.viewportHeight();
+  let top = pos.top;
+  let left = pos.left;
+  if (target.bottom > vh - margin) top = Math.max(margin, top - (target.bottom - (vh - margin)));
+  if (target.top < margin) top = Math.max(margin, top + (margin - target.top));
+  if (target.right > vw - margin) left = Math.max(margin, left - (target.right - (vw - margin)));
+  if (target.left < margin) left = Math.max(margin, left + (margin - target.left));
+  return { top, left, width: pos.width };
+}
+
+// src/ui-dom/vdom3/jsx.ts
+function h(type, props, ...children) {
+  const p = props ? { ...props } : {};
+  if (children.length > 0) p.children = children.length === 1 ? children[0] : children;
+  return { type, props: p, key: props?.key ?? null };
 }
-function holeMarkup(opts) {
-  const parts = [`type=${opts.type}`];
-  if (opts.value !== void 0) parts.push(`value=${quoteIfNeeded(holeDetail(opts.value))}`);
-  if (opts.key != null) parts.push(`key=${quoteIfNeeded(opts.key)}`);
-  if (opts.id != null) parts.push(`id=${quoteIfNeeded(opts.id)}`);
-  if (opts.fid != null) parts.push(`fid=${quoteIfNeeded(opts.fid)}`);
-  return `wf-hole: ${parts.join(" ")}`;
+function createPortal(children, portalKey) {
+  return {
+    type: Portal,
+    props: { children: Array.isArray(children) ? children : [children], portalKey: portalKey ?? "default" },
+    key: portalKey ?? null
+  };
 }
-function ensureArrayKeys(children) {
-  for (let i = 0; i < children.length; i++) {
-    const c = children[i];
-    if (c != null && typeof c === "object" && !Array.isArray(c)) {
-      const v = c;
-      if (v.key !== null) v.key = String(v.key);
+
+// src/ui-dom/hooks/popup.ts
+function usePopupPosition(env, options) {
+  const selfId = env.selfId();
+  const pos = { top: 0, left: 0, refresh: () => {
+  } };
+  if (!selfId) return pos;
+  const tracker = {
+    pos,
+    getEl: options.el,
+    isOpen: options.isOpen,
+    compute: options.compute,
+    panel: options.panel,
+    margin: options.margin ?? 8
+  };
+  env.popupTrackers.set(selfId, tracker);
+  env.ensurePopupListeners();
+  const unsub = env.onUnmount((id) => {
+    if (id === selfId) {
+      env.popupTrackers.delete(selfId);
+      unsub();
+    }
+  });
+  pos.refresh = () => {
+    const el = tracker.getEl();
+    if (!el) return;
+    const r = el.getBoundingClientRect();
+    if (r.width === 0 && r.height === 0) return;
+    const p = tracker.compute(r);
+    Object.assign(pos, clampToViewport(p, tracker.panel?.(), tracker.margin));
+  };
+  return pos;
+}
+function usePopup(env, options) {
+  const selfId = env.selfId();
+  const b = env.browser;
+  const canHover = useHoverCapable(env);
+  const triggerOf = () => typeof options.trigger === "function" ? options.trigger() : options.trigger ?? "manual";
+  const controlled = options.open !== void 0;
+  const isDisabled = () => !!options.disabled?.();
+  const isOpen = () => {
+    if (!controlled) return options.isOpen();
+    return typeof options.open === "function" ? !!options.open() : !!options.open;
+  };
+  const presence = options.presence ? usePresence(env, { name: options.name }) : null;
+  let focusCleanup;
+  let wasLocked = false;
+  const sync = (open2) => {
+    if (!presence) return open2 ? "open" : "closed";
+    const p = presence.sync(open2);
+    if (open2 && options.lockScroll && !wasLocked) {
+      lockScroll();
+      wasLocked = true;
+    }
+    return p;
+  };
+  const setOpen = (v) => {
+    if (isDisabled()) return;
+    if (controlled) {
+      options.onOpenChange?.(v);
+    } else if (presence) {
+      if (v) sync(true);
+      else if (isOpen()) sync(false);
+    } else {
+      options.setOpen(v);
+    }
+  };
+  const placementOf = () => {
+    const p = options.placement;
+    return typeof p === "function" ? p() : p ?? "bottom";
+  };
+  let panelEl = null;
+  let prevOpen = false;
+  const pos = usePopupPosition(env, {
+    el: options.el ?? (() => null),
+    isOpen: () => isOpen(),
+    compute: (r) => {
+      if (options.position) {
+        const p = options.position();
+        return { top: p.y, left: p.x, width: p.width };
+      }
+      return computeFixedPosRect(r, placementOf(), options.gap ?? 6, options.center !== false);
+    },
+    panel: () => panelEl,
+    margin: options.margin ?? 8
+  });
+  const onDocMouseDown = (e) => {
+    if (options.closeOnOutside === false) return;
+    if (options.mask) return;
+    if (!isOpen()) return;
+    const target = e.target;
+    if (!(target instanceof Node)) return;
+    const el = options.el?.() ?? null;
+    if (el && el.contains(target)) return;
+    if (panelEl && panelEl.contains(target)) return;
+    setOpen(false);
+  };
+  const onDocKeyDown = (e) => {
+    if (options.closeOnEscape === false) return;
+    if (e.key !== "Escape" || !isOpen()) return;
+    setOpen(false);
+  };
+  const offMouse = addGlobalListener(b, "mousedown", onDocMouseDown);
+  const offKey = addGlobalListener(b, "keydown", onDocKeyDown);
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        offMouse();
+        offKey();
+        unsub();
+      }
+    });
+  }
+  const wrapProps = {};
+  const delayOf = (d) => typeof d === "function" ? d() : d ?? 0;
+  const openDelay = () => delayOf(options.openDelay);
+  const closeDelay = () => delayOf(options.closeDelay);
+  let openTimer;
+  let closeTimer;
+  const clearHoverTimers = () => {
+    clearTimeout(openTimer);
+    clearTimeout(closeTimer);
+    openTimer = void 0;
+    closeTimer = void 0;
+  };
+  const hoverOpen = (e) => {
+    if (isDisabled()) return;
+    const wrap = e.currentTarget;
+    const rt = e.relatedTarget;
+    if (wrap.contains(rt)) return;
+    clearTimeout(closeTimer);
+    closeTimer = void 0;
+    openTimer = setTimeout(() => {
+      openTimer = void 0;
+      setOpen(true);
+    }, openDelay());
+  };
+  const hoverClose = (e) => {
+    if (isDisabled()) return;
+    const wrap = e.currentTarget;
+    const rt = e.relatedTarget;
+    if (wrap.contains(rt)) return;
+    clearTimeout(openTimer);
+    openTimer = void 0;
+    closeTimer = setTimeout(() => {
+      closeTimer = void 0;
+      setOpen(false);
+    }, closeDelay());
+  };
+  const focusOpen = () => {
+    if (!isDisabled()) {
+      clearTimeout(closeTimer);
+      closeTimer = void 0;
+      openTimer = setTimeout(() => {
+        openTimer = void 0;
+        setOpen(true);
+      }, openDelay());
+    }
+  };
+  const blurClose = () => {
+    if (!isDisabled()) {
+      clearTimeout(openTimer);
+      openTimer = void 0;
+      closeTimer = setTimeout(() => {
+        closeTimer = void 0;
+        setOpen(false);
+      }, closeDelay());
+    }
+  };
+  const isHover = () => triggerOf() === "hover";
+  wrapProps.onMouseOver = (e) => {
+    if (isHover()) hoverOpen(e);
+  };
+  wrapProps.onMouseOut = (e) => {
+    if (isHover()) hoverClose(e);
+  };
+  wrapProps.onClick = () => {
+    if (isHover()) {
+      if (!canHover) setOpen(!isOpen());
+    } else if (triggerOf() === "click") {
+      setOpen(true);
+    }
+  };
+  wrapProps.onFocus = () => {
+    if (isHover()) focusOpen();
+    else if (triggerOf() === "focus") {
+      clearTimeout(closeTimer);
+      closeTimer = void 0;
+      setOpen(true);
+    }
+  };
+  wrapProps.onBlur = () => {
+    if (isHover()) blurClose();
+    else if (triggerOf() === "focus") {
+      clearTimeout(openTimer);
+      openTimer = void 0;
+      closeTimer = setTimeout(() => {
+        closeTimer = void 0;
+        setOpen(false);
+      }, closeDelay());
+    }
+  };
+  if (triggerOf() === "longpress") {
+    let timer;
+    let startX = 0;
+    let startY = 0;
+    const clear = () => {
+      clearTimeout(timer);
+      timer = void 0;
+    };
+    wrapProps.onPointerDown = (e) => {
+      if (isDisabled()) return;
+      startX = e.clientX ?? 0;
+      startY = e.clientY ?? 0;
+      clear();
+      timer = setTimeout(() => {
+        timer = void 0;
+        options.onTrigger?.({ clientX: startX, clientY: startY });
+        setOpen(true);
+      }, options.longPressDuration ?? 500);
+    };
+    wrapProps.onPointerUp = clear;
+    wrapProps.onPointerLeave = clear;
+    wrapProps.onPointerMove = (e) => {
+      const dx = Math.abs((e.clientX ?? 0) - startX);
+      const dy = Math.abs((e.clientY ?? 0) - startY);
+      if (dx > 10 || dy > 10) clear();
+    };
+    wrapProps.onContextMenu = (e) => {
+      e.preventDefault();
+      options.onTrigger?.({ clientX: e.clientX ?? 0, clientY: e.clientY ?? 0 });
+      setOpen(true);
+    };
+  }
+  wrapProps.onKeyDown = (e) => {
+    if (e.key === "Escape" && options.closeOnEscape !== false) setOpen(false);
+  };
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        clearHoverTimers();
+        unsub();
+      }
+    });
+  }
+  const panelRef = (el) => {
+    if (el) {
+      panelEl = el;
+      const settle = () => pos.refresh();
+      bindElementListener(el, "animationend", settle, true);
+    } else {
+      panelEl = null;
+    }
+  };
+  let lastEl = null;
+  let latestContentRef = null;
+  const portalPanelRef = (el) => {
+    panelRef(el);
+    if (latestContentRef) latestContentRef(el);
+    presence?.ref(el);
+    if (options.trapFocus) {
+      if (el) focusCleanup = trapFocus(el);
+      else {
+        focusCleanup?.();
+        focusCleanup = void 0;
+      }
+    }
+    if (options.lockScroll && !el && wasLocked) {
+      unlockScroll();
+      wasLocked = false;
     }
+  };
+  const portal = (content, portalKey = "popover") => {
+    if (isDisabled()) return null;
+    const now = presence ? presence.phase !== "closed" : isOpen();
+    if (!now) {
+      prevOpen = false;
+      lastEl = null;
+      return null;
+    }
+    const el = options.el?.() ?? null;
+    if (!prevOpen || el !== lastEl) {
+      if (el) {
+        pos.refresh();
+      } else {
+        queueMicrotask(() => {
+          if (isOpen()) pos.refresh();
+        });
+      }
+      prevOpen = true;
+      lastEl = el;
+    }
+    const props = content.props ?? {};
+    latestContentRef = props.ref ?? null;
+    const cls = options.positioning === "none" ? props.class ?? "" : ["wf-popup", props.class].filter(Boolean).join(" ");
+    const style = options.positioning === "none" ? { ...props.style ?? {}, position: "fixed" } : {
+      ...props.style ?? {},
+      position: "fixed",
+      top: `${pos.top}px`,
+      left: `${pos.left}px`,
+      ...pos.width !== void 0 ? { width: `${pos.width}px` } : {},
+      maxWidth: (() => {
+        const w = typeof options.width === "function" ? options.width() : options.width;
+        return w !== void 0 ? `min(${w}px, calc(100vw - 32px))` : "calc(100vw - 32px)";
+      })()
+    };
+    const panel = {
+      ...content,
+      props: {
+        ...props,
+        class: cls,
+        style,
+        ref: portalPanelRef
+      }
+    };
+    if (options.mask) {
+      const maskEl = typeof options.mask === "object" ? options.mask : h("div", {
+        class: "wf-popup-mask",
+        "data-portal-mask": portalKey,
+        onClick: options.maskClosable === false ? void 0 : () => setOpen(false)
+      });
+      const centeredWrap = options.maskCentered ? h("div", {
+        // layout 原语 .wf-cover：全屏居中（AGENTS.md §8 先查框架原语）
+        class: "wf-cover",
+        style: { "--wf-z": "var(--wf-z-popover)", pointerEvents: "none" }
+      }, {
+        ...panel,
+        props: {
+          ...panel.props,
+          style: { ...props.style ?? {}, pointerEvents: "auto" },
+          ref: portalPanelRef
+        }
+      }) : null;
+      const maskStyle = options.maskCentered ? void 0 : { ...panel.props?.style ?? {}, zIndex: "var(--wf-z-popover)" };
+      const maskedPanel = options.maskCentered ? centeredWrap : {
+        ...panel,
+        props: {
+          ...panel.props,
+          style: maskStyle
+        }
+      };
+      return createPortal([maskEl, maskedPanel], portalKey);
+    }
+    return createPortal(panel, portalKey);
+  };
+  return {
+    get open() {
+      return isOpen();
+    },
+    setOpen,
+    get phase() {
+      return presence ? presence.phase : isOpen() ? "open" : "closed";
+    },
+    sync,
+    wrapProps,
+    portal,
+    refresh: () => pos.refresh()
+  };
+}
+function useOpen(env, options) {
+  const selfId = env.selfId();
+  if (selfId && !env.openStates.has(selfId)) {
+    env.openStates.set(selfId, false);
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        env.openStates.delete(selfId);
+        unsub();
+      }
+    });
+  }
+  const controlled = options.open !== void 0;
+  if (controlled && !options.onOpenChange && options.name && !env.warned.has(options.name)) {
+    env.warned.add(options.name);
+    console.warn(
+      `[weifuwu/${options.name}] \u53D7\u63A7\u6A21\u5F0F\uFF08open \u5DF2\u4F20\uFF09\u4F46\u672A\u63D0\u4F9B onOpenChange\uFF0C\u4EA4\u4E92\u65E0\u6CD5\u751F\u6548\u3002
+\u975E\u53D7\u63A7\uFF1A\u53BB\u6389 open\uFF1B\u53D7\u63A7\uFF1A\u4F20\u5165 onOpenChange={(o) => setOpen(o)}`
+    );
   }
+  const isOpen = () => controlled ? !!options.open : selfId ? env.openStates.get(selfId) ?? false : false;
+  const dirty = () => {
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  const setOpen = (v) => {
+    if (controlled) {
+      options.onOpenChange?.(v);
+      return;
+    }
+    if (selfId) env.openStates.set(selfId, v);
+    dirty();
+  };
+  return {
+    get open() {
+      return isOpen();
+    },
+    setOpen,
+    triggerProps: {
+      onClick: () => setOpen(true),
+      onFocus: () => {
+        if (options.openOnFocus) setOpen(true);
+      }
+    }
+  };
+}
+var _browser = createClientBrowser();
+var lockedCount = 0;
+var originalOverflow = "";
+var originalPosition = "";
+var originalTop = "";
+var originalWidth = "";
+var scrollY = 0;
+function canLock() {
+  return typeof window !== "undefined" && typeof document !== "undefined";
+}
+function lockScroll() {
+  lockedCount++;
+  stream.emit(ev("effect", "lock", void 0, { depth: lockedCount }));
+  if (lockedCount > 1) return;
+  if (!canLock()) return;
+  scrollY = _browser.scrollTop();
+  const body = _browser.bodyElement();
+  originalOverflow = body.style.overflow;
+  originalPosition = body.style.position;
+  originalTop = body.style.top;
+  originalWidth = body.style.width;
+  body.style.overflow = "hidden";
+  const isIOS = /iPhone|iPad|iPod/.test(navigator.platform) || /Mac/.test(navigator.platform) && "ontouchend" in document;
+  if (isIOS) {
+    body.style.position = "fixed";
+    body.style.top = `-${scrollY}px`;
+    body.style.width = "100%";
+  }
+}
+function unlockScroll() {
+  if (lockedCount === 0) return;
+  lockedCount--;
+  stream.emit(ev("effect", "unlock", void 0, { depth: lockedCount }));
+  if (lockedCount > 0) return;
+  if (!canLock()) return;
+  const body = _browser.bodyElement();
+  body.style.overflow = originalOverflow;
+  body.style.position = originalPosition;
+  body.style.top = originalTop;
+  body.style.width = originalWidth;
+  if (scrollY > 0) _browser.scrollTo(scrollY);
+}
+var FOCUSABLE = 'a[href], button:not([disabled]), input:not([disabled]), textarea:not([disabled]), select:not([disabled]), [tabindex]:not([tabindex="-1"])';
+function trapFocus(container) {
+  let cleanup;
+  queueMicrotask(() => {
+    const focusable = container.querySelectorAll(FOCUSABLE);
+    if (focusable.length === 0) return;
+    const first = focusable[0];
+    const last = focusable[focusable.length - 1];
+    const handler = (e) => {
+      if (e.key !== "Tab") return;
+      if (e.shiftKey && _browser.activeElement() === first) {
+        e.preventDefault();
+        last.focus();
+      } else if (!e.shiftKey && _browser.activeElement() === last) {
+        e.preventDefault();
+        first.focus();
+      }
+    };
+    const prevFocused = _browser.activeElement();
+    stream.emit(ev("effect", "focus", void 0, { mode: "trap-start" }));
+    first.focus();
+    const offKey = addGlobalListener(container, "keydown", handler);
+    cleanup = () => {
+      offKey();
+      stream.emit(ev("effect", "focus", void 0, { mode: "restore" }));
+      prevFocused?.focus();
+    };
+  });
+  return () => cleanup?.();
 }
-var ENUMERATED_VALUE_BASED = /* @__PURE__ */ new Set(["draggable", "contenteditable", "spellcheck", "translate"]);
 
-// src/ui-dom/vdom2/x2html.ts
-function escape(s) {
-  return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+// src/ui-dom/hooks/media.ts
+function useMedia(env, query, callback) {
+  const selfId = env.selfId();
+  const b = env.browser;
+  const key = `media:${selfId}:${query}`;
+  if (!env.mediaRegistry.has(key)) {
+    const mql = b.matchMedia(query);
+    callback(mql.matches);
+    const handler = (e) => callback(e.matches);
+    addGlobalListener(mql, "change", handler);
+    env.mediaRegistry.set(key, { mql, handler });
+    const unsub = env.onUnmount((id) => {
+      if (id !== selfId) return;
+      const item = env.mediaRegistry.get(key);
+      if (item?.mql && item.handler) {
+        try {
+          item.mql.removeEventListener("change", item.handler);
+        } catch (e) {
+        }
+      }
+      env.mediaRegistry.delete(key);
+      unsub();
+    });
+  }
 }
-function classToString(v) {
-  if (typeof v === "string") return v;
-  if (Array.isArray(v)) return v.filter(Boolean).join(" ");
-  if (v && typeof v === "object") return Object.entries(v).filter(([, on]) => on).map(([k]) => k).join(" ");
-  return "";
+function useBreakpoint(env, bpsOrCallback, callback) {
+  const b = env.browser;
+  const bps = typeof bpsOrCallback === "function" ? { mobile: "(max-width: 639px)", tablet: "(min-width: 640px) and (max-width: 1023px)", desktop: "(min-width: 1024px)" } : bpsOrCallback;
+  const cb = typeof bpsOrCallback === "function" ? bpsOrCallback : callback;
+  const selfId = env.selfId();
+  const key = `bp:${selfId}`;
+  function evaluate() {
+    for (const [name, query] of Object.entries(bps)) {
+      if (b.matchMedia(query).matches) return name;
+    }
+    return Object.keys(bps)[0] ?? "";
+  }
+  if (!env.mediaRegistry.has(key)) {
+    cb(evaluate());
+    const mqls = [];
+    for (const query of Object.values(bps)) {
+      const mql = b.matchMedia(query);
+      const handler = () => cb(evaluate());
+      addGlobalListener(mql, "change", handler);
+      mqls.push({ mql, handler });
+    }
+    env.mediaRegistry.set(key, { mqls });
+    const unsub = env.onUnmount((id) => {
+      if (id !== selfId) return;
+      const item = env.mediaRegistry.get(key);
+      if (item?.mqls) {
+        for (const m of item.mqls) {
+          try {
+            m.mql.removeEventListener("change", m.handler);
+          } catch (e) {
+          }
+        }
+      }
+      env.mediaRegistry.delete(key);
+      unsub();
+    });
+  }
 }
-function styleToString(v) {
-  return Object.entries(v).filter(([, val]) => val != null && val !== false).map(([k, val]) => `${k}:${typeof val === "number" ? val : String(val)}`).join(";");
+function useVisualViewport(env) {
+  const selfId = env.selfId();
+  const b = env.browser;
+  const handle = {
+    height: b.viewportHeight(),
+    offsetTop: 0,
+    keyboardOpen: false
+  };
+  const dirty = () => {
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  const update = () => {
+    const vv2 = b.visualViewport();
+    handle.height = vv2?.height ?? b.viewportHeight();
+    handle.offsetTop = vv2?.offsetTop ?? 0;
+    handle.keyboardOpen = handle.height < b.viewportHeight() * 0.9;
+    dirty();
+  };
+  const vv = b.visualViewport();
+  let offVv = null;
+  let offWin = null;
+  if (vv?.addEventListener) {
+    offVv = addGlobalListener(vv, "resize", update);
+    addGlobalListener(vv, "scroll", update);
+  } else {
+    offWin = addGlobalListener(window, "resize", update);
+  }
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id !== selfId) return;
+      offVv?.();
+      offWin?.();
+      unsub();
+    });
+  }
+  return handle;
 }
-var VOID_TAGS = /* @__PURE__ */ new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
-var SVG_TAGS = /* @__PURE__ */ new Set(["svg", "path", "circle", "rect", "line", "polyline", "polygon", "g", "text", "defs", "use", "clipPath"]);
-async function x2html(input, ctx) {
-  return TO_HTML[classifyKind(input)](input, ctx);
+function useInView(env, options) {
+  const selfId = env.selfId();
+  const handle = {
+    isIn: false,
+    ready: false,
+    observe,
+    refresh,
+    disconnect
+  };
+  let el = null;
+  let io = null;
+  const dirty = () => {
+    if (selfId) env.render([selfId]);
+    else env.render();
+  };
+  function createIO() {
+    io?.disconnect();
+    io = null;
+    if (!el) return;
+    const rm = typeof options.rootMargin === "function" ? options.rootMargin() : options.rootMargin;
+    const th = typeof options.threshold === "function" ? options.threshold() : options.threshold;
+    io = new IntersectionObserver((entries) => {
+      const entry = entries[entries.length - 1];
+      if (!entry) return;
+      const next = entry.isIntersecting;
+      const changed = next !== handle.isIn;
+      const wasFirst = !handle.ready;
+      handle.isIn = next;
+      handle.ready = true;
+      options.onChange?.(entry, next);
+      if (changed || wasFirst) dirty();
+    }, {
+      root: options.root ? options.root() : null,
+      rootMargin: rm ?? "0px",
+      threshold: th ?? 0
+    });
+    io.observe(el);
+  }
+  function observe(target) {
+    el = target;
+    if (target) {
+      createIO();
+    } else {
+      io?.disconnect();
+      io = null;
+      handle.isIn = false;
+    }
+  }
+  function refresh() {
+    createIO();
+  }
+  function disconnect() {
+    io?.disconnect();
+    io = null;
+  }
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        disconnect();
+        unsub();
+      }
+    });
+  }
+  return handle;
 }
-async function holeToHtml(v, ctx) {
-  return "";
+function useScrollPosition(env, options) {
+  const selfId = env.selfId();
+  const b = env.browser;
+  const handle = {
+    y: 0,
+    refresh() {
+      const scroller = tracker.getScroller();
+      handle.y = scroller instanceof Window ? b.scrollingElement()?.scrollTop ?? b.scrollTop() : scroller.scrollTop ?? 0;
+    }
+  };
+  const tracker = {
+    handle,
+    getScroller: options.getScroller ?? (() => window)
+  };
+  if (!selfId) {
+    handle.refresh();
+    return handle;
+  }
+  env.scrollTrackers.set(selfId, tracker);
+  env.ensurePopupListeners();
+  handle.refresh();
+  const unsub = env.onUnmount((id) => {
+    if (id === selfId) {
+      env.scrollTrackers.delete(selfId);
+      unsub();
+    }
+  });
+  return handle;
 }
-async function textToHtml(v, ctx) {
-  return escape(String(v));
+
+// src/ui-dom/hooks/events.ts
+function useGlobalKey(env, handler) {
+  const selfId = env.selfId();
+  if (typeof window === "undefined") return () => {
+  };
+  const off = addGlobalListener(window, "keydown", handler);
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        off();
+        unsub();
+      }
+    });
+  }
+  return off;
 }
-function childHtmlKind(c) {
-  if (c == null || typeof c === "boolean") return "hole";
-  if (Array.isArray(c)) return "arr";
-  return "vnode";
-}
-var CHILD_HTML = {
-  /** 占位：wf-hole 注释（与客户端 renderArray 同构——数组项槽位必须有节点） */
-  hole: (c) => Promise.resolve(`<!--${holeMarkup({ type: "hole", value: c, key: null, id: null, fid: null })}-->`),
-  /** 嵌套数组项 = 隐式 Fragment：fragment-start/end 标记 + 内容（fid 传递——配对精确） */
-  arr: async (c, ctx, i, childFid) => {
-    const inner = await x2html(c, { ...ctx, _fidPath: childFid });
-    return `<!--${holeMarkup({ type: "fragment-start", key: String(i), id: null, fid: childFid })}-->${inner}<!--${holeMarkup({ type: "fragment-end", key: String(i), id: null, fid: childFid })}-->`;
-  },
-  /** 普通项：递归 x2html；组件输出 null（渲染层无输出）→ 占位注释（与客户端 renderArray 同构） */
-  vnode: async (c, ctx) => {
-    const html = await x2html(c, ctx);
-    return html === "" ? `<!--${holeMarkup({ type: "hole", value: null, key: null, id: null, fid: null })}-->` : html;
+function useDrag(env, options) {
+  const b = env.browser;
+  let startX = 0;
+  let startY = 0;
+  let active = false;
+  const onPointerMove = (e) => {
+    if (!active) return;
+    options.onMove(e, { x: e.clientX - startX, y: e.clientY - startY });
+  };
+  let moveOff = null;
+  let upOff = null;
+  const releasePointers = () => {
+    moveOff?.();
+    moveOff = null;
+    upOff?.();
+    upOff = null;
+  };
+  const onPointerUp = (e) => {
+    if (!active) return;
+    active = false;
+    releasePointers();
+    options.onEnd?.(e);
+  };
+  const onPointerDown = (e) => {
+    if (active) return;
+    e.preventDefault();
+    active = true;
+    startX = e.clientX;
+    startY = e.clientY;
+    moveOff = addGlobalListener(window, "pointermove", onPointerMove);
+    upOff = addGlobalListener(window, "pointerup", onPointerUp);
+    options.onStart?.(e);
+  };
+  const selfId = env.selfId();
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id !== selfId) return;
+      if (active) {
+        releasePointers();
+        active = false;
+      }
+      unsub();
+    });
   }
-};
-async function arrToHtml(v, ctx) {
-  const arr = v;
-  ensureArrayKeys(arr);
-  const fidBase = ctx._fidPath;
-  const parts = await Promise.all(arr.map(async (c, i) => {
-    const childFid = fidBase != null ? `${fidBase}-${i}` : String(i);
-    return CHILD_HTML[childHtmlKind(c)](c, ctx, i, childFid);
-  }));
-  return parts.join("");
-}
-async function fragToHtml(v, ctx) {
-  const vnode = v;
-  const fid = ctx._fidPath ?? null;
-  const inner = await x2html(vnode.props?.children, { ...ctx, _fidPath: fid ?? void 0 });
-  return `<!--${holeMarkup({ type: "fragment-start", key: null, id: null, fid })}-->${inner}<!--${holeMarkup({ type: "fragment-end", key: null, id: null, fid })}-->`;
-}
-async function portalToHtml(v, ctx) {
-  const vnode = v;
-  return x2html(vnode.props?.children, ctx);
-}
-async function compToHtml(v, ctx) {
-  const vnode = v;
-  const childCtx = Object.create(ctx);
-  delete childCtx._fidPath;
-  const renderFn = await vnode.type(vnode.props ?? {}, childCtx);
-  if (typeof renderFn !== "function") {
-    throw new Error(
-      `Component ${componentName(vnode.type)} must return a render function. Use (init_props, ctx) => (props) => VNode pattern.`
+  return { onPointerDown };
+}
+function useDragDrop(env, options) {
+  void env;
+  const dropProps = {};
+  if (options.onDrop) {
+    dropProps.onDrop = (e) => {
+      e.preventDefault();
+      options.onDrop(e);
+    };
+  }
+  if (options.onDragOver) {
+    dropProps.onDragOver = (e) => {
+      e.preventDefault();
+      options.onDragOver(e);
+    };
+  }
+  if (options.onDragLeave) dropProps.onDragLeave = (e) => options.onDragLeave(e);
+  const dragProps = { draggable: true };
+  if (options.onDragStart) {
+    const userStart = options.onDragStart;
+    dragProps.onDragStart = (e) => {
+      if (typeof document !== "undefined") document.body.classList.add("wf-dragging");
+      userStart(e);
+    };
+  }
+  if (options.onDragEnd) {
+    const userEnd = options.onDragEnd;
+    dragProps.onDragEnd = (e) => {
+      if (typeof document !== "undefined") document.body.classList.remove("wf-dragging");
+      userEnd(e);
+    };
+  }
+  return { dropProps, dragProps };
+}
+
+// src/ui-dom/use-chat.ts
+function toChatMessages(msgs) {
+  return msgs.map((m) => {
+    const out = { role: m.role, content: m.content };
+    if (m.reasoning) out.reasoning_content = m.reasoning;
+    return out;
+  });
+}
+function uid() {
+  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
+    return crypto.randomUUID();
+  }
+  return `msg-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+}
+function createChatSession(state, transport, options, notify) {
+  if (options.initialMessages) {
+    state.messages = structuredClone(options.initialMessages);
+  } else if (state.messages === void 0) state.messages = [];
+  if (state.input === void 0) state.input = "";
+  if (state.streaming === void 0) state.streaming = false;
+  if (state.error === void 0) state.error = null;
+  if (state.usage === void 0) state.usage = null;
+  if (state.step === void 0) state.step = null;
+  let handle = null;
+  function current() {
+    if (!state.streaming) return void 0;
+    const m = state.messages[state.messages.length - 1];
+    return m && m.role === "assistant" && m.status === "streaming" ? m : void 0;
+  }
+  function apply(name, data, onEvent) {
+    const m = current();
+    switch (name) {
+      case "wf:token":
+        if (m) m.content += data.text;
+        break;
+      case "wf:tool_call": {
+        if (m) {
+          if (!m.toolCalls) m.toolCalls = [];
+          m.toolCalls.push({ call: data, status: "running" });
+        }
+        break;
+      }
+      case "wf:tool_progress": {
+        const p = data;
+        const tc = m?.toolCalls?.find((t) => t.call.id === p.toolCallId);
+        if (tc) tc.progress = p;
+        break;
+      }
+      case "wf:tool_result": {
+        const r = data;
+        const tc = m?.toolCalls?.find((t) => t.call.id === r.id);
+        if (tc) {
+          tc.result = r;
+          tc.status = r.ok ? "ok" : "error";
+        }
+        break;
+      }
+      case "wf:approval_request":
+        if (m) m.approval = data;
+        break;
+      case "wf:usage":
+        if (m) m.usage = data;
+        break;
+      case "wf:step":
+        state.step = data;
+        break;
+      case "wf:done":
+        if (m) {
+          m.status = "done";
+          m.approval = void 0;
+          const d = data;
+          if (d.reasoning) m.reasoning = d.reasoning;
+        }
+        state.streaming = false;
+        state.step = null;
+        break;
+      case "wf:error":
+        if (m) {
+          m.status = "error";
+          m.error = data;
+          m.approval = void 0;
+        }
+        state.error = data;
+        state.streaming = false;
+        state.step = null;
+        break;
+      default:
+        onEvent?.(name, data);
+        break;
+    }
+    notify?.();
+  }
+  function startStream() {
+    const body = options.body ? options.body(state.messages) : { messages: toChatMessages(state.messages) };
+    handle = transport(options.url, body, {
+      onToken: (t) => apply("wf:token", { text: t }),
+      onToolCall: (c) => apply("wf:tool_call", c),
+      onToolProgress: (p) => apply("wf:tool_progress", p),
+      onToolResult: (r) => apply("wf:tool_result", r),
+      onApproval: (req) => apply("wf:approval_request", req),
+      onUsage: (u) => apply("wf:usage", u),
+      onStep: (s) => apply("wf:step", s),
+      onDone: (d) => apply("wf:done", d),
+      onError: (e) => apply("wf:error", e),
+      onEvent: (n, d) => apply(n, d, options.onEvent)
+    }, { signal: options.signal, headers: options.headers });
+    state.streaming = true;
+    const m = current();
+    if (m && handle?.traceId) m.id = handle.traceId;
+  }
+  function send() {
+    if (state.streaming) return;
+    const text = String(state.input ?? "").trim();
+    if (!text) return;
+    state.input = "";
+    state.error = null;
+    state.usage = null;
+    state.step = null;
+    state.messages.push(
+      { id: uid(), role: "user", content: text, status: "done" },
+      { id: uid(), role: "assistant", content: "", status: "streaming", toolCalls: [] }
     );
+    startStream();
+    notify?.();
+  }
+  function stop() {
+    handle?.abort();
+    state.streaming = false;
+    state.step = null;
+    const m = state.messages[state.messages.length - 1];
+    if (m && m.role === "assistant" && m.status === "streaming") {
+      if (!m.content && (!m.toolCalls || m.toolCalls.length === 0)) {
+        state.messages.pop();
+      } else {
+        m.status = "done";
+      }
+    }
+    notify?.();
   }
-  const out = await renderFn(vnode.props ?? {});
-  if (vnode.key != null && out != null && typeof out === "object") {
-    if (Array.isArray(out)) {
-      for (const c of out) if (c != null && typeof c === "object" && !Array.isArray(c)) c.key = vnode.key;
-    } else {
-      ;
-      out.key = vnode.key;
-    }
-  }
-  return x2html(out, childCtx);
-}
-async function nativeToHtml(v, ctx) {
-  const vnode = v;
-  const tag = vnode.type;
-  const props = vnode.props ?? {};
-  const attrs = [];
-  let innerHTML = null;
-  if (vnode.key != null) attrs.push(` data-wf-key="${escape(String(vnode.key))}"`);
-  for (const [key, value] of Object.entries(props)) {
-    if (key === "children" || key === "key") continue;
-    if (key === "ref") continue;
-    if (key.startsWith("on") && typeof value === "function") continue;
-    if (key === "innerHTML") {
-      innerHTML = String(value ?? "");
-      continue;
+  function retry() {
+    if (state.streaming) return;
+    let idx = -1;
+    for (let i = state.messages.length - 1; i >= 0; i--) {
+      if (state.messages[i].role === "user") {
+        idx = i;
+        break;
+      }
     }
-    if (key === "class" || key === "className") {
-      const cls = classToString(value);
-      if (cls) attrs.push(` class="${escape(cls)}"`);
-      continue;
+    if (idx === -1) return;
+    state.messages.splice(idx + 1);
+    state.error = null;
+    state.usage = null;
+    state.step = null;
+    state.messages.push({ id: uid(), role: "assistant", content: "", status: "streaming", toolCalls: [] });
+    startStream();
+    notify?.();
+  }
+  function clear() {
+    handle?.abort();
+    state.messages = [];
+    state.input = "";
+    state.streaming = false;
+    state.error = null;
+    state.usage = null;
+    state.step = null;
+    notify?.();
+  }
+  async function approve(decision, note, modifiedArgs) {
+    const m = state.messages[state.messages.length - 1];
+    const req = m?.role === "assistant" ? m.approval : void 0;
+    if (!req) return;
+    m.approval = void 0;
+    notify?.();
+    if (!options.approveUrl) return;
+    try {
+      await fetch(options.approveUrl, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", ...options.headers },
+        // modified 决策：带修改后参数（协议 WfApprovalResponse.modifiedArgs，后端按它执行）
+        body: JSON.stringify(modifiedArgs ? { id: req.id, decision, note, modifiedArgs } : { id: req.id, decision, note }),
+        signal: options.signal
+      });
+    } catch (err) {
+      if (options.signal?.aborted) return;
+      state.error = { code: "provider_error", message: err instanceof Error ? err.message : String(err) };
+      notify?.();
     }
-    if (key === "style" && value && typeof value === "object") {
-      attrs.push(` style="${escape(styleToString(value))}"`);
-      continue;
+  }
+  function dispose() {
+    handle?.abort();
+    handle = null;
+  }
+  return { send, stop, retry, clear, approve, dispose };
+}
+
+// src/ui-dom/ai.ts
+var RECORD_LIMIT = 1e3;
+function aiStream(url, body, options) {
+  const controller = new AbortController();
+  const external = options?.signal;
+  if (external) {
+    if (external.aborted) controller.abort();
+    else external.addEventListener("abort", () => controller.abort(), { once: true });
+  }
+  const traceId = options?.traceId ?? randomId();
+  const record = options?.record !== false;
+  const events = [];
+  const done = (async () => {
+    let res;
+    try {
+      res = await fetch(url, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "X-Trace-Id": traceId,
+          Accept: "text/event-stream",
+          ...options?.headers
+        },
+        body: JSON.stringify(body),
+        signal: controller.signal
+      });
+    } catch (err) {
+      if (controller.signal.aborted) return;
+      options?.onError?.({ code: "provider_error", message: err instanceof Error ? err.message : String(err) });
+      return;
     }
-    if (ENUMERATED_VALUE_BASED.has(key)) {
-      attrs.push(` ${key}="${value ? "true" : "false"}"`);
-      continue;
+    if (!res.ok) {
+      options?.onError?.({
+        code: httpErrorCode(res.status),
+        message: `HTTP ${res.status} ${res.statusText}`
+      });
+      return;
     }
-    if (value === true) {
-      attrs.push(` ${key}`);
-      continue;
+    try {
+      for await (const { name, data } of parseWfEvents(res.body)) {
+        if (controller.signal.aborted) return;
+        pushEvent(events, { name, data }, record);
+        dispatch2(name, data, options ?? {});
+      }
+    } catch (err) {
+      if (controller.signal.aborted) return;
+      options?.onError?.({ code: "provider_error", message: err instanceof Error ? err.message : String(err) });
     }
-    if (value === false || value == null) continue;
-    attrs.push(` ${key}="${escape(String(value))}"`);
-  }
-  const attrStr = attrs.join("");
-  const svgWrap = SVG_TAGS.has(tag);
-  if (VOID_TAGS.has(tag)) return `<${tag}${attrStr}>`;
-  if (innerHTML !== null) return `<${tag}${attrStr}>${innerHTML}</${tag}>`;
-  const children = await x2html(props.children, ctx);
-  if (svgWrap) return `<${tag}${attrStr}>${children}</${tag}>`;
-  return `<${tag}${attrStr}>${children}</${tag}>`;
-}
-var TO_HTML = {
-  hole: holeToHtml,
-  text: textToHtml,
-  arr: arrToHtml,
-  portal: portalToHtml,
-  frag: fragToHtml,
-  comp: compToHtml,
-  native: nativeToHtml
-};
+  })();
+  return {
+    abort: () => controller.abort(),
+    done,
+    traceId,
+    events
+  };
+}
+function dispatch2(name, data, o) {
+  switch (name) {
+    case "wf:token":
+      return o.onToken?.(data.text);
+    case "wf:tool_call":
+      return o.onToolCall?.(data);
+    case "wf:tool_result":
+      return o.onToolResult?.(data);
+    case "wf:tool_progress":
+      return o.onToolProgress?.(data);
+    case "wf:step":
+      return o.onStep?.(data);
+    case "wf:approval_request":
+      return o.onApproval?.(data);
+    case "wf:usage":
+      return o.onUsage?.(data);
+    case "wf:done":
+      return o.onDone?.(data);
+    case "wf:error":
+      return o.onError?.(data);
+    default:
+      return o.onEvent?.(name, data);
+  }
+}
+async function* parseWfEvents(stream2) {
+  const reader = stream2.getReader();
+  const decoder = new TextDecoder();
+  let buffer = "";
+  try {
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) break;
+      buffer += decoder.decode(value, { stream: true });
+      const blocks = buffer.split("\n\n");
+      buffer = blocks.pop() ?? "";
+      for (const block of blocks) {
+        let name = "message";
+        let data = "";
+        for (const line of block.split("\n")) {
+          if (line.startsWith("event: ")) name = line.slice(7);
+          else if (line.startsWith("data: ")) data += line.slice(6);
+        }
+        if (!data) continue;
+        try {
+          yield { name, data: JSON.parse(data) };
+        } catch {
+        }
+      }
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}
+function pushEvent(events, e, record) {
+  if (!record) return;
+  if (events.length >= RECORD_LIMIT) events.shift();
+  events.push(e);
+}
+function httpErrorCode(status) {
+  if (status === 401 || status === 403) return "auth_failed";
+  if (status === 429) return "rate_limited";
+  if (status >= 500) return "provider_error";
+  return "invalid_request";
+}
+function randomId() {
+  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
+    return crypto.randomUUID();
+  }
+  return `trace-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+}
 
-// src/ui-dom/vdom2/ssr.ts
-function serializeData(data) {
-  const json = JSON.stringify(Object.fromEntries(data)).replace(/</g, "\\u003c");
-  return `<script>window.__DATA__=${json};</script>`;
-}
-function createSsrContext(serverCtx, dataStore) {
-  const ctx = {
-    ...serverCtx,
-    browser: null,
-    __registry: null,
-    ui: {
-      _rootVNodeId: null,
-      render: () => Promise.resolve(),
-      setMounting: () => {
-      },
-      endMounting: () => {
+// src/ui-dom/hooks/chat.ts
+function useChat(env, options) {
+  const state = {
+    messages: [],
+    input: "",
+    streaming: false,
+    error: null,
+    usage: null,
+    step: null
+  };
+  const subs = /* @__PURE__ */ new Set();
+  const notify = () => {
+    for (const cb of [...subs]) cb();
+  };
+  const api = createChatSession(state, aiStream, options, notify);
+  Object.assign(state, api);
+  state.subscribe = (cb) => {
+    subs.add(cb);
+    return () => {
+      subs.delete(cb);
+    };
+  };
+  const selfId = env.selfId();
+  if (selfId) {
+    const unsub = env.onUnmount((id) => {
+      if (id === selfId) {
+        api.dispose();
+        unsub();
+      }
+    });
+  }
+  return state;
+}
+
+// src/ui-dom/popup-tracker.ts
+var browser2 = createClientBrowser();
+function createPopupTrackerSystem(renderByIds) {
+  const popupTrackers2 = /* @__PURE__ */ new Map();
+  const scrollTrackers2 = /* @__PURE__ */ new Map();
+  let popupListenersReady = false;
+  let popupRaf = 0;
+  function schedulePopupRecompute() {
+    if (popupRaf) return;
+    popupRaf = requestAnimationFrame(() => {
+      popupRaf = 0;
+      const ids = [];
+      for (const [id, t] of popupTrackers2) {
+        if (!t.isOpen()) continue;
+        const el = t.getEl();
+        if (!el) continue;
+        const r = el.getBoundingClientRect();
+        if (r.width === 0 && r.height === 0) continue;
+        const p = t.compute(r);
+        Object.assign(t.pos, clampToViewport(p, t.panel?.(), t.margin));
+        ids.push(id);
+      }
+      for (const [id, st] of scrollTrackers2) {
+        const scroller = st.getScroller();
+        const y = scroller instanceof Window ? browser2.scrollingElement()?.scrollTop ?? browser2.scrollTop() : scroller.scrollTop ?? 0;
+        if (y !== st.handle.y) {
+          st.handle.y = y;
+          ids.push(id);
+        }
       }
+      if (ids.length > 0) renderByIds(ids);
+    });
+  }
+  let offScroll = null;
+  let offResize = null;
+  function ensurePopupListeners2() {
+    if (popupListenersReady) return;
+    popupListenersReady = true;
+    offScroll = addGlobalListener(window, "scroll", schedulePopupRecompute, { capture: true, passive: true });
+    offResize = addGlobalListener(window, "resize", schedulePopupRecompute);
+  }
+  function destroyPopupListeners() {
+    if (popupListenersReady) {
+      offScroll?.();
+      offResize?.();
+      offScroll = null;
+      offResize = null;
+      popupListenersReady = false;
     }
+  }
+  function cleanupTrackers(id) {
+    for (const key of [...popupTrackers2.keys()]) {
+      if (key.startsWith(`popup:${id}:`) || key === `popup:${id}` || key === id) popupTrackers2.delete(key);
+    }
+    scrollTrackers2.delete(id);
+  }
+  function destroy() {
+    destroyPopupListeners();
+    if (popupRaf) {
+      cancelAnimationFrame(popupRaf);
+      popupRaf = 0;
+    }
+    popupTrackers2.clear();
+    scrollTrackers2.clear();
+  }
+  return {
+    popupTrackers: popupTrackers2,
+    scrollTrackers: scrollTrackers2,
+    schedulePopupRecompute,
+    ensurePopupListeners: ensurePopupListeners2,
+    destroyPopupListeners,
+    cleanupTrackers,
+    destroy
   };
-  const dataCache = /* @__PURE__ */ new Map();
-  ctx.data = {
-    async get(key, fetcher) {
-      const entry = dataCache.get(key);
-      if (entry && "value" in entry) return entry.value;
-      if (entry?.promise) return entry.promise;
-      if (!fetcher) return void 0;
-      const promise = Promise.resolve().then(() => fetcher()).then((val) => {
-        dataCache.set(key, { value: val });
-        dataStore.set(key, val);
-        return val;
+}
+
+// src/ui-dom/vdom3/ui.ts
+var mediaRegistry = /* @__PURE__ */ new Map();
+var warned = /* @__PURE__ */ new Set();
+var uncontrolledValues = /* @__PURE__ */ new Map();
+var inputStates = /* @__PURE__ */ new Map();
+var openStates = /* @__PURE__ */ new Map();
+var componentRenders = /* @__PURE__ */ new Map();
+var trackerSystem = createPopupTrackerSystem((ids) => {
+  for (const id of ids) {
+    const render = componentRenders.get(id);
+    if (render) {
+      try {
+        render();
+      } catch {
+      }
+    }
+  }
+});
+var popupTrackers = trackerSystem.popupTrackers;
+var scrollTrackers = trackerSystem.scrollTrackers;
+var ensurePopupListeners = trackerSystem.ensurePopupListeners;
+function createV3Ui(compId, render, onUnmountCb) {
+  componentRenders.set(compId, render);
+  const env = {
+    selfId: () => compId,
+    render: (ids) => {
+      ;
+      window.__chain = "env.render";
+      if (!ids || ids.length === 0 || ids.includes(compId)) render();
+      else console.warn(`[vdom3/ui] render([${ids.join(",")}]) \u8DE8\u7EC4\u4EF6\u6E32\u67D3\u6682\u672A\u5B9E\u73B0\uFF08vdom3 \u5F53\u524D\u4EC5\u7EC4\u4EF6\u81EA\u8EAB render\uFF09`);
+    },
+    browser: createClientBrowser(),
+    onUnmount: (fn) => {
+      onUnmountCb(() => {
+        fn(compId);
+        componentRenders.delete(compId);
       });
-      dataCache.set(key, { promise });
-      return promise;
+      return () => {
+      };
     },
-    set(key, value) {
-      dataCache.set(key, { value });
-      dataStore.set(key, value);
+    registry: { idRegistry: /* @__PURE__ */ new Map() },
+    mediaRegistry,
+    popupTrackers,
+    scrollTrackers,
+    isMounting: () => false,
+    warned,
+    uncontrolledValues,
+    inputStates,
+    openStates,
+    ensurePopupListeners
+  };
+  const ui2 = {
+    // 实例标记（debug：ctx.ui 来源审计——双实例/compId 错位定位）
+    __v3ui: true,
+    __compId: compId,
+    render: (ids) => env.render(ids),
+    onUnmount: (fn) => {
+      onUnmountCb(fn);
+      return void 0;
     },
-    has(key) {
-      return dataCache.has(key);
-    }
+    selfId: (name) => {
+      env.registry.idRegistry.set(name, compId);
+    },
+    // 转发（参数/返回类型继承 V3Ui（hooks 契约）——上下文推断）
+    useExternal: (store) => useExternal(env, store),
+    useControlled: (options) => useControlled(env, options),
+    useControlledInput: (options) => useControlledInput(env, options),
+    useOpen: (options) => useOpen(env, options),
+    usePopup: (options) => usePopup(env, options),
+    usePopupPosition: (options) => usePopupPosition(env, options),
+    useTween: (target, opts) => useTween(env, target, opts),
+    useInView: (options) => useInView(env, options),
+    useScrollPosition: (options) => useScrollPosition(env, options),
+    useGlobalKey: (handler) => useGlobalKey(env, handler),
+    useDrag: (options) => useDrag(env, options),
+    useDragDrop: (options) => useDragDrop(env, options),
+    useMedia: (query, cb) => {
+      useMedia(env, query, cb);
+    },
+    useBreakpoint: (bps, cb) => {
+      useBreakpoint(env, bps, cb);
+    },
+    useReducedMotion: () => useReducedMotion(env),
+    useStableRef: (init, cleanup) => useStableRef(env, init, cleanup),
+    usePresence: (options) => usePresence(env, options),
+    useLongPress: (options) => useLongPress(env, options),
+    useHoverCapable: () => useHoverCapable(env),
+    useVisualViewport: () => useVisualViewport(env),
+    useAsync: (fetcher) => useAsync(env, fetcher),
+    useChat: (options) => useChat(env, options)
   };
-  return ctx;
+  return ui2;
+}
+
+// src/ui-dom/vdom3/build.ts
+var unmountHooks = /* @__PURE__ */ new Map();
+function isVNode(v) {
+  return v != null && typeof v === "object" && !Array.isArray(v) && "type" in v;
+}
+function propsEqual(a, b) {
+  const ka = Object.keys(a);
+  const kb = Object.keys(b);
+  if (ka.length !== kb.length) return false;
+  for (const k of ka) {
+    if (a[k] !== b[k]) return false;
+  }
+  return true;
+}
+async function buildVNode(vnode, ctx, oldV, isRoot = false) {
+  if (typeof vnode.type === "function" || vnode.type === App) {
+    const v2 = { ...vnode };
+    if (vnode.type === App) {
+      return buildAppNode(v2, ctx, oldV);
+    }
+    const reuse = oldV != null && typeof oldV === "object" && oldV.type === vnode.type && oldV.key === vnode.key && oldV._render ? oldV : null;
+    if (reuse) {
+      v2._render = reuse._render;
+      v2._id = reuse._id;
+      indexComponent(v2);
+      stream.emit(ev("comp", "build", v2._id, { name: compName(v2.type), reused: true, index: true }));
+      if (!isRoot && propsEqual(reuse.props, v2.props)) {
+        v2._child = reuse._child;
+        return v2;
+      }
+      const changedKeys = Object.keys({ ...reuse.props, ...v2.props }).filter((k) => reuse.props[k] !== v2.props[k]);
+      stream.emit(ev("props", "update", v2._id, { name: compName(v2.type), keys: changedKeys }));
+    } else {
+      v2._id = nextNodeId();
+      indexComponent(v2);
+      stream.emit(ev("comp", "build", v2._id, { name: compName(v2.type), reused: false, index: true }));
+      stream.emit(ev("comp", "mount", v2._id, { name: compName(v2.type) }));
+      const compId = v2._id;
+      const componentRender = () => {
+        ;
+        window.__chain = "componentRender:" + compId;
+        const fn = ctx._componentRender;
+        if (fn) {
+          ;
+          window.__chain = "fn(" + compId + ")";
+          fn(compId);
+        } else {
+          ;
+          window.__chain = "ctx.render(" + compId + ")";
+          ctx.render();
+        }
+      };
+      const compCtx = Object.assign(Object.create(ctx), {
+        render: componentRender,
+        onUnmount: (fn) => {
+          unmountHooks.set(compId, fn);
+        },
+        // 浏览器环境抽象：默认注入（createClientBrowser 惰性 typeof 防御——
+        // SSR 下 document undefined → null/no-op——组件 36 处 ctx.browser 消费
+        // 无需各自 fallback（Tour 曾因 ctx.browser 缺失 → query 返回 undefined →
+        // targetEl 永不赋值 → rect 恒 0 → 引导高亮定位失效）
+        browser: createClientBrowser(),
+        ui: createV3Ui(compId, componentRender, (fn) => {
+          unmountHooks.set(compId, fn);
+        })
+      });
+      let renderFn = null;
+      try {
+        renderFn = await v2.type(v2.props, compCtx);
+      } catch (e) {
+        const err = e;
+        stream.emit(ev("error", "throw", v2._id, { phase: "factory", name: compName(v2.type), message: err?.message ?? String(e) }));
+        throw e;
+      }
+      v2._render = renderFn;
+    }
+    stream.emit(ev("comp", "render", v2._id, { name: compName(v2.type) }));
+    let output = null;
+    try {
+      output = await v2._render(v2.props);
+    } catch (e) {
+      const err = e;
+      stream.emit(ev("error", "throw", v2._id, { phase: "renderFn", name: compName(v2.type), message: err?.message ?? String(e) }));
+      throw e;
+    }
+    v2._child = null;
+    const oldOut = reuse?._child ?? null;
+    if (output) {
+      const built = await buildVNode(output, ctx, oldOut != null && typeof oldOut === "object" ? oldOut : null);
+      v2._child = built;
+    }
+    return v2;
+  }
+  async function buildAppNode(v2, ctx2, oldV2) {
+    const appId = String(v2.props?.appId ?? "");
+    const factory = getAppFactory(appId);
+    if (!factory) {
+      stream.emit(ev("app", "error", void 0, { appId, reason: "unknown-app" }));
+      return v2;
+    }
+    const reuse = oldV2 != null && oldV2.type === App && oldV2.appId === appId;
+    if (!reuse || !oldV2._appOutput) {
+      stream.emit(ev("app", "mount", void 0, { appId }));
+      const output = await factory(v2.props?.props ?? {}, ctx2);
+      v2._appOutput = output;
+    } else {
+      v2._appOutput = oldV2._appOutput;
+      const oldP = oldV2.props?.props ?? {};
+      const newP = v2.props?.props ?? {};
+      const changed = [.../* @__PURE__ */ new Set([...Object.keys(oldP), ...Object.keys(newP)])].filter((k) => oldP[k] !== newP[k]);
+      if (changed.length > 0) stream.emit(ev("app", "update", void 0, { appId, keys: changed }));
+    }
+    const oldOut = reuse ? oldV2._appOutput ? await buildVNode(oldV2._appOutput, ctx2, null) : null : null;
+    const built = v2._appOutput ? await buildVNode(v2._appOutput, ctx2, oldOut) : null;
+    v2._child = built;
+    v2.appId = appId;
+    return v2;
+  }
+  const oldKids = childrenOf(oldV ?? {});
+  let i = 0;
+  let newKids = null;
+  for (const c of childrenOf(vnode)) {
+    if (isVNode(c)) {
+      const oc = oldKids[i];
+      const built = await buildVNode(c, ctx, oc != null && typeof oc === "object" ? oc : null);
+      if (built !== c) {
+        newKids ??= [...childrenOf(vnode)];
+        newKids[i] = built;
+      }
+    }
+    i++;
+  }
+  if (newKids == null && oldV != null && typeof oldV === "object" && !Array.isArray(oldV)) {
+    const oldKids2 = childrenOf(oldV);
+    const newKidsAll = childrenOf(vnode);
+    if (propsEqual(oldV.props ?? {}, vnode.props ?? {}) && oldKids2.length === newKidsAll.length && oldKids2.every((c, idx) => c === newKidsAll[idx])) {
+      return oldV;
+    }
+  }
+  const v = { ...vnode };
+  if (newKids) v.children = newKids;
+  return v;
 }
-async function ssrToString(Comp, props, serverCtx, opts = {}) {
-  const dataStore = opts.data ?? /* @__PURE__ */ new Map();
-  const ctx = createSsrContext(serverCtx ?? {}, dataStore);
-  const vnode = createVNode(Comp, props ?? {});
-  return x2html(vnode, ctx);
+function compName(type) {
+  return typeof type === "function" ? type.name || "anonymous" : String(type);
+}
+
+// src/ui-dom/vdom3/ssr.ts
+async function renderToEvents(vnode) {
+  const built = await buildVNode(vnode, {});
+  const events = [];
+  let uid2 = 0;
+  const nextId = () => `s${++uid2}`;
+  const ts = Date.now();
+  const walk = (v, parentId) => {
+    if (typeof v.type === "function") {
+      const out = v._child ?? childrenOf(v)[0] ?? null;
+      if (out && typeof out === "object" && !Array.isArray(out)) walk(out, parentId);
+      return;
+    }
+    if (v.type === Fragment) {
+      for (const c of childrenOf(v)) if (c && typeof c === "object" && !Array.isArray(c)) walk(c, parentId);
+      return;
+    }
+    const id = nextId();
+    events.push(ev("node", "create", id, { tag: v.type }));
+    for (const [k, val] of Object.entries(v.props ?? {})) {
+      if (k === "key" || k === "children") continue;
+      if (typeof val === "function") continue;
+      if (val != null && val !== false) events.push(ev("prop", "update", id, { key: k, value: val, prev: "" }));
+    }
+    events.push(ev("node", "insert", id, { parent: parentId, ref: null }));
+    for (const c of childrenOf(v)) {
+      if (typeof c === "string" || typeof c === "number") {
+        const tid = nextId();
+        events.push(ev("text", "create", tid, { value: String(c) }));
+        events.push(ev("node", "insert", tid, { parent: id, ref: null }));
+      } else if (c && typeof c === "object" && !Array.isArray(c)) {
+        walk(c, id);
+      }
+    }
+  };
+  walk(built, "root");
+  return events;
+}
+function eventsToHtml(events) {
+  const tags = /* @__PURE__ */ new Map();
+  const attrs = /* @__PURE__ */ new Map();
+  const texts = /* @__PURE__ */ new Map();
+  for (const e of events) {
+    if (e.entity === "node" && e.action === "create") tags.set(e.target, e.payload.tag);
+    else if (e.entity === "prop" && e.action === "update") {
+      const pl = e.payload;
+      const m = attrs.get(e.target) ?? /* @__PURE__ */ new Map();
+      if (pl.value == null || pl.value === false) m.delete(pl.key);
+      else m.set(pl.key, pl.value);
+      attrs.set(e.target, m);
+    } else if (e.entity === "text" && e.action === "create") texts.set(e.target, e.payload.value);
+  }
+  const childrenOf2 = /* @__PURE__ */ new Map();
+  for (const e of events) {
+    if (e.entity === "node" && e.action === "insert") {
+      const pl = e.payload;
+      const arr = childrenOf2.get(pl.parent) ?? [];
+      arr.push(e.target);
+      childrenOf2.set(pl.parent, arr);
+    }
+  }
+  const esc = (s) => s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+  const emit = (id) => {
+    const tag = tags.get(id);
+    if (tag) {
+      const a = attrs.get(id);
+      const attrStr = a ? [...a.entries()].filter(([k, v]) => typeof v !== "function" && k !== "data-v3-id" && k !== "key" && k !== "ref").map(([k, v]) => ` ${k}="${esc(String(v))}"`).join("") : "";
+      const kids = (childrenOf2.get(id) ?? []).map(emit).join("");
+      return `<${tag}${attrStr}>${kids}</${tag}>`;
+    }
+    return esc(texts.get(id) ?? "");
+  };
+  return (childrenOf2.get("root") ?? []).map(emit).join("");
 }
 
 // src/ui/index.ts
-function escape2(s) {
+function escape(s) {
   return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
 }
 function stringify(v) {
   if (v == null || v === false || v === true) return "";
   if (Array.isArray(v)) return v.map(stringify).join("");
   if (v instanceof HtmlSafe) return v.value;
-  return escape2(String(v));
+  return escape(String(v));
 }
 function unsafe(s) {
   return new HtmlSafe(s);
@@ -3669,14 +5651,15 @@ function ui() {
     }
     ctx.ui = {
       html: Object.assign(htmlTag, { unsafe }),
-      /** SSR 渲染组件 → HTML 片段（HtmlSafe：内联进 ctx.ui.html 不二次转义） */
-      async ssr(Comp, props, opts) {
-        const safe = await ssrToString(Comp, props ?? {}, ctx, opts);
-        return safe;
+      /** SSR 渲染组件 → HTML 片段（vdom3 事件流形态：组件构建 → 事件流 → HTML 序列化） */
+      async ssr(Comp, props) {
+        const events = await renderToEvents(h(Comp, props ?? {}));
+        return new HtmlSafe(eventsToHtml(events));
       },
-      /** 序列化 SSR 数据存储 → window.__DATA__ 脚本（HtmlSafe） */
+      /** 序列化 SSR 数据存储 → window.__DATA__ 脚本（HtmlSafe——< 转义防注入） */
       ssrData(data) {
-        return new HtmlSafe(serializeData(data));
+        const json = JSON.stringify(Object.fromEntries(data)).replace(/</g, "<");
+        return new HtmlSafe(`<script>window.__DATA__=${json};</script>`);
       },
       async js(entryPath) {
         const absPath = resolveEntry(entryPath);
@@ -3750,7 +5733,7 @@ function ui() {
 
 // src/db/postgres/connection.ts
 import net2 from "node:net";
-import crypto2 from "node:crypto";
+import crypto3 from "node:crypto";
 
 // src/db/errors.ts
 var DbError = class extends Error {
@@ -4181,11 +6164,11 @@ var PgConnection = class _PgConnection {
           this.send(passwordMessage(this.opts.password ?? ""));
         } else if (code === 5) {
           const salt = msg.payload.subarray(8, 12);
-          const inner = crypto2.createHash("md5").update(this.opts.password + this.opts.user).digest("hex");
-          const outer = crypto2.createHash("md5").update(inner + Buffer.from(salt).toString("latin1")).digest("hex");
+          const inner = crypto3.createHash("md5").update(this.opts.password + this.opts.user).digest("hex");
+          const outer = crypto3.createHash("md5").update(inner + Buffer.from(salt).toString("latin1")).digest("hex");
           this.send(passwordMessage(`md5${outer}`));
         } else if (code === 10) {
-          const nonce = crypto2.randomBytes(18).toString("base64url");
+          const nonce = crypto3.randomBytes(18).toString("base64url");
           const clientFirstBare = `n=,r=${nonce}`;
           this.authCtx = { clientNonce: nonce, clientFirstBare, serverFirst: "" };
           const mech = utf82("SCRAM-SHA-256\0");
@@ -4368,9 +6351,9 @@ var PgConnection = class _PgConnection {
     const iterations = parseInt(parts.get("i") ?? "4096", 10);
     const nonce = parts.get("r") ?? "";
     const password = this.opts.password ?? "";
-    const saltedPassword = crypto2.pbkdf2Sync(password, salt, iterations, 32, "sha256");
+    const saltedPassword = crypto3.pbkdf2Sync(password, salt, iterations, 32, "sha256");
     const clientKey = hmac(saltedPassword, "Client Key");
-    const storedKey = crypto2.createHash("sha256").update(clientKey).digest();
+    const storedKey = crypto3.createHash("sha256").update(clientKey).digest();
     const channelBinding = "c=biws";
     const clientFinalWithoutProof = `${channelBinding},r=${nonce}`;
     const authMessage = `${ctx.clientFirstBare},${ctx.serverFirst},${clientFinalWithoutProof}`;
@@ -4388,7 +6371,7 @@ var PgConnection = class _PgConnection {
     const salt = Buffer.from(parts.get("s") ?? "", "base64");
     const iterations = parseInt(parts.get("i") ?? "4096", 10);
     const nonce = parts.get("r") ?? "";
-    const saltedPassword = crypto2.pbkdf2Sync(this.opts.password ?? "", salt, iterations, 32, "sha256");
+    const saltedPassword = crypto3.pbkdf2Sync(this.opts.password ?? "", salt, iterations, 32, "sha256");
     const serverKey = hmac(saltedPassword, "Server Key");
     const clientFinalWithoutProof = `c=biws,r=${nonce}`;
     const authMessage = `${ctx.clientFirstBare},${ctx.serverFirst},${clientFinalWithoutProof}`;
@@ -4542,7 +6525,7 @@ function encodeP(payload) {
   return out;
 }
 function hmac(key, data) {
-  return crypto2.createHmac("sha256", key).update(data).digest();
+  return crypto3.createHmac("sha256", key).update(data).digest();
 }
 function xor(a, b) {
   const out = new Uint8Array(a.length);
@@ -5033,8 +7016,8 @@ function compileSelect(q) {
   if (q.where) sql += ` WHERE ${compileWhere(q.where, params)}`;
   for (const s of q.sub ?? []) {
     const sub = compileSelect(s.query);
-    const base2 = params.length + 1;
-    const subSql = sub.sql.replace(/\$(\d+)/g, (_m, n) => `$${base2 + Number(n) - 1}`);
+    const base = params.length + 1;
+    const subSql = sub.sql.replace(/\$(\d+)/g, (_m, n) => `$${base + Number(n) - 1}`);
     params.push(...sub.params);
     const op = s.type === "exists" ? s.not ? "NOT EXISTS" : "EXISTS" : s.not ? "NOT IN" : "IN";
     if (s.type === "exists") {
@@ -5118,8 +7101,8 @@ function isColOps(v) {
   return typeof v === "object" && v !== null && !Array.isArray(v) && !isRaw(v);
 }
 function interpRaw(raw, params) {
-  const base2 = params.length;
-  const out = raw.__raw.replace(/\$(\d+)/g, (_m, n) => `$${base2 + Number(n)}`);
+  const base = params.length;
+  const out = raw.__raw.replace(/\$(\d+)/g, (_m, n) => `$${base + Number(n)}`);
   params.push(...raw.params);
   return out;
 }
@@ -6880,29 +8863,29 @@ var MemoryRedis = class {
   // ── Redis 接口：hash ─────────────────────────────────
   async hset(key, field, value) {
     this.assertOpen();
-    let h = this.hashes.get(key);
-    if (!h) {
-      h = /* @__PURE__ */ new Map();
-      this.hashes.set(key, h);
+    let h2 = this.hashes.get(key);
+    if (!h2) {
+      h2 = /* @__PURE__ */ new Map();
+      this.hashes.set(key, h2);
     }
-    const created2 = !h.has(field);
-    h.set(field, String(value));
+    const created2 = !h2.has(field);
+    h2.set(field, String(value));
     return created2 ? 1 : 0;
   }
   async hget(key, field) {
     return this.hashes.get(key)?.get(field) ?? null;
   }
   async hgetall(key) {
-    const h = this.hashes.get(key);
-    if (!h) return {};
-    return Object.fromEntries(h);
+    const h2 = this.hashes.get(key);
+    if (!h2) return {};
+    return Object.fromEntries(h2);
   }
   async hdel(key, ...fields) {
-    const h = this.hashes.get(key);
-    if (!h) return 0;
+    const h2 = this.hashes.get(key);
+    if (!h2) return 0;
     let n = 0;
-    for (const f of fields) if (h.delete(f)) n++;
-    if (h.size === 0) this.hashes.delete(key);
+    for (const f of fields) if (h2.delete(f)) n++;
+    if (h2.size === 0) this.hashes.delete(key);
     return n;
   }
   // ── Redis 接口：list ─────────────────────────────────