unhead 3.0.5 → 3.1.0

package/dist/shared/unhead.ebqUBTt1.mjs

@@ -0,0 +1,513 @@
+const URL_META_KEYS = /* @__PURE__ */ new Set([
+  "og:url",
+  "og:image",
+  "og:image:url",
+  "og:image:secure_url",
+  "og:video",
+  "og:video:url",
+  "og:video:secure_url",
+  "og:audio",
+  "og:audio:url",
+  "og:audio:secure_url",
+  "twitter:image",
+  "twitter:image:src",
+  "twitter:player",
+  "twitter:player:stream"
+]);
+const KNOWN_META_PROPERTIES = /* @__PURE__ */ new Set([
+  "article:author",
+  "article:expiration_time",
+  "article:modified_time",
+  "article:published_time",
+  "article:section",
+  "article:tag",
+  "book:author",
+  "book:isbn",
+  "book:release_date",
+  "book:tag",
+  "fb:app_id",
+  "og:audio",
+  "og:audio:secure_url",
+  "og:audio:type",
+  "og:audio:url",
+  "og:description",
+  "og:determiner",
+  "og:image",
+  "og:image:alt",
+  "og:image:height",
+  "og:image:secure_url",
+  "og:image:type",
+  "og:image:url",
+  "og:image:width",
+  "og:locale",
+  "og:locale:alternate",
+  "og:site_name",
+  "og:title",
+  "og:type",
+  "og:url",
+  "og:video",
+  "og:video:alt",
+  "og:video:duration",
+  "og:video:height",
+  "og:video:secure_url",
+  "og:video:type",
+  "og:video:url",
+  "og:video:width",
+  "profile:first_name",
+  "profile:gender",
+  "profile:last_name",
+  "profile:username"
+]);
+const KNOWN_META_NAMES = /* @__PURE__ */ new Set([
+  "apple-itunes-app",
+  "apple-mobile-web-app-capable",
+  "apple-mobile-web-app-status-bar-style",
+  "apple-mobile-web-app-title",
+  "application-name",
+  "author",
+  "color-scheme",
+  "creator",
+  "description",
+  "fb:app_id",
+  "fediverse:creator",
+  "format-detection",
+  "generator",
+  "google-site-verification",
+  "google",
+  "googlebot",
+  "keywords",
+  "mobile-web-app-capable",
+  "msapplication-config",
+  "msapplication-tilecolor",
+  "msapplication-tileimage",
+  "publisher",
+  "rating",
+  "referrer",
+  "robots",
+  "theme-color",
+  "viewport",
+  "twitter:app:id:googleplay",
+  "twitter:app:id:ipad",
+  "twitter:app:id:iphone",
+  "twitter:app:name:googleplay",
+  "twitter:app:name:ipad",
+  "twitter:app:name:iphone",
+  "twitter:app:url:googleplay",
+  "twitter:app:url:ipad",
+  "twitter:app:url:iphone",
+  "twitter:card",
+  "twitter:creator",
+  "twitter:creator:id",
+  "twitter:data:1",
+  "twitter:data:2",
+  "twitter:description",
+  "twitter:image",
+  "twitter:image:alt",
+  "twitter:label:1",
+  "twitter:label:2",
+  "twitter:player",
+  "twitter:player:height",
+  "twitter:player:stream",
+  "twitter:player:width",
+  "twitter:site",
+  "twitter:site:id",
+  "twitter:title"
+]);
+const TAG_PRIORITY_ALIASES = ["critical", "high", "low"];
+const DEPRECATED_PROPS = {
+  children: { replacement: "innerHTML", ruleId: "deprecated-prop-children" },
+  hid: { replacement: "key", ruleId: "deprecated-prop-hid-vmid" },
+  vmid: { replacement: "key", ruleId: "deprecated-prop-hid-vmid" },
+  body: { replacement: "tagPosition: 'bodyClose'", ruleId: "deprecated-prop-body" }
+};
+
+function levenshtein(a, b) {
+  const m = a.length;
+  const n = b.length;
+  const d = Array.from({ length: n + 1 }, (_, i) => i);
+  for (let i = 1; i <= m; i++) {
+    let prev = i - 1;
+    d[0] = i;
+    for (let j = 1; j <= n; j++) {
+      const tmp = d[j];
+      d[j] = a[i - 1] === b[j - 1] ? prev : 1 + Math.min(prev, d[j], d[j - 1]);
+      prev = tmp;
+    }
+  }
+  return d[n];
+}
+function findClosestMatch(value, knownSet) {
+  const threshold = value.length <= 8 ? 2 : 3;
+  let best;
+  let bestDist = threshold + 1;
+  for (const known of knownSet) {
+    if (Math.abs(known.length - value.length) > threshold)
+      continue;
+    const dist = levenshtein(value, known);
+    if (dist < bestDist) {
+      bestDist = dist;
+      best = known;
+    }
+  }
+  return best;
+}
+
+const emptyMetaContent = (tag) => {
+  if (tag.tagType !== "meta")
+    return [];
+  if (!tag.keys.has("content"))
+    return [];
+  if (tag.props.content !== "")
+    return [];
+  const key = typeof tag.props.name === "string" && tag.props.name || typeof tag.props.property === "string" && tag.props.property || "meta";
+  const diag = {
+    ruleId: "empty-meta-content",
+    message: `Meta tag "${key}" has empty content.`,
+    at: { kind: "prop", key: "content" }
+  };
+  return [diag];
+};
+
+const noDeprecatedProps = (tag) => {
+  const out = [];
+  for (const key of tag.keys) {
+    if (!(key in DEPRECATED_PROPS))
+      continue;
+    const { replacement } = DEPRECATED_PROPS[key];
+    if (key === "body") {
+      if (tag.props.body !== true)
+        continue;
+      const fix2 = tag.keys.has("tagPosition") ? void 0 : { type: "replace-prop", key: "body", newSource: `tagPosition: 'bodyClose'` };
+      out.push({
+        ruleId: "deprecated-prop-body",
+        message: `"body" was removed in v3 of unhead. Use "${replacement}" instead.`,
+        at: { kind: "prop", key },
+        fix: fix2
+      });
+      continue;
+    }
+    const newKey = key === "children" ? "innerHTML" : "key";
+    const fix = tag.keys.has(newKey) ? void 0 : { type: "rename-prop", key, newKey };
+    out.push({
+      ruleId: key === "children" ? "deprecated-prop-children" : "deprecated-prop-hid-vmid",
+      message: `"${key}" was removed in v3 of unhead. Use "${replacement}" instead.`,
+      at: { kind: "prop", key },
+      fix
+    });
+  }
+  return out;
+};
+
+const HTML_CHARS_RE = /[<>]/;
+const noHtmlInTitle = (input) => {
+  const title = input.props.title;
+  if (typeof title !== "string" || !HTML_CHARS_RE.test(title))
+    return [];
+  const diag = {
+    ruleId: "html-in-title",
+    message: `Title contains HTML characters which will be escaped, not rendered: "${title}".`,
+    at: { kind: "prop-value", key: "title" }
+  };
+  return [diag];
+};
+
+const OG_PREFIX_RE = /^(?:og|article|book|profile|fb):/;
+const noUnknownMeta = (tag) => {
+  if (tag.tagType !== "meta")
+    return [];
+  const out = [];
+  const property = tag.props.property;
+  if (typeof property === "string" && !KNOWN_META_PROPERTIES.has(property) && OG_PREFIX_RE.test(property)) {
+    const suggestion = findClosestMatch(property, KNOWN_META_PROPERTIES);
+    if (suggestion) {
+      out.push({
+        ruleId: "possible-typo",
+        message: `Unknown meta property "${property}". Did you mean "${suggestion}"?`,
+        at: { kind: "prop-value", key: "property" },
+        fix: { type: "replace-prop-value", key: "property", newSource: `'${suggestion}'` }
+      });
+    }
+  }
+  const name = tag.props.name;
+  if (typeof name === "string") {
+    const lower = name.toLowerCase();
+    if (!KNOWN_META_NAMES.has(lower) && (lower.startsWith("twitter:") || lower.startsWith("fediverse:") || !lower.includes(":"))) {
+      const suggestion = findClosestMatch(lower, KNOWN_META_NAMES);
+      if (suggestion) {
+        out.push({
+          ruleId: "possible-typo",
+          message: `Unknown meta name "${name}". Did you mean "${suggestion}"?`,
+          at: { kind: "prop-value", key: "name" },
+          fix: { type: "replace-prop-value", key: "name", newSource: `'${suggestion}'` }
+        });
+      }
+    }
+  }
+  return out;
+};
+
+function isAbsolute(url) {
+  return url.startsWith("http://") || url.startsWith("https://");
+}
+const nonAbsoluteCanonical = (tag) => {
+  if (tag.tagType !== "link")
+    return [];
+  if (tag.props.rel !== "canonical")
+    return [];
+  const href = tag.props.href;
+  if (typeof href !== "string")
+    return [];
+  if (isAbsolute(href))
+    return [];
+  const diag = {
+    ruleId: "non-absolute-canonical",
+    message: `Canonical URL should be absolute, received "${href}".`,
+    at: { kind: "prop-value", key: "href" }
+  };
+  return [diag];
+};
+
+const ALIASES = ["critical", "high", "low"];
+const numericTagPriority = (tag) => {
+  const value = tag.props.tagPriority;
+  if (typeof value !== "number")
+    return [];
+  const diag = {
+    ruleId: "numeric-tag-priority",
+    message: `Numeric tagPriority (${value}) is brittle. Prefer an alias ('critical' | 'high' | 'low') or 'before:<key>' / 'after:<key>'.`,
+    at: { kind: "prop-value", key: "tagPriority" },
+    suggestions: ALIASES.map((alias) => ({
+      message: `Replace with '${alias}'`,
+      fix: { type: "replace-prop-value", key: "tagPriority", newSource: `'${alias}'` }
+    }))
+  };
+  return [diag];
+};
+
+const TAG_TO_HELPER = {
+  link: "defineLink",
+  script: "defineScript"
+};
+const preferDefineHelpers = (tag, ctx) => {
+  if (!tag.inArray)
+    return [];
+  const helper = TAG_TO_HELPER[tag.tagType];
+  if (!helper)
+    return [];
+  const localName = ctx?.importedHelpers?.get(helper);
+  const imported = localName !== void 0;
+  const fix = { type: "wrap-tag", wrapWith: localName ?? helper };
+  const diag = {
+    ruleId: "prefer-define-helpers",
+    message: `Wrap this ${tag.tagType} entry in \`${helper}()\` so unhead can narrow its type.`,
+    fix: imported ? fix : void 0,
+    suggestions: imported ? void 0 : [{ message: `Wrap in \`${helper}()\` (you may need to import it).`, fix: { type: "wrap-tag", wrapWith: helper } }]
+  };
+  return [diag];
+};
+
+const preloadMissingAs = (tag) => {
+  if (tag.tagType !== "link")
+    return [];
+  if (tag.props.rel !== "preload")
+    return [];
+  if (tag.keys.has("as"))
+    return [];
+  const diag = {
+    ruleId: "preload-missing-as",
+    message: 'Preload link is missing the required "as" attribute.'
+  };
+  return [diag];
+};
+const preloadFontCrossorigin = (tag) => {
+  if (tag.tagType !== "link")
+    return [];
+  if (tag.props.rel !== "preload")
+    return [];
+  if (tag.props.as !== "font")
+    return [];
+  if (tag.keys.has("crossorigin"))
+    return [];
+  const diag = {
+    ruleId: "preload-font-crossorigin",
+    message: 'Font preload requires "crossorigin" \u2014 without it the font will be fetched twice.',
+    fix: { type: "insert-after-prop", afterKey: "as", insert: `, crossorigin: 'anonymous'` }
+  };
+  return [diag];
+};
+
+const robotsConflict = (tag) => {
+  if (tag.tagType !== "meta")
+    return [];
+  if (tag.props.name !== "robots")
+    return [];
+  const content = tag.props.content;
+  if (typeof content !== "string")
+    return [];
+  const directives = content.toLowerCase().split(",").map((d) => d.trim());
+  const out = [];
+  if (directives.includes("index") && directives.includes("noindex")) {
+    out.push({
+      ruleId: "robots-conflict",
+      message: 'Robots meta has conflicting "index" and "noindex" directives.'
+    });
+  }
+  if (directives.includes("follow") && directives.includes("nofollow")) {
+    out.push({
+      ruleId: "robots-conflict",
+      message: 'Robots meta has conflicting "follow" and "nofollow" directives.'
+    });
+  }
+  return out;
+};
+
+const deferOnModuleScript = (tag) => {
+  if (tag.tagType !== "script")
+    return [];
+  if (tag.props.type !== "module")
+    return [];
+  if (tag.props.defer !== true)
+    return [];
+  const diag = {
+    ruleId: "defer-on-module-script",
+    message: '"defer" is redundant on module scripts. Modules are deferred by default.',
+    at: { kind: "prop", key: "defer" },
+    fix: { type: "remove-prop", key: "defer" }
+  };
+  return [diag];
+};
+const scriptSrcWithContent = (tag) => {
+  if (tag.tagType !== "script")
+    return [];
+  if (typeof tag.props.src !== "string")
+    return [];
+  const hasInner = tag.keys.has("innerHTML") && tag.props.innerHTML !== "" || tag.keys.has("textContent") && tag.props.textContent !== "";
+  if (!hasInner)
+    return [];
+  const diag = {
+    ruleId: "script-src-with-content",
+    message: 'Script has both "src" and inline content. The browser will ignore the inline content.'
+  };
+  return [diag];
+};
+
+const NUMERIC_RE = /^\d+$/;
+const twitterHandleMissingAt = (tag) => {
+  if (tag.tagType !== "meta")
+    return [];
+  const name = tag.props.name;
+  if (name !== "twitter:site" && name !== "twitter:creator")
+    return [];
+  const content = tag.props.content;
+  if (typeof content !== "string")
+    return [];
+  if (content.startsWith("@") || NUMERIC_RE.test(content))
+    return [];
+  const fixedSource = JSON.stringify(`@${content}`);
+  const diag = {
+    ruleId: "twitter-handle-missing-at",
+    message: `${name} should start with "@", received "${content}".`,
+    at: { kind: "prop-value", key: "content" },
+    fix: { type: "replace-prop-value", key: "content", newSource: fixedSource }
+  };
+  return [diag];
+};
+
+const USER_SCALABLE_NO_RE = /user-scalable\s*=\s*(?:no|0|false)(?:[\s,;]|$)/i;
+const MAX_SCALE_RE = /maximum-scale\s*=\s*1(?:\.\d+)?(?:[\s,;]|$)/i;
+const viewportUserScalable = (tag) => {
+  if (tag.tagType !== "meta")
+    return [];
+  if (tag.props.name !== "viewport")
+    return [];
+  const content = tag.props.content;
+  if (typeof content !== "string")
+    return [];
+  const out = [];
+  if (USER_SCALABLE_NO_RE.test(content)) {
+    out.push({
+      ruleId: "viewport-user-scalable",
+      message: 'viewport "user-scalable=no" prevents zooming and harms accessibility.'
+    });
+  }
+  if (MAX_SCALE_RE.test(content)) {
+    out.push({
+      ruleId: "viewport-user-scalable",
+      message: 'viewport "maximum-scale=1" limits zooming and may harm accessibility.'
+    });
+  }
+  return out;
+};
+
+const TAG_TYPES = /* @__PURE__ */ new Set(["meta", "link", "script", "noscript", "style"]);
+function tagInputFromRuntime(tag) {
+  if (!TAG_TYPES.has(tag.tag))
+    return void 0;
+  const props = {};
+  const keys = /* @__PURE__ */ new Set();
+  for (const [k, v] of Object.entries(tag.props)) {
+    keys.add(k);
+    if (v == null) {
+      if (tag.tag === "meta" && k === "content")
+        props[k] = "";
+      continue;
+    }
+    if (typeof v === "string" || typeof v === "number" || typeof v === "boolean") {
+      if (tag.tag === "meta" && k === "name" && typeof v === "string")
+        props[k] = v.toLowerCase();
+      else
+        props[k] = v;
+    } else {
+      props[k] = String(v);
+    }
+  }
+  if (tag.tag === "script" || tag.tag === "style" || tag.tag === "noscript") {
+    if (tag.innerHTML != null && tag.innerHTML !== "")
+      keys.add("innerHTML");
+    if (tag.textContent != null && tag.textContent !== "")
+      keys.add("textContent");
+  }
+  if (tag.tagPriority != null) {
+    keys.add("tagPriority");
+    if (typeof tag.tagPriority === "string" || typeof tag.tagPriority === "number")
+      props.tagPriority = tag.tagPriority;
+  }
+  return {
+    tagType: tag.tag,
+    props,
+    keys
+  };
+}
+function titleInputFromRuntime(titleTag) {
+  if (titleTag.tag !== "title")
+    return void 0;
+  const text = titleTag.textContent ?? titleTag.innerHTML ?? "";
+  return {
+    callee: "runtime",
+    props: { title: text },
+    keys: /* @__PURE__ */ new Set(["title"])
+  };
+}
+
+const tagPredicates = {
+  "defer-on-module-script": deferOnModuleScript,
+  "empty-meta-content": emptyMetaContent,
+  "no-deprecated-props": noDeprecatedProps,
+  "no-unknown-meta": noUnknownMeta,
+  "non-absolute-canonical": nonAbsoluteCanonical,
+  "numeric-tag-priority": numericTagPriority,
+  "preload-font-crossorigin": preloadFontCrossorigin,
+  "preload-missing-as": preloadMissingAs,
+  "robots-conflict": robotsConflict,
+  "script-src-with-content": scriptSrcWithContent,
+  "twitter-handle-missing-at": twitterHandleMissingAt,
+  "viewport-user-scalable": viewportUserScalable
+};
+const migrationTagPredicates = {
+  "prefer-define-helpers": preferDefineHelpers
+};
+const headInputPredicates = {
+  "no-html-in-title": noHtmlInTitle
+};
+
+export { DEPRECATED_PROPS as D, KNOWN_META_NAMES as K, TAG_PRIORITY_ALIASES as T, URL_META_KEYS as U, KNOWN_META_PROPERTIES as a, noHtmlInTitle as b, noUnknownMeta as c, deferOnModuleScript as d, emptyMetaContent as e, findClosestMatch as f, nonAbsoluteCanonical as g, headInputPredicates as h, numericTagPriority as i, preloadFontCrossorigin as j, preloadMissingAs as k, levenshtein as l, migrationTagPredicates as m, noDeprecatedProps as n, tagPredicates as o, preferDefineHelpers as p, titleInputFromRuntime as q, robotsConflict as r, scriptSrcWithContent as s, tagInputFromRuntime as t, twitterHandleMissingAt as u, viewportUserScalable as v };

