@solidjs/web 2.0.0-rc.1 → 2.0.0-rc.2

package/frames/dist/server.js

@@ -1,5 +1,5 @@
 import { createMemo, runWithOwner, createOwner, sharedConfig, createRoot, ssrHandleError, getOwner, inServerComponentScope, creationStamp, NoHydration, runInServerComponentScope, Hydration, getProjectionTrace } from 'solid-js';
-import { Feature, toCrossJSONStream, Serializer, getCrossReferenceHeader } from 'seroval';
+import { Feature, createStream, toCrossJSONStream, Serializer, getCrossReferenceHeader } from 'seroval';
 import { AbortSignalPlugin, CustomEventPlugin, DOMExceptionPlugin, EventPlugin, FormDataPlugin, HeadersPlugin, ReadableStreamPlugin, RequestPlugin, ResponsePlugin, URLSearchParamsPlugin, URLPlugin } from 'seroval-plugins/web';
 
 const STATE = Symbol.for("dom-expressions.container-trace-state");
@@ -10,6 +10,9 @@ const state = globalThis[STATE] || (globalThis[STATE] = {
 function setContainerTraceResolver(fn) {
   state.resolveTrace = fn;
 }
+function setContainerTraceStreamMint(fn) {
+  state.streamOf = fn;
+}
 function isContainerTraced(value) {
   const resolve = state.resolveTrace;
   return !!(resolve && value && typeof value === "object" && resolve(value));
@@ -58,9 +61,10 @@ function materialize(marker) {
 }
 function parseTrace(value, ctx) {
   const trace = value[TRACE];
+  const sub = trace.subscribe();
   return {
     a: trace.array ? 1 : 0,
-    i: ctx.parse(trace.subscribe())
+    i: ctx.parse(state.streamOf ? state.streamOf(sub) : sub)
   };
 }
 const ContainerTracePlugin = {
@@ -74,9 +78,10 @@ const ContainerTracePlugin = {
     },
     async async(value, ctx) {
       const trace = value[TRACE];
+      const sub = trace.subscribe();
       return {
         a: trace.array ? 1 : 0,
-        i: await ctx.parse(trace.subscribe())
+        i: await ctx.parse(state.streamOf ? state.streamOf(sub) : sub)
       };
     },
     stream: parseTrace
@@ -101,6 +106,18 @@ const ssrAsyncValue = value => createMemo(() => value, {
   serialize: false
 });
 
+setContainerTraceStreamMint(iterable => {
+  const stream = createStream();
+  (async () => {
+    try {
+      for await (const value of iterable) stream.next(value);
+      stream.return(undefined);
+    } catch (error) {
+      stream.throw(error);
+    }
+  })();
+  return stream;
+});
 const DEFAULT_WEB_PLUGINS = Object.freeze([AbortSignalPlugin,
 CustomEventPlugin, DOMExceptionPlugin, EventPlugin,
 FormDataPlugin, HeadersPlugin, ReadableStreamPlugin, RequestPlugin, ResponsePlugin, URLSearchParamsPlugin, URLPlugin,
@@ -480,6 +497,7 @@ function registerEntryAssets(manifest) {
       const assets = resolveAssets(key, manifest);
       if (assets) {
         for (let i = 0; i < assets.css.length; i++) ctx.registerAsset("style", assets.css[i]);
+        for (let i = 1; i < assets.js.length; i++) ctx.registerAsset("module", assets.js[i]);
       }
       return;
     }
@@ -739,7 +757,7 @@ function emitHeadResource(registry, context, tracking, emitResource, nonce, desc
         if (!styles) tracking.boundaryStyles.set(tracking.currentBoundaryId, styles = new Set());
         styles.add(entry);
       }
-      const markup = `<link${attrHtml}>`;
+      const markup = `<link${attrHtml}${nonceAttr(nonce, "style")}>`;
       if (emitResource) emitResource(markup, entry);else {
         registry.eagerHtml += markup;
         entry.emitted = true;
@@ -837,7 +855,7 @@ function headGroupSignature(winner) {
   }
   return sig;
 }
-function renderShellHead(registry, nonce, isPendingFragment) {
+function renderShellHead(registry, nonce, isPendingFragment, noScripts) {
   commitHeadBoundary(registry, "", isPendingFragment);
   registry.shellFlushed = true;
   const winners = resolveHead(registry.committed);
@@ -847,8 +865,14 @@ function renderShellHead(registry, nonce, isPendingFragment) {
   let metas = "";
   let others = "";
   let scripts = "";
+  let title = null;
   for (const [identity, winner] of winners) {
     registry.flushed.set(identity, headGroupSignature(winner));
+    if (identity === "title") {
+      const children = winner.tags[0].props.children;
+      title = children == null ? "" : String(children);
+      continue;
+    }
     for (let i = 0; i < winner.tags.length; i++) {
       const t = winner.tags[i];
       const markup = renderHeadTagMarkup(t.tag, t.props, identity, nonce);
@@ -857,10 +881,12 @@ function renderShellHead(registry, nonce, isPendingFragment) {
   }
   return {
     prelude,
-    html: registry.eagerHtml + links + metas + others + scripts
+    html: registry.eagerHtml + links + metas + others + scripts,
+    title,
+    noScripts
   };
 }
-function flushHeadFragment(registry, boundary) {
+function flushHeadFragment(registry, boundary, nonce) {
   const groups = commitHeadBoundary(registry, boundary);
   if (!groups.length) return null;
   const winners = resolveHead(registry.committed);
@@ -891,12 +917,75 @@ function flushHeadFragment(registry, boundary) {
         if (v == null || v === false) continue;
         attrs[name] = v === true ? "" : String(v);
       }
+      if (nonce && !hasNonceProp(t.props)) {
+        const destination = nonceDestination(t.tag, t.props);
+        const value = destination && nonce[destination];
+        if (value) attrs.nonce = String(value);
+      }
       const children = t.props.children;
       ops.push(["a", identity, t.tag, attrs, children == null ? null : String(children)]);
     }
   }
   return ops.length ? ops : null;
 }
+function normalizeNonce(nonce) {
+  if (nonce == null) return undefined;
+  if (typeof nonce === "string") {
+    const attr = nonce ? ` nonce="${escape(nonce, true)}"` : "";
+    return {
+      script: nonce,
+      style: nonce,
+      scriptAttr: attr,
+      styleAttr: attr
+    };
+  }
+  const script = nonce.script;
+  const style = nonce.style;
+  if (!script && !style) return undefined;
+  return {
+    script,
+    style,
+    scriptAttr: typeof script === "string" && script ? ` nonce="${escape(script, true)}"` : "",
+    styleAttr: typeof style === "string" && style ? ` nonce="${escape(style, true)}"` : ""
+  };
+}
+function asciiLowerCase(value) {
+  return value.replace(/[A-Z]/g, c => String.fromCharCode(c.charCodeAt(0) + 32));
+}
+function hasNonceProp(props) {
+  for (const name in props) if (name.length === 5 && asciiLowerCase(name) === "nonce" && props[name] != null) return true;
+  return false;
+}
+function nonceDestination(tag, props) {
+  if (tag === "script") return "script";
+  if (tag === "style") return "style";
+  if (tag !== "link") return null;
+  const rel = props.rel;
+  if (typeof rel !== "string") return null;
+  const rels = asciiLowerCase(rel).split(/[\t\n\f\r ]+/);
+  if (rels.includes("stylesheet")) return "style";
+  const isModulePreload = rels.includes("modulepreload");
+  if (!isModulePreload && !rels.includes("preload")) return null;
+  const as = typeof props.as === "string" ? asciiLowerCase(props.as) : "";
+  if (as === "style") return "style";
+  if (as === "script") return "script";
+  if (!isModulePreload) return null;
+  switch (as) {
+    case "fetch":
+    case "font":
+    case "image":
+    case "json":
+    case "text":
+    case "track":
+      return null;
+    default:
+      return "script";
+  }
+}
+function nonceAttr(nonce, destination) {
+  if (!nonce || !destination) return "";
+  return destination === "script" ? nonce.scriptAttr : nonce.styleAttr;
+}
 function renderHeadAttrHtml(props) {
   let attrs = "";
   for (const name in props) {
@@ -925,17 +1014,16 @@ function headAttrRecord(props, skipRelHref) {
 function renderHeadTagMarkup(tag, props, identity, nonce) {
   let attrs = renderHeadAttrHtml(props);
   if (identity != null) attrs += ` data-dh="${escape(identity, true)}"`;
-  if (nonce && (tag === "script" || tag === "style")) attrs += ` nonce="${nonce}"`;
+  if (nonce && !hasNonceProp(props)) attrs += nonceAttr(nonce, nonceDestination(tag, props));
   if (tag === "meta" || tag === "link" || tag === "base") return `<${tag}${attrs}>`;
   let body = props.children == null ? "" : String(props.children);
   if (tag === "script") body = body.replace(/<\/(script)/gi, "<\\/$1");else if (tag === "style") body = escapeStyleContent(body);else body = escape(body);
   return `<${tag}${attrs}>${body}</${tag}>`;
 }
 const REPLACE_SCRIPT = `function $df(e){return _$HY.f?_$HY.f(e):$dfr(e)}function $dfr(e,n,o,t){if(!(n=document.getElementById(e)))return 0;if(!(o=document.getElementById("pl-"+e)))return(_$HY.dq=_$HY.dq||{})[e]=1,0;for(;o&&(8!==o.nodeType||o.nodeValue!=="pl-"+e);)t=o.nextSibling,o.remove(),o=t;t=o.parentNode,o.replaceWith(n.content),n.remove(),(_$HY.v=_$HY.v||{})[e]=1,_$HY.fe(e,t),_$HY.hp&&_$HY.hp[e]&&($dh(_$HY.hp[e]),delete _$HY.hp[e]),$dfd();return 1}function $dfl(e,o,n){if(!(o=document.getElementById("pl-"+e)))return(_$HY.dlq=_$HY.dlq||{})[e]=1,0;if(o._$fl)return 1;for(n=o.nextSibling;n;){if(8===n.nodeType&&n.nodeValue==="pl-"+e){o.parentNode&&o.parentNode.insertBefore(o.content.cloneNode(!0),n),o._$fl=1,$dfd();return 1}n=n.nextSibling}return 0}function $dflj(e,i){for(i=0;i<e.length;i++)$dfl(e[i])}function $dfd(e,i){if(e=_$HY.dq){_$HY.dq=0;for(i in e)$df(i)}if(e=_$HY.dlq){_$HY.dlq=0;for(i in e)$dfl(i)}}function $dfs(e,c,d){(_$HY.sc=_$HY.sc||{})[e]=c,d&&((_$HY.sd=_$HY.sd||{})[e]=1)}function $dfg(e,g,i,k){if(!(g=_$HY.sg&&_$HY.sg[e]))return;for(i=0;i<g.length;i++)if(_$HY.sc&&_$HY.sc[g[i]]>0)return;for(i=0;i<g.length;i++)k=g[i],delete _$HY.sg[k],$df(k)}function $dfc(e){if(--_$HY.sc[e]<=0){delete _$HY.sc[e],_$HY.sg&&_$HY.sg[e]?$dfg(e):!(_$HY.sd&&_$HY.sd[e])&&$df(e);_$HY.sd&&delete _$HY.sd[e]}}function $dfj(e,i,n){for(i=0;i<e.length;i++)if(_$HY.sc&&_$HY.sc[e[i]]>0){for(n=0;n<e.length;n++)(_$HY.sg=_$HY.sg||{})[e[n]]=e;return}for(i=0;i<e.length;i++)$df(e[i])}`;
-const HEAD_SCRIPT = `function $dha(o,i,e,n){for(i=0;i<o.length;i++)e=o[i],"t"==e[0]?((n=document.querySelector("title"))||(n=document.createElement("title"),document.head.appendChild(n)),n.textContent=e[1],n.setAttribute("data-dh","title")):"r"==e[0]?$dhr(e[1]):(n=document.createElement(e[2]),Object.keys(e[3]).forEach(function(a){n.setAttribute(a,e[3][a])}),null!=e[4]&&(n.textContent=e[4]),n.setAttribute("data-dh",e[1]),document.head.appendChild(n))}function $dhr(v,l,i){for(l=document.head.querySelectorAll("[data-dh]"),i=0;i<l.length;i++)l[i].getAttribute("data-dh")==v&&l[i].remove()}function $dh(o){_$HY.h?_$HY.h(o):$dha(o)}`;
+const HEAD_SCRIPT = `function $dha(o,i,e,n){for(i=0;i<o.length;i++)e=o[i],"t"==e[0]?((n=document.querySelector("title"))?n.hasAttribute("data-dh")||n.setAttribute("data-dhf",n.textContent):(n=document.createElement("title"),document.head.appendChild(n)),n.textContent=e[1],n.setAttribute("data-dh","title")):"r"==e[0]?$dhr(e[1]):(n=document.createElement(e[2]),Object.keys(e[3]).forEach(function(a){n.setAttribute(a,e[3][a])}),null!=e[4]&&(n.textContent=e[4]),n.setAttribute("data-dh",e[1]),document.head.appendChild(n))}function $dhr(v,l,i){for(l=document.head.querySelectorAll("[data-dh]"),i=0;i<l.length;i++)l[i].getAttribute("data-dh")==v&&l[i].remove()}function $dh(o){_$HY.h?_$HY.h(o):$dha(o)}`;
 function renderToStream(code, options = {}) {
   let {
-    nonce,
     onCompleteShell,
     onCompleteAll,
     renderId = "",
@@ -943,6 +1031,7 @@ function renderToStream(code, options = {}) {
     manifest,
     onHead
   } = options;
+  const nonce = normalizeNonce(options.nonce);
   let dispose;
   let dead = false;
   const abandon = () => {
@@ -967,6 +1056,32 @@ function renderToStream(code, options = {}) {
     } catch (_) {}
     abandon();
   };
+  const coalesceWrites = (writeRaw, endRaw) => {
+    let buf = "";
+    let scheduled = false;
+    const flush = () => {
+      scheduled = false;
+      if (!buf) return;
+      const out = buf;
+      buf = "";
+      writeRaw(out);
+    };
+    return {
+      write(payload) {
+        buf += payload;
+        if (buf.length >= 16384) return flush();
+        if (!scheduled) {
+          scheduled = true;
+          deferFlush(flush);
+        }
+      },
+      flush,
+      end() {
+        flush();
+        endRaw();
+      }
+    };
+  };
   const guardSink = w => ({
     write(payload) {
       if (dead) return;
@@ -986,6 +1101,23 @@ function renderToStream(code, options = {}) {
     }
   });
   const blockingPromises = new Set();
+  const canBatchStubs = !options.serializer && !options.sink;
+  let stubBatch = null;
+  const STUB_BATCH_KEY = "$B";
+  const flushStubBatch = () => {
+    if (!stubBatch) return;
+    const batch = stubBatch;
+    stubBatch = null;
+    if (batch.size === 1) {
+      const [id, p] = batch.entries().next().value;
+      serializer.write(id, p);
+      return;
+    }
+    const obj = {};
+    for (const [id, p] of batch) obj[id] = p;
+    serializer.write(STUB_BATCH_KEY, obj);
+    pushTask(`(b=>{for(var k in b)_$HY.r[k]=b[k];delete _$HY.r["${STUB_BATCH_KEY}"]})(_$HY.r["${STUB_BATCH_KEY}"])`);
+  };
   let headerEmitted = false;
   const pushTask = task => {
     if (noScripts) return;
@@ -1022,10 +1154,11 @@ function renderToStream(code, options = {}) {
         buffer.write(renderInlineStyle(styles.inline[i], nonce));
       }
       if (styles.links.length) {
+        const styleAttr = nonceAttr(nonce, "style");
         emitTask(`$dfs("${key}",${styles.links.length},${deferActivation ? 1 : 0})`);
         writeTasks();
         for (const entry of styles.links) {
-          buffer.write(typeof entry === "string" ? `<link rel="stylesheet" href="${entry}" onload="$dfc('${key}')" onerror="$dfc('${key}')">` : `<link${entry.attrHtml} onload="$dfc('${key}')" onerror="$dfc('${key}')">`);
+          buffer.write(typeof entry === "string" ? `<link rel="stylesheet" href="${entry}"${styleAttr} onload="$dfc('${key}')" onerror="$dfc('${key}')">` : `<link${entry.attrHtml}${styleAttr} onload="$dfc('${key}')" onerror="$dfc('${key}')">`);
         }
         buffer.write(`<template id="${key}">${value}</template>`);
       } else {
@@ -1040,7 +1173,7 @@ function renderToStream(code, options = {}) {
     },
     asset(type, value) {
       if (type === "module") {
-        buffer.write(`<link rel="modulepreload" href="${value}">`);
+        buffer.write(`<link rel="modulepreload" href="${value}"${nonceAttr(nonce, "script")}>`);
       } else if (type === "inline-style") {
         buffer.write(renderInlineStyle(value, nonce));
       } else if (type === "head-tag") {
@@ -1075,6 +1208,7 @@ function renderToStream(code, options = {}) {
           context.live.end = null;
           end();
         }
+        flushStubBatch();
         serializer.flush();
       }));
     }
@@ -1082,7 +1216,7 @@ function renderToStream(code, options = {}) {
   const registry = new Map();
   const writeTasks = () => {
     if (tasks.length && !completed && firstFlushed) {
-      buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks}</script>`);
+      buffer.write(`<script${nonceAttr(nonce, "script")}>${tasks}</script>`);
       tasks = "";
     }
     timer = null;
@@ -1136,7 +1270,7 @@ function renderToStream(code, options = {}) {
   };
   sharedConfig.context = context = {
     async: true,
-    nonce,
+    nonce: options.nonce,
     live: {},
     registerHeadTags(tags) {
       registerHeadTags(headRegistry, context, tracking,
@@ -1194,10 +1328,18 @@ function renderToStream(code, options = {}) {
     },
     serialize(id, p, deferStream) {
       if (sharedConfig.context.noHydrate) return;
-      if (!firstFlushed && deferStream && typeof p === "object" && "then" in p) {
-        blockingPromises.add(p);
-        p.then(d => serializer.write(id, d)).catch(e => serializer.write(id, e));
-      } else serializer.write(id, p);
+      if (!firstFlushed && p && typeof p === "object" && "then" in p) {
+        if (deferStream) {
+          blockingPromises.add(p);
+          p.then(d => serializer.write(id, d)).catch(e => serializer.write(id, e));
+          return;
+        }
+        if (canBatchStubs && !shellCompleted) {
+          (stubBatch ||= new Map()).set(id, p);
+          return;
+        }
+      }
+      serializer.write(id, p);
     },
     escape: escape,
     resolve: resolveSSRNode,
@@ -1231,7 +1373,7 @@ function renderToStream(code, options = {}) {
             queue(flushEnd);
           }))
         });
-        serializer.write(key + "_fr", p);
+        if (canBatchStubs && !shellCompleted) (stubBatch ||= new Map()).set(key + "_fr", p);else serializer.write(key + "_fr", p);
       }
       return (value, error) => {
         if (registry.has(key)) {
@@ -1262,7 +1404,7 @@ function renderToStream(code, options = {}) {
             } else {
               serializeFragmentAssets(key, tracking.boundaryModules, context);
               const styles = collectStreamStyles(key, tracking, headStyles);
-              const headOps = error ? null : flushHeadFragment(headRegistry, key);
+              const headOps = error ? null : flushHeadFragment(headRegistry, key, nonce);
               if (headOps) emitHeadOps(key, headOps);
               sink.fragment(key, resolveSSRSelectValues(value !== undefined ? value : " "), {
                 styles,
@@ -1348,14 +1490,17 @@ function renderToStream(code, options = {}) {
   function doShell() {
     if (shellCompleted) return;
     sharedConfig.context = context;
+    const blockersBefore = blockingPromises.size;
     if (!resolveRootHoles()) return;
+    if (blockingPromises.size !== blockersBefore) return;
     if (!headShellReady(headRegistry, p => blockingPromises.add(p))) return;
     headStyles = new Set();
     for (const url of tracking.emittedAssets) {
       if (isCssUrl(url)) headStyles.add(url);
     }
     serializeRootAssets();
-    const head = renderShellHead(headRegistry, nonce, k => registry.has(k));
+    flushStubBatch();
+    const head = renderShellHead(headRegistry, nonce, k => registry.has(k), noScripts);
     sink.shell(resolveSSRSelectValues(html), {
       preloads: tracking.emittedAssets,
       inlineStyles: tracking.inlineStyles,
@@ -1376,6 +1521,7 @@ function renderToStream(code, options = {}) {
   let drainTurn = 0;
   const scheduleFlush = fn => {
     const attempt = () => {
+      flushStubBatch();
       if (registry.size !== lastRegistrySize || drainTurn++ < MIN_DRAIN_TURNS) {
         if (registry.size !== lastRegistrySize) drainTurn = 0;
         lastRegistrySize = registry.size;
@@ -1423,22 +1569,18 @@ function renderToStream(code, options = {}) {
             }
           };
           writer.closed && writer.closed.catch(failed);
-          writable = {
-            end() {
-              pendingWrites.then(() => {
-                ended = true;
-                writer.releaseLock();
-                w.close().catch(() => {});
-                resolve();
-              });
-            }
-          };
-          buffer = {
-            write(payload) {
-              pendingWrites = pendingWrites.then(() => writer.write(encoder.encode(payload))).catch(failed);
-            }
-          };
+          buffer = writable = coalesceWrites(payload => {
+            pendingWrites = pendingWrites.then(() => writer.write(encoder.encode(payload))).catch(failed);
+          }, () => {
+            pendingWrites.then(() => {
+              ended = true;
+              writer.releaseLock();
+              w.close().catch(() => {});
+              resolve();
+            });
+          });
           buffer.write(tmp);
+          buffer.flush();
           firstFlushed = true;
           if (completed) {
             dispose();
@@ -1468,7 +1610,8 @@ function renderToStream(code, options = {}) {
           allSettled(blockingPromises).then(() => {
             scheduleFlush(() => {
               try {
-                if (!resolveRootHoles() || !headShellReady(headRegistry, p => blockingPromises.add(p))) return flush();
+                const blockersBefore = blockingPromises.size;
+                if (!resolveRootHoles() || blockingPromises.size !== blockersBefore || !headShellReady(headRegistry, p => blockingPromises.add(p))) return flush();
               } catch (err) {
                 failRender(err);
                 return resolve(tmp);
@@ -1497,8 +1640,10 @@ function renderToStream(code, options = {}) {
               return;
             }
             if (!shellCompleted) return flush();
-            buffer = writable = guardSink(w);
+            const sink = guardSink(w);
+            buffer = writable = coalesceWrites(sink.write, sink.end);
             buffer.write(tmp);
+            buffer.flush();
             firstFlushed = true;
             if (completed) {
               dispose();
@@ -2152,92 +2297,11 @@ function ssr(t) {
   };
   return result;
 }
-function decodeSSREntities(s) {
-  return s.indexOf("&") < 0 ? s : s.replace(/&quot;/g, '"').replace(/&lt;/g, "<").replace(/&amp;/g, "&");
-}
-const SELECT_VALUE_ATTR = /\svalue="([^"]*)"/;
-function tagEnd(html, i) {
-  for (let j = i + 1; j < html.length; j++) {
-    const c = html.charCodeAt(j);
-    if (c === 34) {
-      j = html.indexOf('"', j + 1);
-      if (j < 0) return -1;
-    } else if (c === 62) return j;
-  }
-  return -1;
-}
-function optionText(html, from) {
-  let t = "";
-  let i = from;
-  for (;;) {
-    const lt = html.indexOf("<", i);
-    if (lt < 0) return t + html.slice(i);
-    t += html.slice(i, lt);
-    if (!html.startsWith("<!--", lt)) return t;
-    const ce = html.indexOf("-->", lt);
-    if (ce < 0) return t;
-    i = ce + 3;
-  }
-}
-function tagIs(html, i, name) {
-  if (!html.startsWith(name, i + 1)) return false;
-  const c = html.charCodeAt(i + 1 + name.length);
-  return c === 32 || c === 62 || c === 9 || c === 10 || c === 13;
-}
+const CLAIM_PROP = /*#__PURE__*/Symbol.for("dom-expressions.claim-prop");
+const CLAIMS_STREAM = 1;
+const CLAIMS_DOCUMENT = 2;
 function resolveSSRSelectValues(html) {
-  if (html.indexOf("<select") < 0) return html;
-  let out = "";
-  let idx = 0;
-  let sel = null;
-  let i = html.indexOf("<");
-  while (i >= 0) {
-    let e;
-    if (html.charCodeAt(i + 1) === 33) {
-      e = html.charCodeAt(i + 2) === 45 ? html.indexOf("-->", i) : html.indexOf(">", i);
-      if (e < 0) break;
-      if (html.charCodeAt(i + 2) === 45) e += 2;
-    } else {
-      e = tagEnd(html, i);
-      if (e < 0) break;
-      if (sel) {
-        if (html.startsWith("</select>", i)) {
-          out += html.slice(idx, sel.strip) + html.slice(sel.stripEnd, sel.body);
-          let seg = sel.body;
-          if (!sel.defaulted) {
-            for (let k = 0; k < sel.marks.length; k++) {
-              out += html.slice(seg, sel.marks[k]) + " selected";
-              seg = sel.marks[k];
-            }
-          }
-          out += html.slice(seg, i);
-          idx = i;
-          sel = null;
-        } else if (tagIs(html, i, "option")) {
-          const attrs = html.slice(i + 7, e);
-          if (/\sselected(?=[\s=]|$)/.test(attrs)) sel.defaulted = true;else {
-            const vm = SELECT_VALUE_ATTR.exec(attrs);
-            const value = vm ? decodeSSREntities(vm[1]) : decodeSSREntities(optionText(html, e + 1)).replace(/\s+/g, " ").trim();
-            if (sel.values.includes(value)) sel.marks.push(e);
-          }
-        }
-      } else if (tagIs(html, i, "select")) {
-        const m = SELECT_VALUE_ATTR.exec(html.slice(i, e + 1));
-        if (m) {
-          const bound = decodeSSREntities(m[1]);
-          sel = {
-            values: /\smultiple(?=[\s>=])/.test(html.slice(i, e + 1)) ? bound.split(",") : [bound],
-            strip: i + m.index,
-            stripEnd: i + m.index + m[0].length,
-            body: e + 1,
-            marks: [],
-            defaulted: false
-          };
-        }
-      }
-    }
-    i = html.indexOf("<", e + 1);
-  }
-  return out + html.slice(idx);
+  return html;
 }
 function escape(s, attr) {
   const t = typeof s;
@@ -2260,22 +2324,20 @@ function escape(s, attr) {
   return escapeSlow(s, attr, i);
 }
 const ESCAPE_CONTENT = /[&<]/;
-const ESCAPE_ATTR = /[&"]/;
+const ESCAPE_ATTR = /[&"<]/;
 function escapeSlow(s, attr, start) {
-  const delim = attr ? '"' : "<";
-  const delimCode = attr ? 34 : 60;
-  const escDelim = attr ? "&quot;" : "&lt;";
+  if (attr) return escapeAttrSlow(s, start);
   const c0 = s.charCodeAt(start);
-  let iDelim = c0 === delimCode ? start : s.indexOf(delim, start);
+  let iDelim = c0 === 60 ? start : s.indexOf("<", start);
   let iAmp = c0 === 38 ? start : s.indexOf("&", start);
   let left = 0,
     out = "";
   while (iDelim >= 0 && iAmp >= 0) {
     if (iDelim < iAmp) {
       if (left < iDelim) out += s.substring(left, iDelim);
-      out += escDelim;
+      out += "&lt;";
       left = iDelim + 1;
-      iDelim = s.indexOf(delim, left);
+      iDelim = s.indexOf("<", left);
     } else {
       if (left < iAmp) out += s.substring(left, iAmp);
       out += "&amp;";
@@ -2286,9 +2348,9 @@ function escapeSlow(s, attr, start) {
   if (iDelim >= 0) {
     do {
       if (left < iDelim) out += s.substring(left, iDelim);
-      out += escDelim;
+      out += "&lt;";
       left = iDelim + 1;
-      iDelim = s.indexOf(delim, left);
+      iDelim = s.indexOf("<", left);
     } while (iDelim >= 0);
   } else while (iAmp >= 0) {
     if (left < iAmp) out += s.substring(left, iAmp);
@@ -2298,6 +2360,36 @@ function escapeSlow(s, attr, start) {
   }
   return left < s.length ? out + s.substring(left) : out;
 }
+function escapeAttrSlow(s, start) {
+  const c0 = s.charCodeAt(start);
+  let iQuot = c0 === 34 ? start : s.indexOf('"', start);
+  let iAmp = c0 === 38 ? start : s.indexOf("&", start);
+  let iLt = c0 === 60 ? start : s.indexOf("<", start);
+  let left = 0,
+    out = "";
+  for (;;) {
+    let i = -1,
+      ent;
+    if (iQuot >= 0) {
+      i = iQuot;
+      ent = "&quot;";
+    }
+    if (iAmp >= 0 && (i < 0 || iAmp < i)) {
+      i = iAmp;
+      ent = "&amp;";
+    }
+    if (iLt >= 0 && (i < 0 || iLt < i)) {
+      i = iLt;
+      ent = "&lt;";
+    }
+    if (i < 0) break;
+    if (left < i) out += s.substring(left, i);
+    out += ent;
+    left = i + 1;
+    if (i === iQuot) iQuot = s.indexOf('"', left);else if (i === iAmp) iAmp = s.indexOf("&", left);else iLt = s.indexOf("<", left);
+  }
+  return left < s.length ? out + s.substring(left) : out;
+}
 function tryJoinPlainSSRArray(nodes) {
   if (nodes.length === 0) return undefined;
   let out = "";
@@ -2313,6 +2405,7 @@ function tryJoinPlainSSRArray(nodes) {
 function queue(fn) {
   return Promise.resolve().then(fn);
 }
+const deferFlush = typeof setImmediate === "function" ? setImmediate : fn => setTimeout(fn, 0);
 function allSettled(promises) {
   let size = promises.size;
   return Promise.allSettled(promises).then(() => {
@@ -2321,10 +2414,11 @@ function allSettled(promises) {
   });
 }
 function assembleDocument(html, emittedAssets, inlineStyles, scripts, nonce, headTags, onHead) {
-  const scriptTag = scripts ? `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>` : "";
-  const headTagsHtml = headTags ? headTags.html : "";
+  const scriptTag = scripts ? `<script${nonceAttr(nonce, "script")}>${scripts}</script>` : "";
+  const title = headTags ? headTags.title : null;
+  let headTagsHtml = headTags ? headTags.html : "";
   const headPrelude = headTags ? headTags.prelude : "";
-  if (!onHead && !headTagsHtml && !headPrelude && !(emittedAssets && emittedAssets.size) && !(inlineStyles && inlineStyles.size)) {
+  if (!onHead && title == null && !headTagsHtml && !headPrelude && !(emittedAssets && emittedAssets.size) && !(inlineStyles && inlineStyles.size)) {
     if (!scriptTag) return html;
     const xs = html.indexOf("<!--xs-->");
     return xs === -1 ? html + scriptTag : html.slice(0, xs) + scriptTag + html.slice(xs);
@@ -2336,15 +2430,33 @@ function assembleDocument(html, emittedAssets, inlineStyles, scripts, nonce, hea
       html = html.slice(0, at) + headPrelude + html.slice(at);
     }
   }
-  const headIdx = html.indexOf("</head>");
+  let headIdx = html.indexOf("</head>");
   if (headIdx === -1) {
     if (onHead) {
-      onHead(headPrelude + headTagsHtml + renderHeadAssets(emittedAssets, inlineStyles, nonce));
+      let titleHtml = "";
+      if (title != null) {
+        titleHtml = headTags.noScripts ? `<title data-dh="title">${escape(title)}</title>` : `<script${nonceAttr(nonce, "script")}>(function(x,t){(t=document.querySelector("title"))?(t.hasAttribute("data-dh")||t.setAttribute("data-dhf",t.textContent),t.textContent=x):(document.title=x,t=document.querySelector("title"));t&&t.setAttribute("data-dh","title")})(${JSON.stringify(title).replace(/</g, "\\u003C")})</script>`;
+      }
+      onHead(headPrelude + headTagsHtml + titleHtml + renderHeadAssets(emittedAssets, inlineStyles, nonce));
     }
     if (!scriptTag) return html;
     const xs = html.indexOf("<!--xs-->");
     return xs === -1 ? html + scriptTag : html.slice(0, xs) + scriptTag + html.slice(xs);
   }
+  if (title != null) {
+    const winner = escape(title);
+    const open = html.match(/<head(?:\s[^>]*)?>/);
+    const from = open ? open.index + open[0].length : 0;
+    const m = /<title(\s[^>]*)?>([\s\S]*?)<\/title>/.exec(html.slice(from, headIdx));
+    if (m) {
+      const at = from + m.index;
+      const stash = m[2].replace(/"/g, "&quot;");
+      html = html.slice(0, at) + `<title${m[1] || ""} data-dh="title" data-dhf="${stash}">${winner}</title>` + html.slice(at + m[0].length);
+      headIdx = html.indexOf("</head>");
+    } else {
+      headTagsHtml = `<title data-dh="title">${winner}</title>` + headTagsHtml;
+    }
+  }
   const head = headTagsHtml + renderHeadAssets(emittedAssets, inlineStyles, nonce);
   if (!scriptTag) return html.slice(0, headIdx) + head + html.slice(headIdx);
   const xsIdx = html.indexOf("<!--xs-->");
@@ -2353,9 +2465,11 @@ function assembleDocument(html, emittedAssets, inlineStyles, scripts, nonce, hea
 }
 function renderHeadAssets(emittedAssets, inlineStyles, nonce) {
   let head = "";
+  const styleAttr = nonceAttr(nonce, "style");
+  const scriptAttr = nonceAttr(nonce, "script");
   if (emittedAssets && emittedAssets.size) {
     for (const url of emittedAssets) {
-      head += isCssUrl(url) ? `<link rel="stylesheet" href="${url}">` : `<link rel="modulepreload" href="${url}">`;
+      head += isCssUrl(url) ? `<link rel="stylesheet" href="${url}"${styleAttr}>` : `<link rel="modulepreload" href="${url}"${scriptAttr}>`;
     }
   }
   if (inlineStyles && inlineStyles.size) {
@@ -2417,12 +2531,15 @@ function escapeStyleContent(content) {
 }
 function renderInlineStyle(entry, nonce) {
   let attrs = "";
+  let hasNonce = false;
   if (entry.attrs) {
     for (const name in entry.attrs) {
+      if (name.length === 5 && asciiLowerCase(name) === "nonce") hasNonce = true;
       attrs += ` ${name}="${escape(String(entry.attrs[name]), true)}"`;
     }
   }
-  return `<style${nonce ? ` nonce="${nonce}"` : ""} data-asset="${escape(entry.id, true)}"${attrs}>${escapeStyleContent(entry.content)}</style>`;
+  const nonceHtml = hasNonce ? "" : nonceAttr(nonce, "style");
+  return `<style${nonceHtml} data-asset="${escape(entry.id, true)}"${attrs}>${escapeStyleContent(entry.content)}</style>`;
 }
 function waitForFragments(registry, key) {
   for (const k of [...registry.keys()].reverse()) {
@@ -2875,6 +2992,7 @@ function renderServerComponent(component, options = {}) {
         ctx.commit = sink.commit;
         ctx.commitEpoch = () => sink.epoch;
         ctx.liveHoles = createLiveHoles(sink);
+        ctx.claims = CLAIMS_STREAM;
       }
       return serverComponentScope(() => component(props));
     };
@@ -3168,6 +3286,7 @@ function createDocumentSlotProps(clientProps, frameId) {
           return out;
         };
         fn.$lhSkip = true;
+        fn[CLAIM_PROP] = prop;
         getters.set(prop, fn);
       }
       return fn;
@@ -3299,6 +3418,7 @@ function frameTransformDirectResult(value, {
   },
   serverOwned(() => {
     armDocumentLiveHoles(sharedConfig.context);
+    sharedConfig.context.claims = CLAIMS_DOCUMENT;
     const slotProps = createDocumentSlotProps(props, id);
     return serverComponentScope(() => component(slotProps));
   }), {
@@ -3542,6 +3662,7 @@ function createSlotProps(sink, frame) {
           return slotRange(occurrence);
         };
         fn.$lhSkip = true;
+        fn[CLAIM_PROP] = prop;
         getters.set(prop, fn);
       }
       return fn;