package/dist/stream/client.d.mts

@@ -1,13 +1,32 @@
 import { C as ClientUnhead } from '../shared/unhead.Cv5yrrUd.mjs';
-import { c as CreateClientHeadOptions, U as Unhead } from '../shared/unhead.BoZ-Ul8T.mjs';
 import { aP as SerializableHead, aw as ResolvableHead } from '../shared/unhead.DeoGMp34.mjs';
+import { U as Unhead, c as CreateClientHeadOptions } from '../shared/unhead.BoZ-Ul8T.mjs';
 import 'hookable';
 
-interface UnheadStreamQueue {
+/**
+ * Shape of the streaming queue written to `window[streamKey]` (default
+ * `window.__unhead__`) by the server-emitted bootstrap script. The client
+ * IIFE reads from it to replay queued entries, and the streaming client
+ * wraps the resulting head instance.
+ *
+ * Both the server bootstrap (`createBootstrapScript`) and the client
+ * (`createStreamableHead`, iife) must agree on this shape.
+ */
+interface StreamingGlobal {
+    /** Queued entry batches pushed before the client IIFE took over. */
     _q: SerializableHead[][];
+    /** Resolved Unhead instance, populated once the IIFE initialises. */
     _head?: Unhead<any>;
+    /** True while framework hydration is in progress (client push suppression). */
+    _hydrationLocked?: () => boolean;
+    /** Push an entry batch onto the queue (pre-init) or the head (post-init). */
     push: (entries: SerializableHead[]) => void;
 }
+/**
+ * @deprecated Use `StreamingGlobal` instead. Kept as an alias for back-compat.
+ */
+type UnheadStreamQueue = StreamingGlobal;
+
 declare const DEFAULT_STREAM_KEY = "__unhead__";
 interface CreateStreamableClientHeadOptions extends Omit<CreateClientHeadOptions, 'render'> {
     streamKey?: string;
@@ -19,4 +38,4 @@ interface CreateStreamableClientHeadOptions extends Omit<CreateClientHeadOptions
 declare function createStreamableHead<T = ResolvableHead>(options?: CreateStreamableClientHeadOptions): ClientUnhead<T> | undefined;
 
 export { DEFAULT_STREAM_KEY, createStreamableHead };
-export type { CreateStreamableClientHeadOptions, UnheadStreamQueue };
+export type { CreateStreamableClientHeadOptions, StreamingGlobal, UnheadStreamQueue };

package/dist/stream/client.d.ts

@@ -1,13 +1,32 @@
 import { C as ClientUnhead } from '../shared/unhead.-D8hRpkn.js';
-import { c as CreateClientHeadOptions, U as Unhead } from '../shared/unhead.gui9LmZS.js';
 import { aP as SerializableHead, aw as ResolvableHead } from '../shared/unhead.DeoGMp34.js';
+import { U as Unhead, c as CreateClientHeadOptions } from '../shared/unhead.gui9LmZS.js';
 import 'hookable';
 
-interface UnheadStreamQueue {
+/**
+ * Shape of the streaming queue written to `window[streamKey]` (default
+ * `window.__unhead__`) by the server-emitted bootstrap script. The client
+ * IIFE reads from it to replay queued entries, and the streaming client
+ * wraps the resulting head instance.
+ *
+ * Both the server bootstrap (`createBootstrapScript`) and the client
+ * (`createStreamableHead`, iife) must agree on this shape.
+ */
+interface StreamingGlobal {
+    /** Queued entry batches pushed before the client IIFE took over. */
     _q: SerializableHead[][];
+    /** Resolved Unhead instance, populated once the IIFE initialises. */
     _head?: Unhead<any>;
+    /** True while framework hydration is in progress (client push suppression). */
+    _hydrationLocked?: () => boolean;
+    /** Push an entry batch onto the queue (pre-init) or the head (post-init). */
     push: (entries: SerializableHead[]) => void;
 }
+/**
+ * @deprecated Use `StreamingGlobal` instead. Kept as an alias for back-compat.
+ */
+type UnheadStreamQueue = StreamingGlobal;
+
 declare const DEFAULT_STREAM_KEY = "__unhead__";
 interface CreateStreamableClientHeadOptions extends Omit<CreateClientHeadOptions, 'render'> {
     streamKey?: string;
@@ -19,4 +38,4 @@ interface CreateStreamableClientHeadOptions extends Omit<CreateClientHeadOptions
 declare function createStreamableHead<T = ResolvableHead>(options?: CreateStreamableClientHeadOptions): ClientUnhead<T> | undefined;
 
 export { DEFAULT_STREAM_KEY, createStreamableHead };
-export type { CreateStreamableClientHeadOptions, UnheadStreamQueue };
+export type { CreateStreamableClientHeadOptions, StreamingGlobal, UnheadStreamQueue };

package/dist/stream/server.d.mts

@@ -67,9 +67,10 @@ declare function createStreamableHead<T = ResolvableHead>(options?: CreateStream
  * use this directly to inject the bootstrap into your shell `<head>`.
  *
  * @param streamKey - The window property name for the stream queue (default: '__unhead__')
+ * @param nonce - Optional CSP nonce to stamp on the script tag
  * @returns An inline `<script>` tag string
  */
-declare function createBootstrapScript(streamKey?: string): string;
+declare function createBootstrapScript(streamKey?: string, nonce?: string): string;
 /**
  * Renders the current head state and clears entries atomically.
  *
@@ -166,8 +167,10 @@ interface StreamingTemplateParts {
 /**
  * @experimental
  *
- * Prepares a template for streaming SSR by splitting it at body tag boundaries
- * and injecting head content into both parts.
+ * Prepares a template for streaming SSR by splitting it at the SSR outlet
+ * marker (`<!--app-html-->` / `<!--ssr-outlet-->`) when present, so the
+ * streamed app content lands inside the mount container. Falls back to
+ * splitting at body tag boundaries when no marker is found.
  *
  * This is the recommended way to handle streaming templates as it:
  * - Uses consistent template parsing (same as transformHtmlTemplateRaw)

package/dist/stream/server.d.ts

@@ -67,9 +67,10 @@ declare function createStreamableHead<T = ResolvableHead>(options?: CreateStream
  * use this directly to inject the bootstrap into your shell `<head>`.
  *
  * @param streamKey - The window property name for the stream queue (default: '__unhead__')
+ * @param nonce - Optional CSP nonce to stamp on the script tag
  * @returns An inline `<script>` tag string
  */
-declare function createBootstrapScript(streamKey?: string): string;
+declare function createBootstrapScript(streamKey?: string, nonce?: string): string;
 /**
  * Renders the current head state and clears entries atomically.
  *
@@ -166,8 +167,10 @@ interface StreamingTemplateParts {
 /**
  * @experimental
  *
- * Prepares a template for streaming SSR by splitting it at body tag boundaries
- * and injecting head content into both parts.
+ * Prepares a template for streaming SSR by splitting it at the SSR outlet
+ * marker (`<!--app-html-->` / `<!--ssr-outlet-->`) when present, so the
+ * streamed app content lands inside the mount container. Falls back to
+ * splitting at body tag boundaries when no marker is found.
  *
  * This is the recommended way to handle streaming templates as it:
  * - Uses consistent template parsing (same as transformHtmlTemplateRaw)

package/dist/stream/server.mjs

@@ -42,9 +42,10 @@ function getStreamKey(head) {
   assertValidStreamKey(key);
   return key;
 }
-function createBootstrapScript(streamKey = DEFAULT_STREAM_KEY) {
+function createBootstrapScript(streamKey = DEFAULT_STREAM_KEY, nonce) {
   assertValidStreamKey(streamKey);
-  return `<script>window.${streamKey}={_q:[],push(e){this._q.push(e)}}<\/script>`;
+  const nonceAttr = nonce ? ` nonce="${nonce.replace(/"/g, "&quot;")}"` : "";
+  return `<script${nonceAttr}>window.${streamKey}={_q:[],push(e){this._q.push(e)}}<\/script>`;
 }
 function renderShell(head) {
   const result = head.render();
@@ -110,8 +111,18 @@ function prepareStreamingTemplate(head, template, preRenderedState) {
   const bodyEnd = parsed.indexes.bodyTagEnd;
   const bodyCloseStart = parsed.indexes.bodyCloseTagStart;
   if (bodyEnd >= 0 && bodyCloseStart >= 0) {
-    const shellPart = template.substring(0, bodyEnd);
     const bodyInterior = template.substring(bodyEnd, bodyCloseStart);
+    const markerMatch = bodyInterior.match(/<!--\s*(?:app-html|ssr-outlet)\s*-->/);
+    let beforeStream;
+    let afterStream;
+    if (markerMatch) {
+      beforeStream = bodyInterior.substring(0, markerMatch.index);
+      afterStream = bodyInterior.substring(markerMatch.index + markerMatch[0].length);
+    } else {
+      beforeStream = "";
+      afterStream = bodyInterior;
+    }
+    const shellPart = template.substring(0, bodyEnd) + beforeStream;
     const endPart = template.substring(bodyCloseStart);
     const shellParsed = parseHtmlForIndexes(`${shellPart}</body></html>`);
     const shell = applyHeadToHtml(shellParsed, {
@@ -122,7 +133,7 @@ function prepareStreamingTemplate(head, template, preRenderedState) {
     }).replace("</body></html>", "");
     return {
       shell,
-      end: bodyInterior + ssr.bodyTags + endPart
+      end: afterStream + ssr.bodyTags + endPart
     };
   }
   return {