@qwik.dev/core 2.0.0-beta.35 → 2.0.0-beta.36

package/dist/server.mjs

@@ -1,6 +1,6 @@
 /**
  * @license
- * @qwik.dev/core/server 2.0.0-beta.35-dev+4603135
+ * @qwik.dev/core/server 2.0.0-beta.36-dev+3268fab
  * Copyright QwikDev. All Rights Reserved.
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://github.com/QwikDev/qwik/blob/main/LICENSE
@@ -523,6 +523,11 @@ var VNodeDataChar = {
     "~"
   )
 };
+var getSegmentVNodeRefId = (segmentId, localIndex) => {
+  const segmentIndex = parseInt(segmentId, 10) - 1;
+  const diagonal = segmentIndex + localIndex;
+  return -(diagonal * (diagonal + 1) / 2 + localIndex + 1);
+};
 
 // packages/qwik/src/core/shared/utils/character-escaping.ts
 function escapeHTML(html) {
@@ -573,11 +578,44 @@ function encodeVNodeDataString(str) {
     return escapedHTML + str.substring(lastIdx);
   }
 }
+function encodeVNodeDataKey(str) {
+  const encoded = encodeURI(str);
+  let encodedKey = "";
+  const length = encoded.length;
+  let idx = 0;
+  let lastIdx = idx;
+  for (; idx < length; idx++) {
+    const ch = encoded.charCodeAt(idx);
+    let replacement = null;
+    if (ch === 59) {
+      replacement = "%3B";
+    } else if (ch === 61) {
+      replacement = "%3D";
+    } else if (ch === 63) {
+      replacement = "%3F";
+    } else if (ch === 64) {
+      replacement = "%40";
+    } else if (ch === 126) {
+      replacement = "%7E";
+    } else {
+      continue;
+    }
+    encodedKey += encoded.substring(lastIdx, idx) + replacement;
+    lastIdx = idx + 1;
+  }
+  if (lastIdx === 0) {
+    return encoded;
+  } else {
+    return encodedKey + encoded.substring(lastIdx);
+  }
+}
 
 // packages/qwik/src/core/shared/utils/markers.ts
 var OnRenderProp = "q:renderFn";
 var QSlot = "q:slot";
 var QSlotParent = "q:sparent";
+var QStatePatchAttr = "q:patch";
+var QSuspenseResolved = "q:r";
 var QStyle = "q:style";
 var QStyleSelector = "style[q\\:style]";
 var QStyleSSelector = "style[q\\:sstyle]";
@@ -607,15 +645,13 @@ var ELEMENT_PROPS = "q:props";
 var ELEMENT_SEQ = "q:seq";
 var ELEMENT_SEQ_IDX = "q:seqIdx";
 var ELEMENT_BACKPATCH_DATA = "qwik/backpatch";
-var Q_PREFIX = "q:";
 var ITERATION_ITEM_SINGLE = "q:p";
 var ITERATION_ITEM_MULTI = "q:ps";
 var NON_SERIALIZABLE_MARKER_PREFIX = ":";
 var USE_ON_LOCAL = NON_SERIALIZABLE_MARKER_PREFIX + "on";
 var USE_ON_LOCAL_SEQ_IDX = NON_SERIALIZABLE_MARKER_PREFIX + "onIdx";
 var USE_ON_LOCAL_FLAGS = NON_SERIALIZABLE_MARKER_PREFIX + "onFlags";
-var QCursorBoundary = Q_PREFIX + "cursorBoundary";
-var QNearestCursorBoundary = NON_SERIALIZABLE_MARKER_PREFIX + "nearestCursorBoundary";
+var NEAREST_CURSOR_BOUNDARY = NON_SERIALIZABLE_MARKER_PREFIX + "nearestCursorBoundary";
 var Q_PROPS_SEPARATOR = ":";
 var dangerouslySetInnerHTML = "dangerouslySetInnerHTML";
 
@@ -878,6 +914,26 @@ var isObjectEmpty = (obj) => {
   return true;
 };
 
+// packages/qwik/src/core/ssr/stream-writer.ts
+var stringifyRootRefPath = (path) => {
+  let text = String(path[0]);
+  for (let i = 1; i < path.length; i++) {
+    text += " " + path[i];
+  }
+  return text;
+};
+var writeStringRootRef = (writer, id) => writer.write(String(id));
+var writeStringRootRefPath = (writer, path) => writer.write(stringifyRootRefPath(path));
+var createStringStreamWriter = (write) => ({
+  write,
+  writeRootRef(id) {
+    return writeStringRootRef(this, id);
+  },
+  writeRootRefPath(path) {
+    return writeStringRootRefPath(this, path);
+  }
+});
+
 // packages/qwik/src/core/shared/ssr-const.ts
 var LT = "<";
 var GT = ">";
@@ -978,6 +1034,69 @@ import {
   isSignal
 } from "@qwik.dev/core/internal";
 
+// packages/qwik/src/server/ooos-utils.ts
+import { _SubscriptionPatch as SubscriptionPatch } from "@qwik.dev/core/internal";
+var recordExternalRootEffect = (rootCtx, segmentCtx, storeProxyMap, records, producer, effect, prop, sourceEffects) => {
+  if (!records || prop !== null && !sourceEffects) {
+    return;
+  }
+  let rootObj = producer;
+  if (prop !== null && producer && (typeof producer === "object" || typeof producer === "function")) {
+    rootObj = storeProxyMap.get(producer) || producer;
+  }
+  const rootId = rootCtx.$hasRootId$(rootObj);
+  segmentCtx.$addRoot$(rootObj);
+  segmentCtx.$addRoot$(effect);
+  if (prop !== null && typeof prop !== "string") {
+    segmentCtx.$addRoot$(prop);
+  }
+  records.push({
+    rootObj,
+    rootId,
+    effect,
+    prop
+  });
+};
+var collectSubscriptionPatches = (rootCtx, records, rootLimit) => {
+  if (!records?.length) {
+    return;
+  }
+  const patches = [];
+  const patchesByRoot = /* @__PURE__ */ new Map();
+  for (let i = 0; i < records.length; i++) {
+    const entry = records[i];
+    const rootId = entry.rootId === void 0 ? rootCtx.$hasRootId$(entry.rootObj) : entry.rootId;
+    if (rootId === void 0 || rootId >= rootLimit) {
+      continue;
+    }
+    let patch = patchesByRoot.get(rootId);
+    if (!patch) {
+      patch = new SubscriptionPatch(
+        rootId,
+        entry.prop === null ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Map()
+      );
+      patchesByRoot.set(rootId, patch);
+      patches.push(patch);
+    }
+    const subscriptions = patch.subscriptions;
+    if (entry.prop === null) {
+      if (subscriptions instanceof Set) {
+        subscriptions.add(entry.effect);
+      }
+    } else {
+      if (subscriptions instanceof Map) {
+        let effects = subscriptions.get(entry.prop);
+        if (!effects) {
+          effects = /* @__PURE__ */ new Set();
+          subscriptions.set(entry.prop, effects);
+        }
+        effects.add(entry.effect);
+      }
+    }
+  }
+  return patches.length ? patches : void 0;
+};
+
 // packages/qwik/src/server/preload-impl.ts
 import { getPlatform } from "@qwik.dev/core";
 var simplifyPath = (base2, path) => {
@@ -1048,9 +1167,7 @@ var preloaderPre = (container, options, nonce) => {
     if (nonce) {
       scriptAttrs["nonce"] = nonce;
     }
-    container.openElement("script", null, scriptAttrs, null, null, null);
-    container.write(script);
-    container.closeElement();
+    container.writeScript(scriptAttrs, script);
   }
   const corePath = simplifyPath(base2, resolvedManifest?.manifest.core);
   if (corePath) {
@@ -1105,9 +1222,7 @@ var includePreloader = (container, options, referencedBundles, nonce) => {
     if (nonce) {
       attrs["nonce"] = nonce;
     }
-    container.openElement("script", null, attrs, null, null, null);
-    container.write(script);
-    container.closeElement();
+    container.writeScript(attrs, script);
   }
   return null;
 };
@@ -1143,14 +1258,15 @@ var preLoaderOptionsDefault = {
 };
 
 // packages/qwik/src/server/scripts.ts
-var QWIK_LOADER_DEFAULT_MINIFIED = 'const e=document,t=window,r="w",n="wp",o="d",s="dp",i="e",c="ep",l="capture:",a=new Set,p=new Set([e]),q=new Map;let u,f,h;const d=(e,t)=>Array.from(e.querySelectorAll(t)),b=e=>{const t=[];return p.forEach(r=>t.push(...d(r,e))),t},m=(e,t,r,n=!1,o=!1)=>e.addEventListener(t,r,{capture:n,passive:o}),g=e=>{J(e);const t=d(e,"[q\\\\:shadowroot]");for(let e=0;e<t.length;e++){const r=t[e].shadowRoot;r&&g(r)}},v=e=>e&&"function"==typeof e.then,y=async e=>{for(let t=0;t<e.length;t++)await e[t]()},w=e=>{if(e.length){const t=()=>y(e);h=h?h.then(t,t):t()}},E=t=>{if(void 0===t._qwikjson_){let r=(t===e.documentElement?e.body:t).lastElementChild;for(;r;){if("SCRIPT"===r.tagName&&"qwik/json"===r.getAttribute("type")){t._qwikjson_=JSON.parse(r.textContent.replace(/\\\\x3C(\\/?script)/gi,"<$1"));break}r=r.previousElementSibling}}},A=(e,t)=>new CustomEvent(e,{detail:t}),C=(t,r)=>{e.dispatchEvent(A(t,r))},_=e=>e.replace(/([A-Z-])/g,e=>"-"+e.toLowerCase()),k=e=>e.replace(/-./g,e=>e[1].toUpperCase()),B=e=>{const t=e.indexOf(":");return{scope:e.slice(0,t),eventName:k(e.slice(t+1))}},S=e=>2===e.length,I=e=>e.charAt(0),N=e=>!!e&&1===e.nodeType,T=(e,t,r)=>e.hasAttribute(r)&&(!!e._qDispatch?.[t]||e.hasAttribute("q-"+t)),$=(t,r,n,o,s,i,c)=>{const l={qBase:n,symbol:i,element:r,reqTime:c};if(""===s){const r=t.getAttribute("q:instance"),n=(e["qFuncs_"+r]||[])[Number.parseInt(i)];if(!n){const e=Error("sym:"+i);C("qerror",{importError:"sync",error:e,...l}),console.error(e)}return n}const a=`${i}|${n}|${s}`,p=q.get(a);if(p)return p;const u=new URL(s,o).href,f=import(u);return E(t),f.then(e=>{const t=e[i];if(t)q.set(a,t),C("qsymbol",l);else{const e=Error(`${i} not in ${u}`);C("qerror",{importError:"no-symbol",error:e,...l}),console.error(e)}return t},e=>{C("qerror",{importError:"async",error:e,...l}),console.error(e)})},R=(t,r,n,o,s,i=!0)=>{let c=!1;s&&(i&&t.hasAttribute("preventdefault:"+s)&&r.preventDefault(),t.hasAttribute("stoppropagation:"+s)&&r.stopPropagation());const l=t._qDispatch?.[n];if(l){if("function"==typeof l){const e=()=>l(r,t);if(c)o.push(async()=>{const t=e();v(t)&&await t});else{const t=e();v(t)&&(c=!0,o.push(()=>t))}}else if(l.length)for(let e=0;e<l.length;e++){const n=l[e];if(n){const e=()=>n(r,t);if(c)o.push(async()=>{const t=e();v(t)&&await t});else{const t=e();v(t)&&(c=!0,o.push(()=>t))}}}return}const a=t.getAttribute("q-"+n);if(a){const n=t.closest("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])"),s=n.getAttribute("q:base"),i=new URL(s,e.baseURI),l=a.split("|");for(let e=0;e<l.length;e++){const a=l[e],p=performance.now(),[q,u,f]=a.split("#"),h=e=>{if(e&&t.isConnected)try{const n=e.call(f,r,t);if(v(n))return n.catch(e=>{C("qerror",{error:e,qBase:s,symbol:u,element:t,reqTime:p})})}catch(e){C("qerror",{error:e,qBase:s,symbol:u,element:t,reqTime:p})}},d=$(n,t,s,i,q,u,p);if(c||v(d))c=!0,o.push(async()=>{await h(v(d)?await d:d)});else{const e=h(d);v(e)&&(c=!0,o.push(()=>e))}}}},x=(e,t=i,r=!0)=>{const n=_(e.type),o=t+":"+n,s=l+n,c=[],a=[],p=[];let q=e.target;for(;q;)N(q)?(c.push(q),a.push(T(q,o,s)),q=q.parentElement):q=q.parentElement;for(let t=c.length-1;t>=0;t--)if(a[t]&&(R(c[t],e,o,p,n,r),e.cancelBubble||e.cancelBubble))return void w(p);for(let t=0;t<c.length;t++)if(!a[t]&&(R(c[t],e,o,p,n,r),!e.bubbles||e.cancelBubble||e.cancelBubble))return void w(p);w(p)},L=e=>x(e,c,!1),U=(e,t,r=!0)=>{const n=_(t.type),o=e+":"+n,s=b("[q-"+e+"\\\\:"+n+"]"),i=[];for(let e=0;e<s.length;e++){const c=s[e];R(c,t,o,i,n,r)}w(i)},j=e=>{U(o,e)},D=e=>{U(s,e,!1)},O=e=>{U(r,e)},P=e=>{U(n,e,!1)},F=()=>{const r=e.readyState;if("interactive"==r||"complete"==r){if(f=1,p.forEach(g),a.has("d:qinit")){a.delete("d:qinit");const e=A("qinit"),t=b("[q-d\\\\:qinit]"),r=[];for(let n=0;n<t.length;n++){const o=t[n];R(o,e,"d:qinit",r),o.removeAttribute("q-d:qinit")}w(r)}if(a.has("d:qidle")&&(a.delete("d:qidle"),(t.requestIdleCallback??t.setTimeout).bind(t)(()=>{const e=A("qidle"),t=b("[q-d\\\\:qidle]"),r=[];for(let n=0;n<t.length;n++){const o=t[n];R(o,e,"d:qidle",r),o.removeAttribute("q-d:qidle")}w(r)})),a.has("e:qvisible")){u||(u=new IntersectionObserver(e=>{const t=[];for(let r=0;r<e.length;r++){const n=e[r];n.isIntersecting&&(u.unobserve(n.target),R(n.target,A("qvisible",n),"e:qvisible",t))}w(t)}));const e=b("[q-e\\\\:qvisible]:not([q\\\\:observed])");for(let t=0;t<e.length;t++){const r=e[t];u.observe(r),r.setAttribute("q:observed","true")}}}},J=(...e)=>{for(let n=0;n<e.length;n++){const s=e[n];if("string"==typeof s){if(!a.has(s)){a.add(s);const{scope:e,eventName:n}=B(s),i=S(e),c=I(e);c===r?m(t,n,i?P:O,!0,i):p.forEach(e=>m(e,n,c===o?i?D:j:i?L:x,!0,i)),1!==f||"e:qvisible"!==s&&"d:qinit"!==s&&"d:qidle"!==s||F()}}else p.has(s)||(a.forEach(e=>{const{scope:t,eventName:n}=B(e),i=S(t),c=I(t);c!==r&&m(s,n,c===o?i?D:j:i?L:x,!0,i)}),p.add(s))}},M=t._qwikEv;M?.roots||(Array.isArray(M)?J(...M):J("e:click","e:input"),t._qwikEv={events:a,roots:p,push:J},m(e,"readystatechange",F),F())';
-var QWIK_LOADER_DEFAULT_DEBUG = 'const doc = document;\nconst win = window;\nconst windowPrefix = "w";\nconst passiveWindowPrefix = "wp";\nconst documentPrefix = "d";\nconst passiveDocumentPrefix = "dp";\nconst elementPrefix = "e";\nconst passiveElementPrefix = "ep";\nconst capturePrefix = "capture:";\nconst events = /* @__PURE__ */ new Set();\nconst roots = /* @__PURE__ */ new Set([doc]);\nconst symbols = /* @__PURE__ */ new Map();\nlet observer;\nlet hasInitialized;\nlet queuedTasks;\nconst nativeQuerySelectorAll = (root, selector) => Array.from(root.querySelectorAll(selector));\nconst querySelectorAll = (query) => {\n  const elements = [];\n  roots.forEach((root) => elements.push(...nativeQuerySelectorAll(root, query)));\n  return elements;\n};\nconst addEventListener = (el, eventName, handler, capture = false, passive = false) => el.addEventListener(eventName, handler, { capture, passive });\nconst findShadowRoots = (fragment) => {\n  addEventOrRoot(fragment);\n  const shadowRoots = nativeQuerySelectorAll(fragment, "[q\\\\:shadowroot]");\n  for (let i = 0; i < shadowRoots.length; i++) {\n    const parent = shadowRoots[i];\n    const shadowRoot = parent.shadowRoot;\n    shadowRoot && findShadowRoots(shadowRoot);\n  }\n};\nconst isPromise = (promise) => promise && typeof promise.then === "function";\nconst runTasks = async (tasks) => {\n  for (let i = 0; i < tasks.length; i++) {\n    await tasks[i]();\n  }\n};\nconst queueTasks = (tasks) => {\n  if (tasks.length) {\n    const run = () => runTasks(tasks);\n    queuedTasks = queuedTasks ? queuedTasks.then(run, run) : run();\n  }\n};\nconst resolveContainer = (containerEl) => {\n  if (containerEl._qwikjson_ === void 0) {\n    const parentJSON = containerEl === doc.documentElement ? doc.body : containerEl;\n    let script = parentJSON.lastElementChild;\n    while (script) {\n      if (script.tagName === "SCRIPT" && script.getAttribute("type") === "qwik/json") {\n        containerEl._qwikjson_ = JSON.parse(\n          script.textContent.replace(/\\\\x3C(\\/?script)/gi, "<$1")\n        );\n        break;\n      }\n      script = script.previousElementSibling;\n    }\n  }\n};\nconst createEvent = (eventName, detail) => new CustomEvent(eventName, { detail });\nconst emitEvent = (eventName, detail) => {\n  doc.dispatchEvent(createEvent(eventName, detail));\n};\nconst camelToKebab = (str) => str.replace(/([A-Z-])/g, (a) => "-" + a.toLowerCase());\nconst kebabToCamel = (eventName) => eventName.replace(/-./g, (a) => a[1].toUpperCase());\nconst parseKebabEvent = (event) => {\n  const separatorIndex = event.indexOf(":");\n  const scope = event.slice(0, separatorIndex);\n  return {\n    scope,\n    eventName: kebabToCamel(event.slice(separatorIndex + 1))\n  };\n};\nconst isPassiveScope = (scope) => scope.length === 2;\nconst getRootScope = (scope) => scope.charAt(0);\nconst isElementNode = (node) => !!node && node.nodeType === 1;\nconst isCaptureHandlerElement = (element, scopedKebabName, captureAttribute) => element.hasAttribute(captureAttribute) && (!!element._qDispatch?.[scopedKebabName] || element.hasAttribute("q-" + scopedKebabName));\nconst resolveHandler = (container, element, qBase, base, chunk, symbol, reqTime) => {\n  const eventData = {\n    qBase,\n    symbol,\n    element,\n    reqTime\n  };\n  if (chunk === "") {\n    const hash = container.getAttribute("q:instance");\n    const handler2 = (doc["qFuncs_" + hash] || [])[Number.parseInt(symbol)];\n    if (!handler2) {\n      const error = new Error("sym:" + symbol);\n      emitEvent("qerror", {\n        importError: "sync",\n        error,\n        ...eventData\n      });\n      console.error(error);\n    }\n    return handler2;\n  }\n  const key = `${symbol}|${qBase}|${chunk}`;\n  const handler = symbols.get(key);\n  if (handler) {\n    return handler;\n  }\n  const href = new URL(chunk, base).href;\n  const module = import(\n        href\n  );\n  resolveContainer(container);\n  return module.then(\n    (module2) => {\n      const handler2 = module2[symbol];\n      if (!handler2) {\n        const error = new Error(`${symbol} not in ${href}`);\n        emitEvent("qerror", {\n          importError: "no-symbol",\n          error,\n          ...eventData\n        });\n        console.error(error);\n      } else {\n        symbols.set(key, handler2);\n        emitEvent("qsymbol", eventData);\n      }\n      return handler2;\n    },\n    (error) => {\n      emitEvent("qerror", {\n        importError: "async",\n        error,\n        ...eventData\n      });\n      console.error(error);\n      return void 0;\n    }\n  );\n};\nconst dispatch = (element, ev, scopedKebabName, tasks, kebabName, allowPreventDefault = true) => {\n  let defer = false;\n  if (kebabName) {\n    if (allowPreventDefault && element.hasAttribute("preventdefault:" + kebabName)) {\n      ev.preventDefault();\n    }\n    if (element.hasAttribute("stoppropagation:" + kebabName)) {\n      ev.stopPropagation();\n    }\n  }\n  const handlers = element._qDispatch?.[scopedKebabName];\n  if (handlers) {\n    if (typeof handlers === "function") {\n      const run = () => handlers(ev, element);\n      if (defer) {\n        tasks.push(async () => {\n          const result = run();\n          if (isPromise(result)) {\n            await result;\n          }\n        });\n      } else {\n        const result = run();\n        if (isPromise(result)) {\n          defer = true;\n          tasks.push(() => result);\n        }\n      }\n    } else if (handlers.length) {\n      for (let i = 0; i < handlers.length; i++) {\n        const handler = handlers[i];\n        if (handler) {\n          const run = () => handler(ev, element);\n          if (defer) {\n            tasks.push(async () => {\n              const result = run();\n              if (isPromise(result)) {\n                await result;\n              }\n            });\n          } else {\n            const result = run();\n            if (isPromise(result)) {\n              defer = true;\n              tasks.push(() => result);\n            }\n          }\n        }\n      }\n    }\n    return;\n  }\n  const attrValue = element.getAttribute("q-" + scopedKebabName);\n  if (attrValue) {\n    const container = element.closest(\n      "[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])"\n    );\n    const qBase = container.getAttribute("q:base");\n    const base = new URL(qBase, doc.baseURI);\n    const qrls = attrValue.split("|");\n    for (let i = 0; i < qrls.length; i++) {\n      const qrl = qrls[i];\n      const reqTime = performance.now();\n      const [chunk, symbol, capturedIds] = qrl.split("#");\n      const run = (handler2) => {\n        if (handler2 && element.isConnected) {\n          try {\n            const result = handler2.call(capturedIds, ev, element);\n            if (isPromise(result)) {\n              return result.catch((error) => {\n                emitEvent("qerror", {\n                  error,\n                  qBase,\n                  symbol,\n                  element,\n                  reqTime\n                });\n              });\n            }\n          } catch (error) {\n            emitEvent("qerror", {\n              error,\n              qBase,\n              symbol,\n              element,\n              reqTime\n            });\n          }\n        }\n      };\n      const handler = resolveHandler(container, element, qBase, base, chunk, symbol, reqTime);\n      if (defer || isPromise(handler)) {\n        defer = true;\n        tasks.push(async () => {\n          await run(isPromise(handler) ? await handler : handler);\n        });\n      } else {\n        const result = run(handler);\n        if (isPromise(result)) {\n          defer = true;\n          tasks.push(() => result);\n        }\n      }\n    }\n  }\n};\nconst processElementEvent = (ev, scope = elementPrefix, allowPreventDefault = true) => {\n  const kebabName = camelToKebab(ev.type);\n  const scopedKebabName = scope + ":" + kebabName;\n  const captureAttribute = capturePrefix + kebabName;\n  const elements = [];\n  const captureHandlers = [];\n  const tasks = [];\n  let current = ev.target;\n  while (current) {\n    if (isElementNode(current)) {\n      elements.push(current);\n      captureHandlers.push(isCaptureHandlerElement(current, scopedKebabName, captureAttribute));\n      current = current.parentElement;\n    } else {\n      current = current.parentElement;\n    }\n  }\n  for (let i = elements.length - 1; i >= 0; i--) {\n    if (captureHandlers[i]) {\n      dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n      const continuePropagation = !ev.cancelBubble;\n      if (!continuePropagation || ev.cancelBubble) {\n        queueTasks(tasks);\n        return;\n      }\n    }\n  }\n  for (let i = 0; i < elements.length; i++) {\n    if (!captureHandlers[i]) {\n      dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n      const doBubble = ev.bubbles && !ev.cancelBubble;\n      if (!doBubble || ev.cancelBubble) {\n        queueTasks(tasks);\n        return;\n      }\n    }\n  }\n  queueTasks(tasks);\n};\nconst processPassiveElementEvent = (ev) => processElementEvent(ev, passiveElementPrefix, false);\nconst broadcast = (scope, ev, allowPreventDefault = true) => {\n  const kebabName = camelToKebab(ev.type);\n  const scopedKebabName = scope + ":" + kebabName;\n  const elements = querySelectorAll("[q-" + scope + "\\\\:" + kebabName + "]");\n  const tasks = [];\n  for (let i = 0; i < elements.length; i++) {\n    const el = elements[i];\n    dispatch(el, ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n  }\n  queueTasks(tasks);\n};\nconst processDocumentEvent = (ev) => {\n  broadcast(documentPrefix, ev);\n};\nconst processPassiveDocumentEvent = (ev) => {\n  broadcast(passiveDocumentPrefix, ev, false);\n};\nconst processWindowEvent = (ev) => {\n  broadcast(windowPrefix, ev);\n};\nconst processPassiveWindowEvent = (ev) => {\n  broadcast(passiveWindowPrefix, ev, false);\n};\nconst processReadyStateChange = () => {\n  const readyState = doc.readyState;\n  if (readyState == "interactive" || readyState == "complete") {\n    hasInitialized = 1;\n    roots.forEach(findShadowRoots);\n    if (events.has("d:qinit")) {\n      events.delete("d:qinit");\n      const ev = createEvent("qinit");\n      const elements = querySelectorAll("[q-d\\\\:qinit]");\n      const tasks = [];\n      for (let i = 0; i < elements.length; i++) {\n        const el = elements[i];\n        dispatch(el, ev, "d:qinit", tasks);\n        el.removeAttribute("q-d:qinit");\n      }\n      queueTasks(tasks);\n    }\n    if (events.has("d:qidle")) {\n      events.delete("d:qidle");\n      const riC = win.requestIdleCallback ?? win.setTimeout;\n      riC.bind(win)(() => {\n        const ev = createEvent("qidle");\n        const elements = querySelectorAll("[q-d\\\\:qidle]");\n        const tasks = [];\n        for (let i = 0; i < elements.length; i++) {\n          const el = elements[i];\n          dispatch(el, ev, "d:qidle", tasks);\n          el.removeAttribute("q-d:qidle");\n        }\n        queueTasks(tasks);\n      });\n    }\n    if (events.has("e:qvisible")) {\n      observer || (observer = new IntersectionObserver((entries) => {\n        const tasks = [];\n        for (let i = 0; i < entries.length; i++) {\n          const entry = entries[i];\n          if (entry.isIntersecting) {\n            observer.unobserve(entry.target);\n            dispatch(\n              entry.target,\n              createEvent("qvisible", entry),\n              "e:qvisible",\n              tasks\n            );\n          }\n        }\n        queueTasks(tasks);\n      }));\n      const elements = querySelectorAll("[q-e\\\\:qvisible]:not([q\\\\:observed])");\n      for (let i = 0; i < elements.length; i++) {\n        const el = elements[i];\n        observer.observe(el);\n        el.setAttribute("q:observed", "true");\n      }\n    }\n  }\n};\nconst addEventOrRoot = (...eventNames) => {\n  for (let i = 0; i < eventNames.length; i++) {\n    const eventNameOrRoot = eventNames[i];\n    if (typeof eventNameOrRoot === "string") {\n      if (!events.has(eventNameOrRoot)) {\n        events.add(eventNameOrRoot);\n        const { scope, eventName } = parseKebabEvent(eventNameOrRoot);\n        const passive = isPassiveScope(scope);\n        const rootScope = getRootScope(scope);\n        if (rootScope === windowPrefix) {\n          addEventListener(\n            win,\n            eventName,\n            passive ? processPassiveWindowEvent : processWindowEvent,\n            true,\n            passive\n          );\n        } else {\n          roots.forEach(\n            (root) => addEventListener(\n              root,\n              eventName,\n              rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent,\n              true,\n              passive\n            )\n          );\n        }\n        if (hasInitialized === 1 && (eventNameOrRoot === "e:qvisible" || eventNameOrRoot === "d:qinit" || eventNameOrRoot === "d:qidle")) {\n          processReadyStateChange();\n        }\n      }\n    } else {\n      if (!roots.has(eventNameOrRoot)) {\n        events.forEach((kebabEventName) => {\n          const { scope, eventName } = parseKebabEvent(kebabEventName);\n          const passive = isPassiveScope(scope);\n          const rootScope = getRootScope(scope);\n          if (rootScope !== windowPrefix) {\n            addEventListener(\n              eventNameOrRoot,\n              eventName,\n              rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent,\n              true,\n              passive\n            );\n          }\n        });\n        roots.add(eventNameOrRoot);\n      }\n    }\n  }\n};\nconst _qwikEv = win._qwikEv;\nif (!_qwikEv?.roots) {\n  if (Array.isArray(_qwikEv)) {\n    addEventOrRoot(..._qwikEv);\n  } else {\n    addEventOrRoot("e:click", "e:input");\n  }\n  win._qwikEv = {\n    events,\n    roots,\n    push: addEventOrRoot\n  };\n  addEventListener(doc, "readystatechange", processReadyStateChange);\n  processReadyStateChange();\n}';
-var QWIK_BACKPATCH_EXECUTOR_MINIFIED = `const t='script[type="qwik/backpatch"]';function e(e,n){const o=n||e.querySelector("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])");if(o){const n=o.querySelector(t);if(n){const t=JSON.parse(n.textContent||"[]"),r=e.createTreeWalker(o,NodeFilter.SHOW_ELEMENT);let c=r.currentNode,i=c.hasAttribute(":")?0:-1;for(let e=0;e<t.length;e+=3){const n=t[e],o=t[e+1];let s=t[e+2];for(;i<n&&(c=r.nextNode(),c);)c.hasAttribute(":")&&i++;const a=c;null==s||!1===s?a.removeAttribute(o):("boolean"==typeof s&&(s=""),a.setAttribute(o,s))}}}}const n=document.currentScript;if(n){const t=n.closest("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])");t&&e(document,t)}`;
+var QWIK_LOADER_DEFAULT_MINIFIED = 'const e=document,t=window,n="w",r="wp",o="d",s="dp",i="e",c="ep",a="capture:",l="readystatechange",p="qready",u=new Set,q=new Set([e]),d=new Map;let h,f,b;const g=(e,t)=>Array.from(e.querySelectorAll(t)),m=e=>{const t=[];return q.forEach(n=>t.push(...g(n,e))),t},v=(e,t,n,r=!1,o=!1)=>e.addEventListener(t,n,{capture:r,passive:o}),y=e=>{z(e);const t=g(e,"[q\\\\:shadowroot]");for(let e=0;e<t.length;e++){const n=t[e].shadowRoot;n&&y(n)}},w=e=>e&&"function"==typeof e.then,E=async e=>{for(let t=0;t<e.length;t++)await e[t]()},A=e=>{if(e.length){const t=()=>E(e);b=b?b.then(t,t):t()}},C=t=>{if(void 0===t._qwikjson_){let n=(t===e.documentElement?e.body:t).lastElementChild;for(;n;){if("SCRIPT"===n.tagName&&"qwik/json"===n.getAttribute("type")){t._qwikjson_=JSON.parse(n.textContent.replace(/\\\\x3C(\\/?script)/gi,"<$1"));break}n=n.previousElementSibling}}},_=t=>{const n=t.getAttribute("q:instance");return"paused"===t.getAttribute("q:container")&&"loading"===e.readyState&&!e[p]?.[n]&&new Promise(t=>{const r=o=>{o.detail===n&&(e.removeEventListener(p,r),t())};v(e,l,t),v(e,p,r)})},k=(e,t)=>new CustomEvent(e,{detail:t}),S=(t,n)=>{e.dispatchEvent(k(t,n))},$=e=>e.replace(/([A-Z-])/g,e=>"-"+e.toLowerCase()),I=e=>e.replace(/-./g,e=>e[1].toUpperCase()),L=e=>{const t=e.indexOf(":");return{scope:e.slice(0,t),eventName:I(e.slice(t+1))}},N=e=>2===e.length,R=e=>e.charAt(0),T=e=>!!e&&1===e.nodeType,x=(e,t,n)=>e.hasAttribute(n)&&(!!e._qDispatch?.[t]||e.hasAttribute("q-"+t)),B=(t,n,r,o,s,i,c,a=!0)=>{const l={qBase:r,symbol:i,element:n,reqTime:c};if(!s){const n=(e["qFuncs_"+t.getAttribute("q:instance")]||[])[+i];if(!n&&a){const e=Error("sym:"+i);S("qerror",{importError:"sync",error:e,...l}),console.error(e)}return n}const p=`${i}|${r}|${s}`,u=d.get(p);if(u)return u;const q=new URL(s,o).href,h=import(q);return C(t),h.then(e=>{const t=e[i];if(t)d.set(p,t),S("qsymbol",l);else{const e=Error(`${i} not in ${q}`);S("qerror",{importError:"no-symbol",error:e,...l}),console.error(e)}return t},e=>{S("qerror",{importError:"async",error:e,...l}),console.error(e)})},U=(t,n,r,o,s,i=!0)=>{let c=!1;s&&(i&&t.hasAttribute("preventdefault:"+s)&&n.preventDefault(),t.hasAttribute("stoppropagation:"+s)&&n.stopPropagation());const a=t._qDispatch?.[r];if(a){if("function"==typeof a){const e=()=>a(n,t);if(c)o.push(async()=>{const t=e();w(t)&&await t});else{const t=e();w(t)&&(c=!0,o.push(()=>t))}}else if(a.length)for(let e=0;e<a.length;e++){const r=a[e];if(r){const e=()=>r(n,t);if(c)o.push(async()=>{const t=e();w(t)&&await t});else{const t=e();w(t)&&(c=!0,o.push(()=>t))}}}return}const l=t.getAttribute("q-"+r);if(l){const r=t.closest("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])"),s=r.getAttribute("q:base"),i=new URL(s,e.baseURI),a=l.split("|"),p=_(r);for(let e=0;e<a.length;e++){const l=a[e],u=performance.now(),[q,d,h]=l.split("#"),f=e=>{if(e&&t.isConnected){const o=n=>{const o=_(r);if(o)return o.then(()=>f(e));S("qerror",{error:n,qBase:s,symbol:d,element:t,reqTime:u})};try{const r=e.call(h,n,t);if(w(r))return r.catch(o)}catch(e){return o(e)}}},b=(e=!0)=>B(r,t,s,i,q,d,u,e),g=p&&!q?b(!1):b();if(w(g))c=!0,o.push(()=>g.then(f));else if(c||p&&!q&&!g)c=!0,o.push(async()=>{let e=g;!e&&p&&(await p,e=b(!1)),await f(e||await b())});else{const e=f(g);w(e)&&(c=!0,o.push(()=>e))}}}},j=(e,t=i,n=!0)=>{const r=$(e.type),o=t+":"+r,s=a+r,c=[],l=[],p=[];let u=e.target;for(;u;)T(u)?(c.push(u),l.push(x(u,o,s)),u=u.parentElement):u=u.parentElement;for(let t=c.length-1;t>=0;t--)if(l[t]&&(U(c[t],e,o,p,r,n),e.cancelBubble))return void A(p);for(let t=0;t<c.length;t++)if(!l[t]&&(U(c[t],e,o,p,r,n),!e.bubbles||e.cancelBubble))return void A(p);A(p)},D=e=>j(e,c,!1),O=(e,t,n=!0)=>{const r=$(t.type),o=e+":"+r,s=m("[q-"+e+"\\\\:"+r+"]"),i=[];for(let e=0;e<s.length;e++){const c=s[e];U(c,t,o,i,r,n)}A(i)},P=e=>{O(o,e)},F=e=>{O(s,e,!1)},J=e=>{O(n,e)},M=e=>{O(r,e,!1)},Z=()=>{const n=e.readyState;if("interactive"==n||"complete"==n){if(f=1,q.forEach(y),u.has("d:qinit")){u.delete("d:qinit");const e=k("qinit"),t=m("[q-d\\\\:qinit]"),n=[];for(let r=0;r<t.length;r++){const o=t[r];U(o,e,"d:qinit",n),o.removeAttribute("q-d:qinit")}A(n)}if(u.has("d:qidle")&&(u.delete("d:qidle"),(t.requestIdleCallback??t.setTimeout).bind(t)(()=>{const e=k("qidle"),t=m("[q-d\\\\:qidle]"),n=[];for(let r=0;r<t.length;r++){const o=t[r];U(o,e,"d:qidle",n),o.removeAttribute("q-d:qidle")}A(n)})),u.has("e:qvisible")){h||(h=new IntersectionObserver(e=>{const t=[];for(let n=0;n<e.length;n++){const r=e[n];r.isIntersecting&&(h.unobserve(r.target),U(r.target,k("qvisible",r),"e:qvisible",t))}A(t)}));const e=m("[q-e\\\\:qvisible]:not([q\\\\:observed])");for(let t=0;t<e.length;t++){const n=e[t];h.observe(n),n.setAttribute("q:observed","true")}}}},z=(...e)=>{for(let r=0;r<e.length;r++){const s=e[r];if("string"==typeof s){if(!u.has(s)){u.add(s);const{scope:e,eventName:r}=L(s),i=N(e),c=R(e);c===n?v(t,r,i?M:J,!0,i):q.forEach(e=>v(e,r,c===o?i?F:P:i?D:j,!0,i)),1!==f||"e:qvisible"!==s&&"d:qinit"!==s&&"d:qidle"!==s||Z()}}else q.has(s)||(u.forEach(e=>{const{scope:t,eventName:r}=L(e),i=N(t),c=R(t);c!==n&&v(s,r,c===o?i?F:P:i?D:j,!0,i)}),q.add(s))}},G=t._qwikEv;G?.roots||(Array.isArray(G)?z(...G):z("e:click","e:input"),t._qwikEv={events:u,roots:q,push:z},v(e,l,Z),Z())';
+var QWIK_LOADER_DEFAULT_DEBUG = 'const doc = document;\nconst win = window;\nconst windowPrefix = "w";\nconst passiveWindowPrefix = "wp";\nconst documentPrefix = "d";\nconst passiveDocumentPrefix = "dp";\nconst elementPrefix = "e";\nconst passiveElementPrefix = "ep";\nconst capturePrefix = "capture:";\nconst readyStateChange = "readystatechange";\nconst containerReady = "qready";\nconst events = /* @__PURE__ */ new Set();\nconst roots = /* @__PURE__ */ new Set([doc]);\nconst symbols = /* @__PURE__ */ new Map();\nlet observer;\nlet hasInitialized;\nlet queuedTasks;\nconst nativeQuerySelectorAll = (root, selector) => Array.from(root.querySelectorAll(selector));\nconst querySelectorAll = (query) => {\n  const elements = [];\n  roots.forEach((root) => elements.push(...nativeQuerySelectorAll(root, query)));\n  return elements;\n};\nconst addEventListener = (el, eventName, handler, capture = false, passive = false) => el.addEventListener(eventName, handler, { capture, passive });\nconst findShadowRoots = (fragment) => {\n  addEventOrRoot(fragment);\n  const shadowRoots = nativeQuerySelectorAll(fragment, "[q\\\\:shadowroot]");\n  for (let i = 0; i < shadowRoots.length; i++) {\n    const parent = shadowRoots[i];\n    const shadowRoot = parent.shadowRoot;\n    shadowRoot && findShadowRoots(shadowRoot);\n  }\n};\nconst isPromise = (promise) => promise && typeof promise.then === "function";\nconst runTasks = async (tasks) => {\n  for (let i = 0; i < tasks.length; i++) {\n    await tasks[i]();\n  }\n};\nconst queueTasks = (tasks) => {\n  if (tasks.length) {\n    const run = () => runTasks(tasks);\n    queuedTasks = queuedTasks ? queuedTasks.then(run, run) : run();\n  }\n};\nconst resolveContainer = (containerEl) => {\n  if (containerEl._qwikjson_ === void 0) {\n    const parentJSON = containerEl === doc.documentElement ? doc.body : containerEl;\n    let script = parentJSON.lastElementChild;\n    while (script) {\n      if (script.tagName === "SCRIPT" && script.getAttribute("type") === "qwik/json") {\n        containerEl._qwikjson_ = JSON.parse(\n          script.textContent.replace(/\\\\x3C(\\/?script)/gi, "<$1")\n        );\n        break;\n      }\n      script = script.previousElementSibling;\n    }\n  }\n};\nconst waitForContainerReady = (container) => {\n  const hash = container.getAttribute("q:instance");\n  return container.getAttribute("q:container") === "paused" && doc.readyState === "loading" && !doc[containerReady]?.[hash] && new Promise((resolve) => {\n    const ready = (ev) => {\n      if (ev.detail === hash) {\n        doc.removeEventListener(containerReady, ready);\n        resolve();\n      }\n    };\n    addEventListener(doc, readyStateChange, resolve);\n    addEventListener(doc, containerReady, ready);\n  });\n};\nconst createEvent = (eventName, detail) => new CustomEvent(eventName, { detail });\nconst emitEvent = (eventName, detail) => {\n  doc.dispatchEvent(createEvent(eventName, detail));\n};\nconst camelToKebab = (str) => str.replace(/([A-Z-])/g, (a) => "-" + a.toLowerCase());\nconst kebabToCamel = (eventName) => eventName.replace(/-./g, (a) => a[1].toUpperCase());\nconst parseKebabEvent = (event) => {\n  const separatorIndex = event.indexOf(":");\n  const scope = event.slice(0, separatorIndex);\n  return {\n    scope,\n    eventName: kebabToCamel(event.slice(separatorIndex + 1))\n  };\n};\nconst isPassiveScope = (scope) => scope.length === 2;\nconst getRootScope = (scope) => scope.charAt(0);\nconst isElementNode = (node) => !!node && node.nodeType === 1;\nconst isCaptureHandlerElement = (element, scopedKebabName, captureAttribute) => element.hasAttribute(captureAttribute) && (!!element._qDispatch?.[scopedKebabName] || element.hasAttribute("q-" + scopedKebabName));\nconst resolveHandler = (container, element, qBase, base, chunk, symbol, reqTime, reportSyncError = true) => {\n  const eventData = {\n    qBase,\n    symbol,\n    element,\n    reqTime\n  };\n  if (!chunk) {\n    const handler2 = (doc["qFuncs_" + container.getAttribute("q:instance")] || [])[+symbol];\n    if (!handler2 && reportSyncError) {\n      const error = new Error("sym:" + symbol);\n      emitEvent("qerror", {\n        importError: "sync",\n        error,\n        ...eventData\n      });\n      console.error(error);\n    }\n    return handler2;\n  }\n  const key = `${symbol}|${qBase}|${chunk}`;\n  const handler = symbols.get(key);\n  if (handler) {\n    return handler;\n  }\n  const href = new URL(chunk, base).href;\n  const module = import(\n        href\n  );\n  resolveContainer(container);\n  return module.then(\n    (module2) => {\n      const handler2 = module2[symbol];\n      if (!handler2) {\n        const error = new Error(`${symbol} not in ${href}`);\n        emitEvent("qerror", {\n          importError: "no-symbol",\n          error,\n          ...eventData\n        });\n        console.error(error);\n      } else {\n        symbols.set(key, handler2);\n        emitEvent("qsymbol", eventData);\n      }\n      return handler2;\n    },\n    (error) => {\n      emitEvent("qerror", {\n        importError: "async",\n        error,\n        ...eventData\n      });\n      console.error(error);\n      return void 0;\n    }\n  );\n};\nconst dispatch = (element, ev, scopedKebabName, tasks, kebabName, allowPreventDefault = true) => {\n  let defer = false;\n  if (kebabName) {\n    if (allowPreventDefault && element.hasAttribute("preventdefault:" + kebabName)) {\n      ev.preventDefault();\n    }\n    if (element.hasAttribute("stoppropagation:" + kebabName)) {\n      ev.stopPropagation();\n    }\n  }\n  const handlers = element._qDispatch?.[scopedKebabName];\n  if (handlers) {\n    if (typeof handlers === "function") {\n      const run = () => handlers(ev, element);\n      if (defer) {\n        tasks.push(async () => {\n          const result = run();\n          if (isPromise(result)) {\n            await result;\n          }\n        });\n      } else {\n        const result = run();\n        if (isPromise(result)) {\n          defer = true;\n          tasks.push(() => result);\n        }\n      }\n    } else if (handlers.length) {\n      for (let i = 0; i < handlers.length; i++) {\n        const handler = handlers[i];\n        if (handler) {\n          const run = () => handler(ev, element);\n          if (defer) {\n            tasks.push(async () => {\n              const result = run();\n              if (isPromise(result)) {\n                await result;\n              }\n            });\n          } else {\n            const result = run();\n            if (isPromise(result)) {\n              defer = true;\n              tasks.push(() => result);\n            }\n          }\n        }\n      }\n    }\n    return;\n  }\n  const attrValue = element.getAttribute("q-" + scopedKebabName);\n  if (attrValue) {\n    const container = element.closest(\n      "[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])"\n    );\n    const qBase = container.getAttribute("q:base");\n    const base = new URL(qBase, doc.baseURI);\n    const qrls = attrValue.split("|");\n    const waitForReady = waitForContainerReady(container);\n    for (let i = 0; i < qrls.length; i++) {\n      const qrl = qrls[i];\n      const reqTime = performance.now();\n      const [chunk, symbol, capturedIds] = qrl.split("#");\n      const run = (handler2) => {\n        if (handler2 && element.isConnected) {\n          const onError = (error) => {\n            const retry = waitForContainerReady(container);\n            if (retry) {\n              return retry.then(() => run(handler2));\n            }\n            emitEvent("qerror", {\n              error,\n              qBase,\n              symbol,\n              element,\n              reqTime\n            });\n          };\n          try {\n            const result = handler2.call(capturedIds, ev, element);\n            if (isPromise(result)) {\n              return result.catch(onError);\n            }\n          } catch (error) {\n            return onError(error);\n          }\n        }\n      };\n      const resolve = (reportSyncError = true) => resolveHandler(container, element, qBase, base, chunk, symbol, reqTime, reportSyncError);\n      const handler = waitForReady && !chunk ? resolve(false) : resolve();\n      if (isPromise(handler)) {\n        defer = true;\n        tasks.push(() => handler.then(run));\n      } else if (defer || waitForReady && !chunk && !handler) {\n        defer = true;\n        tasks.push(async () => {\n          let retryHandler = handler;\n          if (!retryHandler && waitForReady) {\n            await waitForReady;\n            retryHandler = resolve(false);\n          }\n          await run(retryHandler || await resolve());\n        });\n      } else {\n        const result = run(handler);\n        if (isPromise(result)) {\n          defer = true;\n          tasks.push(() => result);\n        }\n      }\n    }\n  }\n};\nconst processElementEvent = (ev, scope = elementPrefix, allowPreventDefault = true) => {\n  const kebabName = camelToKebab(ev.type);\n  const scopedKebabName = scope + ":" + kebabName;\n  const captureAttribute = capturePrefix + kebabName;\n  const elements = [];\n  const captureHandlers = [];\n  const tasks = [];\n  let current = ev.target;\n  while (current) {\n    if (isElementNode(current)) {\n      elements.push(current);\n      captureHandlers.push(isCaptureHandlerElement(current, scopedKebabName, captureAttribute));\n      current = current.parentElement;\n    } else {\n      current = current.parentElement;\n    }\n  }\n  for (let i = elements.length - 1; i >= 0; i--) {\n    if (captureHandlers[i]) {\n      dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n      if (ev.cancelBubble) {\n        queueTasks(tasks);\n        return;\n      }\n    }\n  }\n  for (let i = 0; i < elements.length; i++) {\n    if (!captureHandlers[i]) {\n      dispatch(elements[i], ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n      if (!ev.bubbles || ev.cancelBubble) {\n        queueTasks(tasks);\n        return;\n      }\n    }\n  }\n  queueTasks(tasks);\n};\nconst processPassiveElementEvent = (ev) => processElementEvent(ev, passiveElementPrefix, false);\nconst broadcast = (scope, ev, allowPreventDefault = true) => {\n  const kebabName = camelToKebab(ev.type);\n  const scopedKebabName = scope + ":" + kebabName;\n  const elements = querySelectorAll("[q-" + scope + "\\\\:" + kebabName + "]");\n  const tasks = [];\n  for (let i = 0; i < elements.length; i++) {\n    const el = elements[i];\n    dispatch(el, ev, scopedKebabName, tasks, kebabName, allowPreventDefault);\n  }\n  queueTasks(tasks);\n};\nconst processDocumentEvent = (ev) => {\n  broadcast(documentPrefix, ev);\n};\nconst processPassiveDocumentEvent = (ev) => {\n  broadcast(passiveDocumentPrefix, ev, false);\n};\nconst processWindowEvent = (ev) => {\n  broadcast(windowPrefix, ev);\n};\nconst processPassiveWindowEvent = (ev) => {\n  broadcast(passiveWindowPrefix, ev, false);\n};\nconst processReadyStateChange = () => {\n  const readyState = doc.readyState;\n  if (readyState == "interactive" || readyState == "complete") {\n    hasInitialized = 1;\n    roots.forEach(findShadowRoots);\n    if (events.has("d:qinit")) {\n      events.delete("d:qinit");\n      const ev = createEvent("qinit");\n      const elements = querySelectorAll("[q-d\\\\:qinit]");\n      const tasks = [];\n      for (let i = 0; i < elements.length; i++) {\n        const el = elements[i];\n        dispatch(el, ev, "d:qinit", tasks);\n        el.removeAttribute("q-d:qinit");\n      }\n      queueTasks(tasks);\n    }\n    if (events.has("d:qidle")) {\n      events.delete("d:qidle");\n      const riC = win.requestIdleCallback ?? win.setTimeout;\n      riC.bind(win)(() => {\n        const ev = createEvent("qidle");\n        const elements = querySelectorAll("[q-d\\\\:qidle]");\n        const tasks = [];\n        for (let i = 0; i < elements.length; i++) {\n          const el = elements[i];\n          dispatch(el, ev, "d:qidle", tasks);\n          el.removeAttribute("q-d:qidle");\n        }\n        queueTasks(tasks);\n      });\n    }\n    if (events.has("e:qvisible")) {\n      observer || (observer = new IntersectionObserver((entries) => {\n        const tasks = [];\n        for (let i = 0; i < entries.length; i++) {\n          const entry = entries[i];\n          if (entry.isIntersecting) {\n            observer.unobserve(entry.target);\n            dispatch(\n              entry.target,\n              createEvent("qvisible", entry),\n              "e:qvisible",\n              tasks\n            );\n          }\n        }\n        queueTasks(tasks);\n      }));\n      const elements = querySelectorAll("[q-e\\\\:qvisible]:not([q\\\\:observed])");\n      for (let i = 0; i < elements.length; i++) {\n        const el = elements[i];\n        observer.observe(el);\n        el.setAttribute("q:observed", "true");\n      }\n    }\n  }\n};\nconst addEventOrRoot = (...eventNames) => {\n  for (let i = 0; i < eventNames.length; i++) {\n    const eventNameOrRoot = eventNames[i];\n    if (typeof eventNameOrRoot === "string") {\n      if (!events.has(eventNameOrRoot)) {\n        events.add(eventNameOrRoot);\n        const { scope, eventName } = parseKebabEvent(eventNameOrRoot);\n        const passive = isPassiveScope(scope);\n        const rootScope = getRootScope(scope);\n        if (rootScope === windowPrefix) {\n          addEventListener(\n            win,\n            eventName,\n            passive ? processPassiveWindowEvent : processWindowEvent,\n            true,\n            passive\n          );\n        } else {\n          roots.forEach(\n            (root) => addEventListener(\n              root,\n              eventName,\n              rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent,\n              true,\n              passive\n            )\n          );\n        }\n        if (hasInitialized === 1 && (eventNameOrRoot === "e:qvisible" || eventNameOrRoot === "d:qinit" || eventNameOrRoot === "d:qidle")) {\n          processReadyStateChange();\n        }\n      }\n    } else {\n      if (!roots.has(eventNameOrRoot)) {\n        events.forEach((kebabEventName) => {\n          const { scope, eventName } = parseKebabEvent(kebabEventName);\n          const passive = isPassiveScope(scope);\n          const rootScope = getRootScope(scope);\n          if (rootScope !== windowPrefix) {\n            addEventListener(\n              eventNameOrRoot,\n              eventName,\n              rootScope === documentPrefix ? passive ? processPassiveDocumentEvent : processDocumentEvent : passive ? processPassiveElementEvent : processElementEvent,\n              true,\n              passive\n            );\n          }\n        });\n        roots.add(eventNameOrRoot);\n      }\n    }\n  }\n};\nconst _qwikEv = win._qwikEv;\nif (!_qwikEv?.roots) {\n  if (Array.isArray(_qwikEv)) {\n    addEventOrRoot(..._qwikEv);\n  } else {\n    addEventOrRoot("e:click", "e:input");\n  }\n  win._qwikEv = {\n    events,\n    roots,\n    push: addEventOrRoot\n  };\n  addEventListener(doc, readyStateChange, processReadyStateChange);\n  processReadyStateChange();\n}';
+var QWIK_BACKPATCH_EXECUTOR_MINIFIED = `const t='script[type="qwik/backpatch"]';function e(e,n){const o=n||e.querySelector("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])");if(o){const n=o.querySelectorAll(t),r=n[n.length-1];if(r){const t=JSON.parse(r.textContent||"[]"),n=e.createTreeWalker(o,NodeFilter.SHOW_ELEMENT);let c=n.currentNode,i=c.hasAttribute(":")?0:-1;for(let e=0;e<t.length;e+=3){const o=t[e],r=t[e+1];let l=t[e+2];for(;i<o&&(c=n.nextNode(),c);)c.hasAttribute(":")&&i++;const s=c;null==l||!1===l?s.removeAttribute(r):("boolean"==typeof l&&(l=""),s.setAttribute(r,l))}}}}const n=document.currentScript;if(n){const t=n.closest("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])");t&&e(document,t)}`;
 var QWIK_BACKPATCH_EXECUTOR_DEBUG = `const BACKPATCH_DATA_SELECTOR = 'script[type="qwik/backpatch"]';
 function executeBackpatch(doc, containerElement) {
   const container = containerElement || doc.querySelector("[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])");
   if (container) {
-    const script = container.querySelector(BACKPATCH_DATA_SELECTOR);
+    const scripts = container.querySelectorAll(BACKPATCH_DATA_SELECTOR);
+    const script = scripts[scripts.length - 1];
     if (script) {
       const data = JSON.parse(script.textContent || "[]");
       const walker = doc.createTreeWalker(container, NodeFilter.SHOW_ELEMENT);
@@ -1191,6 +1307,170 @@ if (executorScript) {
     executeBackpatch(document, container);
   }
 }`;
+var QWIK_OUT_OF_ORDER_EXECUTOR_MINIFIED = `const t='template[q\\\\:r="',e="q:r",n='[q\\\\:rp="',r="q:g",l="q:i",o="q:o",s="[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])",u=u=>{const i=new WeakMap,c=()=>{const t=u.currentScript;return t&&t.closest(s)||u},f=(t,e,n,r)=>{let l=i.get(t);return l||i.set(t,l={}),l[e]||(l[e]={r:{},n:0,t:n,o:r})},a=(t,e)=>t?(e&&e.style&&(e.style.display="none"),t.style&&(t.style.display="contents"),1):0,q=t=>{const e=t.o;let n,r,l=0;if("p"===e)for(const e in t.r)n=t.r[e],n[0]&&a(n[0],n[1])&&(n[0]=0,l++);else if("s"===e)for(r=t.n;(n=t.r[r])&&n[0]&&a(n[0],n[1]);r++)n[0]=0,l++,t.n=r+1;else if("r"===e){if(t.t<0)return 0;for(t.n<0&&(t.n=t.t-1),r=t.n;(n=t.r[r])&&n[0]&&a(n[0],n[1]);r--)n[0]=0,l++,t.n=r-1}else{if(t.t<0)return 0;for(r=0;r<t.t;r++)if(n=t.r[r],!n)return 0;for(r=0;r<t.t;r++)n=t.r[r],n[0]&&a(n[0],n[1])&&(n[0]=0,l++)}return l},p=s=>{const i=c(),p=((n,r)=>{const l=u.currentScript,o=l?l.previousElementSibling:null;if(o&&"template"===o.localName&&o.getAttribute(e)===r+"")return o;const s=n.querySelectorAll(t+r+'"]');return s.length?s[s.length-1]:null})(i,s);if(!p)return;const g=((e,r,l)=>{if(!l)return null;const o=((t,e)=>t.querySelector(n+e+'"]'))(e,r),s=o?((e,n)=>e.querySelector(t+n+'"]'))(o,r):null,u=s?s.parentNode:null;return s&&o&&u?(u.insertBefore(l.content,s),s.remove(),l.remove(),[o,o.previousElementSibling]):null})(i,s,p);if(!g)return;((t,e)=>{var n;const r=u;null==(n=r.qProcessOOOS)||n.call(r,t,e)})(s,g[0]||null);const m=p.getAttribute(r);if(m){const t=+(p.getAttribute(l)||0),e=f(i,m,-1,p.getAttribute(o)||"p");return e.r[t]=g,void q(e)}a(g[0]||null,g[1])};p.g=(t,e,n)=>{const r=f(c(),t,e,n);r.t=e,r.o=n,"r"===r.o&&0===r.n&&(r.n=e-1),q(r)},p.d=u,globalThis.qO=p};u(document)`;
+var QWIK_OUT_OF_ORDER_EXECUTOR_DEBUG = `const Q_RESOLVED_SELECTOR = 'template[q\\\\:r="';
+const Q_RESOLVED_ATTR = "q:r";
+const Q_RESULT_PARENT_SELECTOR = '[q\\\\:rp="';
+const Q_GROUP_ATTR = "q:g";
+const Q_INDEX_ATTR = "q:i";
+const Q_ORDER_ATTR = "q:o";
+const Q_CONTAINER_SELECTOR = "[q\\\\:container]:not([q\\\\:container=html]):not([q\\\\:container=text])";
+const installOutOfOrderExecutor = (doc) => {
+  const groups = /* @__PURE__ */ new WeakMap();
+  const process = (boundaryId, content) => {
+    var _a;
+    const executorDoc = doc;
+    (_a = executorDoc.qProcessOOOS) == null ? void 0 : _a.call(executorDoc, boundaryId, content);
+  };
+  const getScope = () => {
+    const script = doc.currentScript;
+    return script ? script.closest(Q_CONTAINER_SELECTOR) || doc : doc;
+  };
+  const group = (scope, groupId, total, order) => {
+    let scopedGroups = groups.get(scope);
+    if (!scopedGroups) {
+      groups.set(scope, scopedGroups = {});
+    }
+    return scopedGroups[groupId] || (scopedGroups[groupId] = {
+      r: {},
+      n: 0,
+      t: total,
+      o: order
+    });
+  };
+  const getResolvedTemplate = (scope, boundaryId) => {
+    const currentScript = doc.currentScript;
+    const previousElement = currentScript ? currentScript.previousElementSibling : null;
+    if (previousElement && previousElement.localName === "template" && previousElement.getAttribute(Q_RESOLVED_ATTR) === String(boundaryId)) {
+      return previousElement;
+    }
+    const templates = scope.querySelectorAll(Q_RESOLVED_SELECTOR + boundaryId + '"]');
+    return templates.length ? templates[templates.length - 1] : null;
+  };
+  const getPlaceholderTemplate = (content, boundaryId) => {
+    return content.querySelector(Q_RESOLVED_SELECTOR + boundaryId + '"]');
+  };
+  const getResultParent = (scope, boundaryId) => {
+    return scope.querySelector(Q_RESULT_PARENT_SELECTOR + boundaryId + '"]');
+  };
+  const reveal = (content, fallback) => {
+    if (!content) {
+      return 0;
+    }
+    if (fallback && fallback.style) {
+      fallback.style.display = "none";
+    }
+    if (content.style) {
+      content.style.display = "contents";
+    }
+    return 1;
+  };
+  const move = (scope, boundaryId, resolved) => {
+    if (!resolved) {
+      return null;
+    }
+    const content = getResultParent(scope, boundaryId);
+    const placeholder = content ? getPlaceholderTemplate(content, boundaryId) : null;
+    const parent = placeholder ? placeholder.parentNode : null;
+    if (!placeholder || !content || !parent) {
+      return null;
+    }
+    parent.insertBefore(resolved.content, placeholder);
+    placeholder.remove();
+    resolved.remove();
+    return [content, content.previousElementSibling];
+  };
+  const flush = (group2) => {
+    const order = group2.o;
+    let entry;
+    let index;
+    let swapped = 0;
+    if (order === "p") {
+      for (const key in group2.r) {
+        entry = group2.r[key];
+        if (entry[0] && reveal(entry[0], entry[1])) {
+          entry[0] = 0;
+          swapped++;
+        }
+      }
+    } else if (order === "s") {
+      for (index = group2.n; (entry = group2.r[index]) && entry[0]; index++) {
+        if (!reveal(entry[0], entry[1])) {
+          break;
+        }
+        entry[0] = 0;
+        swapped++;
+        group2.n = index + 1;
+      }
+    } else if (order === "r") {
+      if (group2.t < 0) {
+        return 0;
+      }
+      if (group2.n < 0) {
+        group2.n = group2.t - 1;
+      }
+      for (index = group2.n; (entry = group2.r[index]) && entry[0]; index--) {
+        if (!reveal(entry[0], entry[1])) {
+          break;
+        }
+        entry[0] = 0;
+        swapped++;
+        group2.n = index - 1;
+      }
+    } else {
+      if (group2.t < 0) {
+        return 0;
+      }
+      for (index = 0; index < group2.t; index++) {
+        entry = group2.r[index];
+        if (!entry) {
+          return 0;
+        }
+      }
+      for (index = 0; index < group2.t; index++) {
+        entry = group2.r[index];
+        if (entry[0] && reveal(entry[0], entry[1])) {
+          entry[0] = 0;
+          swapped++;
+        }
+      }
+    }
+    return swapped;
+  };
+  const qO = ((boundaryId) => {
+    const scope = getScope();
+    const resolved = getResolvedTemplate(scope, boundaryId);
+    if (!resolved) {
+      return;
+    }
+    const entry = move(scope, boundaryId, resolved);
+    if (!entry) {
+      return;
+    }
+    process(boundaryId, entry[0] || null);
+    const groupId = resolved.getAttribute(Q_GROUP_ATTR);
+    if (groupId) {
+      const index = +(resolved.getAttribute(Q_INDEX_ATTR) || 0);
+      const currentGroup = group(scope, groupId, -1, resolved.getAttribute(Q_ORDER_ATTR) || "p");
+      currentGroup.r[index] = entry;
+      flush(currentGroup);
+      return;
+    }
+    reveal(entry[0] || null, entry[1]);
+  });
+  qO.g = (groupId, total, order) => {
+    const currentGroup = group(getScope(), groupId, total, order);
+    currentGroup.t = total;
+    currentGroup.o = order;
+    if (currentGroup.o === "r" && currentGroup.n === 0) {
+      currentGroup.n = total - 1;
+    }
+    flush(currentGroup);
+  };
+  qO.d = doc;
+  globalThis.qO = qO;
+};
+installOutOfOrderExecutor(document)`;
 function getQwikLoaderScript(opts = {}) {
   return opts.debug ? QWIK_LOADER_DEFAULT_DEBUG : QWIK_LOADER_DEFAULT_MINIFIED;
 }
@@ -1202,6 +1482,13 @@ function getQwikPrefetchWorkerScript(opts = {}) {
 function getQwikBackpatchExecutorScript(opts = {}) {
   return opts.debug ? QWIK_BACKPATCH_EXECUTOR_DEBUG : QWIK_BACKPATCH_EXECUTOR_MINIFIED;
 }
+function getQwikOutOfOrderExecutorScript(opts = {}) {
+  if (!__EXPERIMENTAL__.suspense) {
+    return "";
+  }
+  const script = opts.debug ? QWIK_OUT_OF_ORDER_EXECUTOR_DEBUG : QWIK_OUT_OF_ORDER_EXECUTOR_MINIFIED;
+  return `if(!globalThis.qO||globalThis.qO.d!==document){${script}}`;
+}
 
 // packages/qwik/src/server/ssr-node.ts
 import {
@@ -1374,14 +1661,80 @@ var SsrComponentFrame = class {
   hasSlot(slotName) {
     return mapArray_has(this.slots, slotName, 0);
   }
+  claimChildrenForSlot(slotName) {
+    return mapApp_remove(this.slots, slotName, 0);
+  }
   consumeChildrenForSlot(projectionNode, slotName) {
-    const children = mapApp_remove(this.slots, slotName, 0);
+    const children = this.claimChildrenForSlot(slotName);
     this.componentNode.setProp(slotName, projectionNode.id);
     projectionNode.setProp(QSlotParent, this.componentNode.id);
     return children;
   }
 };
 
+// packages/qwik/src/server/ssr-stream-writer.ts
+var renderSSRChunks = (chunks, remap) => {
+  let out = "";
+  for (let i = 0; i < chunks.length; i++) {
+    const chunk = chunks[i];
+    if (typeof chunk === "string") {
+      out += chunk;
+    } else {
+      const localId = chunk.type === "root-ref" ? chunk.localId : chunk.localPath[0];
+      out += String(remap ? remap[localId] ?? localId : localId);
+      if (chunk.type !== "root-ref-path") {
+        continue;
+      }
+      const path = chunk.localPath;
+      for (let j = 1; j < path.length; j++) {
+        out += " " + path[j];
+      }
+    }
+  }
+  return out;
+};
+var StringSSRWriter = class {
+  buffer = [];
+  write(text) {
+    this.buffer.push(text);
+  }
+  writeRootRef(id) {
+    writeStringRootRef(this, id);
+  }
+  writeRootRefPath(path) {
+    writeStringRootRefPath(this, path);
+  }
+  clear() {
+    this.buffer.length = 0;
+  }
+  toString(_) {
+    return this.buffer.join("");
+  }
+};
+var StringBufferSegmentWriter = class {
+  chunks = [];
+  write(text) {
+    this.chunks.push(text);
+  }
+  writeRootRef(id) {
+    this.chunks.push({ type: "root-ref", localId: id });
+  }
+  writeRootRefPath(path) {
+    this.chunks.push({ type: "root-ref-path", localPath: path });
+  }
+  clear() {
+    this.chunks.length = 0;
+  }
+  extract() {
+    const chunks = this.chunks;
+    this.chunks = [];
+    return chunks;
+  }
+  toString(remap) {
+    return renderSSRChunks(this.chunks, remap);
+  }
+};
+
 // packages/qwik/src/server/tag-nesting.ts
 var allowedContent = (state) => {
   switch (state) {
@@ -1724,7 +2077,7 @@ function getBuildBase(opts) {
   return `${import.meta.env?.BASE_URL || "/"}build/`;
 }
 var versions = {
-  qwik: "2.0.0-beta.35-dev+4603135",
+  qwik: "2.0.0-beta.36-dev+3268fab",
   qwikDom: "2.1.19"
 };
 
@@ -1785,7 +2138,7 @@ function vNodeData_createSsrNodeReference(currentComponentNode, vNodeData, depth
       stack[stack.length - 1]++;
     }
   }
-  let refId = depthFirstElementIdx + "";
+  let refId = String(depthFirstElementIdx);
   if (vNodeData[0] & (2 /* VIRTUAL_NODE */ | 1 /* TEXT_DATA */)) {
     for (let i = 0; i < stack.length; i++) {
       const childCount = stack[i];
@@ -1824,11 +2177,24 @@ function encodeAsAlphanumeric(value) {
 }
 
 // packages/qwik/src/server/ssr-container.ts
+var NO_SCRIPT_HERE_ELEMENTS = /* @__PURE__ */ new Set([
+  "script",
+  "style",
+  "textarea",
+  "title",
+  "iframe",
+  "noframes",
+  "noscript",
+  "xmp",
+  "template",
+  "svg",
+  "math"
+]);
 function ssrCreateContainer(opts) {
   opts.renderOptions ||= {};
   return new SSRContainer({
     tagName: opts.tagName || "div",
-    writer: opts.writer || new StringBufferWriter(),
+    writer: opts.writer || new StringSSRWriter(),
     streamHandler: opts.streamHandler,
     locale: opts.locale || "",
     timing: opts.timing || {
@@ -1847,16 +2213,16 @@ function ssrCreateContainer(opts) {
     renderOptions: opts.renderOptions
   });
 }
-var StringBufferWriter = class {
-  buffer = [];
-  write(text) {
-    this.buffer.push(text);
-  }
-  toString() {
-    return this.buffer.join("");
+var noopStreamHandler = {
+  flush() {
+  },
+  waitForPendingFlush() {
+  },
+  streamBlockStart() {
+  },
+  streamBlockEnd() {
   }
 };
-var EMPTY_OBJ = {};
 var QTemplateProps = {
   hidden: true,
   "aria-hidden": true
@@ -1871,7 +2237,12 @@ var SSRContainer = class extends _SharedContainer {
   resolvedManifest;
   symbolToChunkResolver;
   renderOptions;
+  outOfOrderStreaming;
   serializationCtx;
+  // Sometimes there is no app state, but framework metadata still points to a vnode id.
+  // For example, an OOOS segment can point outside the segment to a root vnode through
+  // q:sparent, so root vnode data must still be emitted for the client ref table.
+  hasVNodeRefsForSerialization = false;
   /**
    * We use this to append additional nodes in the head node
    *
@@ -1889,6 +2260,7 @@ var SSRContainer = class extends _SharedContainer {
   currentComponentNode = null;
   styleIds = /* @__PURE__ */ new Set();
   isBackpatchExecutorEmitted = false;
+  isOutOfOrderExecutorEmitted = false;
   backpatchMap = /* @__PURE__ */ new Map();
   currentElementFrame = null;
   renderTimer;
@@ -1900,6 +2272,7 @@ var SSRContainer = class extends _SharedContainer {
    */
   depthFirstElementCount = -1;
   vNodeDatas = [];
+  vNodeDataOffset = 0;
   componentStack = [];
   cleanupQueue = [];
   emitContainerDataFrame = null;
@@ -1908,8 +2281,22 @@ var SSRContainer = class extends _SharedContainer {
   $noMoreRoots$ = false;
   qlInclude;
   promiseAttributes = null;
+  vnodeSegment = null;
+  $containerState$ = 0 /* NotReady */;
+  // OOOS related fields
+  outOfOrderId = 0;
+  outOfOrderUsed = false;
+  outOfOrderPendingSegments = [];
+  outOfOrderSegments = [];
+  rootContainerReadyPromise = null;
+  resolveRootContainerReady = null;
+  renderQueue = Promise.resolve();
+  emittedQwikEventNames = /* @__PURE__ */ new Set();
+  emittedSyncFnCount = 0;
+  rootContainerSerializedRootCount = 0;
+  emittedVNodeDataOwners = null;
   constructor(opts) {
-    super(opts.renderOptions.serverData ?? EMPTY_OBJ, opts.locale);
+    super(opts.renderOptions.serverData ?? {}, opts.locale);
     this.symbolToChunkResolver = (symbol) => {
       const idx = symbol.lastIndexOf("_");
       const chunk = this.resolvedManifest.mapper[idx == -1 ? symbol : symbol.substring(idx + 1)];
@@ -1930,6 +2317,17 @@ var SSRContainer = class extends _SharedContainer {
     this.$buildBase$ = opts.buildBase;
     this.resolvedManifest = opts.resolvedManifest;
     this.renderOptions = opts.renderOptions;
+    const outOfOrderStreaming = this.renderOptions.streaming?.outOfOrder === true;
+    if (!__EXPERIMENTAL__.suspense) {
+      if (outOfOrderStreaming) {
+        throw new Error(
+          'Out-of-order Suspense streaming requires `experimental: ["suspense"]` in the `qwikVite` plugin.'
+        );
+      }
+      this.outOfOrderStreaming = false;
+    } else {
+      this.outOfOrderStreaming = outOfOrderStreaming;
+    }
     this.$currentUniqueId$ = 1e5;
     const qlOpt = this.renderOptions.qwikLoader;
     this.qlInclude = qlOpt ? typeof qlOpt === "object" ? qlOpt.include === "never" ? 2 /* Done */ : 0 /* Module */ : qlOpt === "inline" ? 1 /* Inline */ : qlOpt === "never" ? 2 /* Done */ : 0 /* Module */ : 0 /* Module */;
@@ -1967,6 +2365,157 @@ var SSRContainer = class extends _SharedContainer {
   async renderJSX(jsx, options) {
     await _walkJSX(this, jsx, options);
   }
+  $isReadyForOOOS$() {
+    return this.$containerState$ === 2 /* OOOSReady */;
+  }
+  /** Queue OOOS serialization/write work that must not overlap with root state serialization. */
+  $runQueuedRender$(render) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming) {
+      return render();
+    }
+    if (this.$containerState$ === 0 /* NotReady */) {
+      return render();
+    }
+    const result = this.$containerState$ === 1 /* DataStreamStarted */ ? this.renderQueue.then(() => this.$waitForRootContainerReady$()).then(render) : this.renderQueue.then(render);
+    this.renderQueue = result.catch(() => {
+    });
+    return result;
+  }
+  $waitForRootContainerReady$() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || this.$isReadyForOOOS$()) {
+      return;
+    }
+    return this.rootContainerReadyPromise ||= new Promise((resolve) => {
+      this.resolveRootContainerReady = resolve;
+    });
+  }
+  $markRootContainerReady$() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || this.$isReadyForOOOS$()) {
+      return;
+    }
+    this.rootContainerSerializedRootCount = this.serializationCtx.$roots$.length;
+    this.$containerState$ = 2 /* OOOSReady */;
+    this.resolveRootContainerReady?.();
+    this.resolveRootContainerReady = null;
+    this.rootContainerReadyPromise = null;
+  }
+  nextOutOfOrderId() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming) {
+      return 0;
+    }
+    this.outOfOrderUsed = true;
+    return ++this.outOfOrderId;
+  }
+  emitOutOfOrderSegmentScripts(scripts) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !scripts) {
+      return;
+    }
+    this.write(scripts);
+  }
+  async segment(segmentId, jsx, options) {
+    if (!__EXPERIMENTAL__.suspense) {
+      throw new Error(
+        'Out-of-order Suspense streaming requires `experimental: ["suspense"]` in the `qwikVite` plugin.'
+      );
+    }
+    if (!this.outOfOrderStreaming) {
+      throw new Error(
+        "Out-of-order Suspense streaming requires `streaming.outOfOrder` to be `true`."
+      );
+    }
+    this.markVNodeRefForSerialization(options.parentComponentFrame?.componentNode);
+    const writer = new StringBufferSegmentWriter();
+    const segmentContainer = this.createSegmentContainer(segmentId, writer);
+    this.outOfOrderSegments.push(segmentContainer);
+    try {
+      await segmentContainer.renderJSX(jsx, options);
+      await segmentContainer.resolvePromiseAttributes();
+      const htmlChunks = writer.extract();
+      return {
+        container: segmentContainer,
+        writer,
+        htmlChunks
+      };
+    } catch (error) {
+      this.removeOutOfOrderSegment(segmentContainer);
+      throw error;
+    }
+  }
+  $getRootContainer$() {
+    let rootContainer = this;
+    while (rootContainer instanceof SSRSegmentContainer) {
+      rootContainer = rootContainer.$rootContainer$;
+    }
+    return rootContainer;
+  }
+  createSegmentContainer(segmentId, writer) {
+    const rootContainer = this.$getRootContainer$();
+    const contentHostNode = this.getOrCreateLastNode();
+    this.addRoot(contentHostNode);
+    this.markVNodeRefForSerialization(contentHostNode);
+    const rootFrame = {
+      tagNesting: 10 /* ANYTHING */,
+      parent: null,
+      elementName: "#segment",
+      depthFirstElementIdx: -1,
+      // OOOS inserts this synthetic root under the Suspense content host on the client.
+      vNodeData: [16 /* SERIALIZE */],
+      currentFile: null,
+      refBase: contentHostNode.id
+    };
+    const segmentContainer = new SSRSegmentContainer(
+      {
+        tagName: this.tag,
+        writer,
+        streamHandler: noopStreamHandler,
+        locale: this.$locale$,
+        timing: this.timing,
+        buildBase: this.$buildBase$ || "/build/",
+        resolvedManifest: this.resolvedManifest,
+        renderOptions: this.renderOptions
+      },
+      rootContainer
+    );
+    const innerSegmentContainer = segmentContainer;
+    innerSegmentContainer.$isOutOfOrderSegment$ = true;
+    innerSegmentContainer.$storeProxyMap$ = this.$storeProxyMap$;
+    segmentContainer.serializationCtx = segmentContainer.serializationCtxFactory(
+      SsrNode,
+      DomRef,
+      this.symbolToChunkResolver,
+      writer
+    );
+    segmentContainer.serializationCtx.$addSyncFn$ = this.serializationCtx.$addSyncFn$.bind(
+      this.serializationCtx
+    );
+    segmentContainer.currentElementFrame = rootFrame;
+    segmentContainer.currentComponentNode = this.currentComponentNode;
+    segmentContainer.depthFirstElementCount = 0;
+    segmentContainer.vNodeDatas = [rootFrame.vNodeData];
+    segmentContainer.componentStack = this.componentStack.slice();
+    segmentContainer.vnodeSegment = segmentId;
+    segmentContainer.styleIds = this.styleIds;
+    segmentContainer.emittedQwikEventNames = this.emittedQwikEventNames;
+    segmentContainer.qlInclude = 2 /* Done */;
+    segmentContainer.$instanceHash$ = this.$instanceHash$;
+    innerSegmentContainer._didAddQwikLoader = true;
+    return segmentContainer;
+  }
+  queueOutOfOrderSegment(segment) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming) {
+      return;
+    }
+    this.outOfOrderPendingSegments.push(segment);
+  }
+  removeOutOfOrderSegment(segment) {
+    const segments = this.outOfOrderSegments;
+    for (let i = 0; i < segments.length; i++) {
+      if (segments[i] === segment) {
+        segments.splice(i, 1);
+        return;
+      }
+    }
+  }
   setContext(host, context, value) {
     const ssrNode = host;
     let ctx = ssrNode.getProp(QCtxAttr);
@@ -2031,7 +2580,7 @@ var SSRContainer = class extends _SharedContainer {
   /** Renders opening tag for DOM element */
   openElement(elementName, key, varAttrs, constAttrs = null, styleScopedId = null, currentFile = null, hasMovedCaptures = true) {
     const isQwikStyle = isQwikStyleElement(elementName, varAttrs) || isQwikStyleElement(elementName, constAttrs);
-    if (elementName === "noscript" || elementName === "template" || elementName === "script") {
+    if (NO_SCRIPT_HERE_ELEMENTS.has(elementName)) {
       this.$noScriptHere$++;
     }
     if (
@@ -2129,7 +2678,7 @@ var SSRContainer = class extends _SharedContainer {
       this.write(GT);
     }
     this.lastNode = null;
-    if (elementName === "noscript" || elementName === "template" || elementName === "script") {
+    if (NO_SCRIPT_HERE_ELEMENTS.has(elementName)) {
       this.$noScriptHere$--;
     }
   }
@@ -2151,7 +2700,13 @@ var SSRContainer = class extends _SharedContainer {
     this.openFragment(attrs);
     const componentFrame = this.getComponentFrame();
     if (componentFrame) {
-      this.serializationCtx.$addRoot$(componentFrame.componentNode);
+      const projectionNode = this.getOrCreateLastNode();
+      this.markVNodeRefForSerialization(projectionNode);
+      if (!this.vnodeSegment) {
+        this.addRoot(componentFrame.componentNode);
+      } else {
+        this.markVNodeRefForSerialization(componentFrame.componentNode);
+      }
       componentFrame.projectionDepth++;
     }
   }
@@ -2200,13 +2755,18 @@ var SSRContainer = class extends _SharedContainer {
     for (let i = 0; i < componentFrame.slots.length; i += 2) {
       const slotName = componentFrame.slots[i];
       const children = componentFrame.slots[i + 1];
+      if (this.vnodeSegment) {
+        this.markVNodeRefForSerialization(componentFrame.componentNode);
+      }
       this.openFragment(
-        isDev8 ? { [DEBUG_TYPE]: "P" /* Projection */, [QSlotParent]: componentFrame.componentNode.id } : { [QSlotParent]: componentFrame.componentNode.id }
+        isDev8 ? {
+          [DEBUG_TYPE]: "P" /* Projection */,
+          [QSlotParent]: componentFrame.componentNode.id,
+          [QSlot]: slotName
+        } : { [QSlotParent]: componentFrame.componentNode.id, [QSlot]: slotName }
       );
       const lastNode = this.getOrCreateLastNode();
-      if (lastNode.vnodeData) {
-        lastNode.vnodeData[0] |= 16 /* SERIALIZE */;
-      }
+      lastNode.vnodeData[0] |= 16 /* SERIALIZE */;
       componentFrame.componentNode.setProp(slotName, lastNode.id);
       await this.renderJSX(children, {
         currentStyleScoped: scopedStyleId,
@@ -2230,19 +2790,22 @@ var SSRContainer = class extends _SharedContainer {
   }
   addRoot(obj) {
     if (this.$noMoreRoots$) {
-      return this.serializationCtx.$hasRootId$(obj);
+      const rootId = this.serializationCtx.$hasRootId$(obj);
+      return rootId;
     }
     return this.serializationCtx.$addRoot$(obj);
   }
   getOrCreateLastNode() {
     if (!this.lastNode) {
+      const currentFrame = this.currentElementFrame;
+      const elementIndex = currentFrame.depthFirstElementIdx + 1;
+      const refBase = currentFrame.refBase ?? (this.vnodeSegment ? getSegmentVNodeRefId(this.vnodeSegment, elementIndex) : elementIndex + this.vNodeDataOffset);
       this.lastNode = vNodeData_createSsrNodeReference(
         this.currentComponentNode,
-        this.currentElementFrame.vNodeData,
-        // we start at -1, so we need to add +1
-        this.currentElementFrame.depthFirstElementIdx + 1,
+        currentFrame.vNodeData,
+        refBase,
         this.cleanupQueue,
-        this.currentElementFrame.currentFile
+        currentFrame.currentFile
       );
     }
     return this.lastNode;
@@ -2297,23 +2860,67 @@ var SSRContainer = class extends _SharedContainer {
     this.write(content);
     this.closeElement();
   }
+  $deferRootPlaceholder$(scriptNode) {
+    if (this.isHtml && this.currentElementFrame?.elementName === "html") {
+      this.additionalHeadNodes.push(scriptNode);
+      return true;
+    }
+    return false;
+  }
   ////////////////////////////////////
   emitContainerData() {
+    const isStreamingDisabled = this.renderOptions.streaming?.inOrder?.strategy === "disabled";
+    const shouldFlushShell = !isStreamingDisabled || __EXPERIMENTAL__.suspense && this.outOfOrderStreaming && this.outOfOrderUsed;
     return maybeThen(
-      this.resolvePromiseAttributes(),
-      () => maybeThen(this.emitStateData(), () => {
-        this.$noMoreRoots$ = true;
-        this.emitVNodeData();
-        if (!isDev8) {
-          preloaderPost(this, this.renderOptions, this.$serverData$?.nonce);
-        }
-        this.emitSyncFnsData();
-        this.emitPatchDataIfNeeded();
-        this.emitExecutorIfNeeded();
-        this.emitQwikLoaderAtBottomIfNeeded();
-      })
+      maybeThen(
+        shouldFlushShell ? this.streamHandler.flush() : void 0,
+        () => this.resolvePromiseAttributes()
+      ),
+      () => {
+        this.$containerState$ = 1 /* DataStreamStarted */;
+        return maybeThen(this.emitStateData(), () => {
+          this.$noMoreRoots$ = true;
+          return maybeThen(this.emitRestStateData(), () => this.emitOutOfOrderSegmentsAndData());
+        });
+      }
     );
   }
+  emitRestStateData() {
+    this.emitVNodeData();
+    this.emitDelayedOutOfOrderSegmentVNodeData();
+    if (!isDev8) {
+      preloaderPost(this, this.renderOptions, this.$serverData$?.nonce);
+    }
+    this.emitSyncFnsData();
+    this.emitPatchDataIfNeeded();
+    this.emitExecutorIfNeeded();
+    this.emitQwikLoaderAtBottomIfNeeded();
+    this.emitContainerReadyEventIfNeeded();
+  }
+  emitDelayedOutOfOrderSegmentVNodeData() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !this.outOfOrderUsed) {
+      return;
+    }
+    for (let i = 0; i < this.outOfOrderSegments.length; i++) {
+      const segment = this.outOfOrderSegments[i];
+      if (segment.$outOfOrderState$ === 1 /* EarlyFinalized */) {
+        segment.$emitDelayedOutOfOrderVNodeData$();
+        i--;
+      }
+    }
+  }
+  emitOutOfOrderSegmentsAndData() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !this.outOfOrderUsed) {
+      return;
+    }
+    this.emitOutOfOrderExecutorIfNeeded();
+    return maybeThen(this.streamHandler.flush(), async () => {
+      this.$markRootContainerReady$();
+      if (this.outOfOrderPendingSegments.length) {
+        await Promise.all(this.outOfOrderPendingSegments);
+      }
+    });
+  }
   /**
    * Serialize the vNodeData into a string and emit it as a script tag.
    *
@@ -2332,16 +2939,25 @@ var SSRContainer = class extends _SharedContainer {
    * NOTE: Not every element will need vNodeData. So we need to encode how many elements should be
    * skipped. By choosing different separators we can encode different numbers of elements to skip.
    */
-  emitVNodeData() {
-    if (!this.serializationCtx.$roots$.length) {
+  emitVNodeData(segmentId) {
+    this.$getRootContainer$().markVNodeDataOwnerEmitted(segmentId);
+    if (!segmentId && !this.serializationCtx.$roots$.length && !this.hasVNodeRefsForSerialization) {
       return;
     }
-    this.openElement("script", null, { type: "qwik/vnode" });
+    this.emitVNodeDataScript(segmentId, this.vNodeDatas.entries());
+  }
+  emitVNodeDataScript(segmentId, entries, patch = false) {
+    const attrs = { type: "qwik/vnode" };
+    if (__EXPERIMENTAL__.suspense && this.outOfOrderStreaming && segmentId) {
+      attrs[QSuspenseResolved] = segmentId;
+    }
+    if (patch) {
+      attrs[QStatePatchAttr] = true;
+    }
+    this.openScript(attrs);
     const vNodeAttrsStack = [];
-    const vNodeData = this.vNodeDatas;
     let lastSerializedIdx = 0;
-    for (let elementIdx = 0; elementIdx < vNodeData.length; elementIdx++) {
-      const vNode = vNodeData[elementIdx];
+    for (const [elementIdx, vNode] of entries) {
       const flag = vNode[0];
       if (flag & 16 /* SERIALIZE */) {
         lastSerializedIdx = this.emitVNodeSeparators(lastSerializedIdx, elementIdx);
@@ -2391,14 +3007,51 @@ var SSRContainer = class extends _SharedContainer {
         }
       }
     }
-    this.closeElement();
+    this.closeScript();
+    if (patch && !segmentId) {
+      this.emitInlineScript(
+        "document.qProcessVNodeDataPatch&&document.qProcessVNodeDataPatch(document.currentScript.previousElementSibling)"
+      );
+    }
+  }
+  markVNodeRefForSerialization(node) {
+    if (node) {
+      this.hasVNodeRefsForSerialization = true;
+      node.vnodeData[0] |= 16 /* SERIALIZE */ | 8 /* REFERENCE */;
+    }
+  }
+  markVNodeDataOwnerEmitted(segmentId) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming) {
+      return;
+    }
+    (this.emittedVNodeDataOwners ||= /* @__PURE__ */ new Set()).add(segmentId);
+  }
+  isVNodeDataOwnerEmitted(owner) {
+    return this.emittedVNodeDataOwners?.has(owner) === true;
+  }
+  getVNodeDataOwnerFromNodeId(id) {
+    const refBase = parseInt(id, 10);
+    if (refBase >= 0) {
+      return { owner: void 0, localIndex: refBase };
+    }
+    const pair = -refBase - 1;
+    const diagonal = Math.floor((Math.sqrt(8 * pair + 1) - 1) / 2);
+    const diagonalStart = diagonal * (diagonal + 1) / 2;
+    const localIndex = pair - diagonalStart;
+    const segmentIndex = diagonal - localIndex;
+    return { owner: String(segmentIndex + 1), localIndex };
   }
   writeFragmentAttrs(fragmentAttrs) {
     for (const key in fragmentAttrs) {
-      let value = fragmentAttrs[key];
-      let encodeValue = false;
-      if (typeof value !== "string") {
-        const rootId = this.addRoot(value);
+      const rawValue = fragmentAttrs[key];
+      let value = rawValue;
+      let rootId;
+      let encodeValue = null;
+      if (key === ELEMENT_ID && typeof rawValue === "number") {
+        rootId = rawValue;
+        value = String(rawValue);
+      } else if (typeof rawValue !== "string") {
+        rootId = this.addRoot(rawValue);
         if (rootId === void 0) {
           continue;
         }
@@ -2418,7 +3071,7 @@ var SSRContainer = class extends _SharedContainer {
           this.write(VNodeDataChar.PROPS_CHAR);
           break;
         case ELEMENT_KEY:
-          encodeValue = true;
+          encodeValue = encodeVNodeDataKey;
           this.write(VNodeDataChar.KEY_CHAR);
           break;
         case ELEMENT_SEQ:
@@ -2441,18 +3094,20 @@ var SSRContainer = class extends _SharedContainer {
           this.write(VNodeDataChar.SLOT_CHAR);
           break;
         default: {
-          encodeValue = true;
+          encodeValue = encodeURI;
           this.write(VNodeDataChar.SEPARATOR_CHAR);
           this.write(encodeVNodeDataString(key));
           this.write(VNodeDataChar.SEPARATOR_CHAR);
         }
       }
-      const encodedValue = encodeVNodeDataString(encodeValue ? encodeURI(value) : value);
+      const encodedValue = encodeVNodeDataString(encodeValue ? encodeValue(value) : value);
       const isEncoded = encodeValue ? encodedValue !== value : false;
       if (isEncoded) {
         this.write(VNodeDataChar.SEPARATOR_CHAR);
         this.write(encodedValue);
         this.write(VNodeDataChar.SEPARATOR_CHAR);
+      } else if (typeof rootId === "number") {
+        this.writeRootRef(rootId);
       } else {
         this.write(value);
       }
@@ -2463,33 +3118,48 @@ var SSRContainer = class extends _SharedContainer {
       return;
     }
     const attrs = this.stateScriptAttrs();
-    this.openElement("script", null, attrs);
+    this.openScript(attrs);
+    this.serializationCtx.$setWriter$(this.writer);
     return maybeThen(this.serializationCtx.$serialize$(), () => {
-      this.closeElement();
+      this.closeScript();
     });
   }
   /** Add q-d:qidle attribute to eagerly resume some state if needed */
   stateScriptAttrs() {
-    const attrs = { type: "qwik/state" };
+    const attrs = { type: "qwik/state", [QInstanceAttr]: this.$instanceHash$ };
     const eagerResume = this.serializationCtx.$eagerResume$;
     if (eagerResume.size > 0) {
       attrs["q-d:qidle"] = createQRL(null, "_res", _res, null, [...eagerResume]);
     }
     return attrs;
   }
-  emitSyncFnsData() {
+  emitSyncFnsData(append = false) {
     const fns = this.serializationCtx.$syncFns$;
-    if (fns.length) {
+    const start = append ? this.emittedSyncFnCount : 0;
+    if (fns.length > start) {
       const scriptAttrs = { "q:func": "qwik/json" };
       if (this.renderOptions.serverData?.nonce) {
         scriptAttrs["nonce"] = this.renderOptions.serverData.nonce;
       }
-      this.openElement("script", null, scriptAttrs);
-      this.write(Q_FUNCS_PREFIX.replace("HASH", this.$instanceHash$));
-      this.write(BRACKET_OPEN);
-      this.writeArray(fns, COMMA);
-      this.write(BRACKET_CLOSE);
-      this.closeElement();
+      this.openScript(scriptAttrs);
+      if (append) {
+        const qFuncsExpr = Q_FUNCS_PREFIX.replace("HASH", this.$instanceHash$).slice(0, -1);
+        this.write(`(${qFuncsExpr}||(${qFuncsExpr}=[])).push(`);
+      } else {
+        this.write(Q_FUNCS_PREFIX.replace("HASH", this.$instanceHash$));
+      }
+      if (!append) {
+        this.write(BRACKET_OPEN);
+      }
+      this.writeArray(append ? fns.slice(start) : fns, COMMA);
+      if (!append) {
+        this.write(BRACKET_CLOSE);
+      }
+      if (append) {
+        this.write(")");
+      }
+      this.closeScript();
+      this.emittedSyncFnCount = fns.length;
     }
   }
   emitPatchDataIfNeeded() {
@@ -2511,23 +3181,67 @@ var SSRContainer = class extends _SharedContainer {
       if (this.renderOptions.serverData?.nonce) {
         scriptAttrs["nonce"] = this.renderOptions.serverData.nonce;
       }
-      this.openElement("script", null, scriptAttrs);
-      this.write(JSON.stringify(patches));
-      this.closeElement();
+      this.writeScript(scriptAttrs, JSON.stringify(patches));
     }
   }
+  emitBackpatchDataAndExecutorIfNeeded() {
+    if (this.backpatchMap.size === 0) {
+      return;
+    }
+    this.emitPatchDataIfNeeded();
+    this.emitExecutorIfNeeded();
+  }
   emitExecutorIfNeeded() {
     if (!this.isBackpatchExecutorEmitted) {
       return;
     }
+    this.isBackpatchExecutorEmitted = false;
     const scriptAttrs = { type: "text/javascript" };
     if (this.renderOptions.serverData?.nonce) {
       scriptAttrs["nonce"] = this.renderOptions.serverData.nonce;
     }
-    this.openElement("script", null, scriptAttrs);
     const backpatchScript = getQwikBackpatchExecutorScript({ debug: isDev8 });
-    this.write(backpatchScript);
-    this.closeElement();
+    this.writeScript(scriptAttrs, backpatchScript);
+  }
+  emitOutOfOrderExecutorIfNeeded() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !this.outOfOrderUsed || this.isOutOfOrderExecutorEmitted) {
+      return;
+    }
+    this.isOutOfOrderExecutorEmitted = true;
+    this.writeScript(
+      { type: "text/javascript", nonce: this.renderOptions.serverData?.nonce },
+      getQwikOutOfOrderExecutorScript({ debug: isDev8 })
+    );
+  }
+  emitInlineScript(script) {
+    const scriptAttrs = { type: "text/javascript" };
+    if (this.renderOptions.serverData?.nonce) {
+      scriptAttrs["nonce"] = this.renderOptions.serverData.nonce;
+    }
+    this.writeScript(scriptAttrs, script);
+  }
+  emitContainerReadyEventIfNeeded() {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !this.outOfOrderUsed) {
+      return;
+    }
+    this.emitInlineScript(
+      `document.qready||(document.qready={});document.qready["${this.$instanceHash$}"]=1;try{document.dispatchEvent(new CustomEvent("qready",{detail:"${this.$instanceHash$}"}))}catch(e){}`
+    );
+  }
+  writeScript(attrs, body) {
+    this.openScript(attrs);
+    if (body) {
+      this.write(body);
+    }
+    this.closeScript();
+  }
+  openScript(attrs) {
+    this.write("<script");
+    this.writeAttrs("script", attrs, true, null, null, true);
+    this.write(GT);
+  }
+  closeScript() {
+    this.write("</script>");
   }
   emitPreloaderPre() {
     if (!isDev8) {
@@ -2535,7 +3249,7 @@ var SSRContainer = class extends _SharedContainer {
     }
   }
   isStatic() {
-    return this.serializationCtx.$eventQrls$.size === 0;
+    return !(__EXPERIMENTAL__.suspense && this.outOfOrderStreaming && this.outOfOrderUsed) && this.serializationCtx.$eventQrls$.size === 0;
   }
   emitQwikLoaderAtTopIfNeeded() {
     if (this.qlInclude === 0 /* Module */) {
@@ -2556,8 +3270,7 @@ var SSRContainer = class extends _SharedContainer {
       if (nonce) {
         scriptAttrs["nonce"] = nonce;
       }
-      this.openElement("script", null, scriptAttrs);
-      this.closeElement();
+      this.writeScript(scriptAttrs);
     }
   }
   emitQwikLoaderInline() {
@@ -2571,17 +3284,25 @@ var SSRContainer = class extends _SharedContainer {
     if (this.renderOptions.serverData?.nonce) {
       scriptAttrs["nonce"] = this.renderOptions.serverData.nonce;
     }
-    this.openElement("script", null, scriptAttrs);
-    this.write(qwikLoaderScript);
-    this.closeElement();
+    this.writeScript(scriptAttrs, qwikLoaderScript);
   }
   emitQwikLoaderAtBottomIfNeeded() {
     if (!this.isStatic()) {
       if (this.qlInclude !== 2 /* Done */) {
         this.emitQwikLoaderInline();
       }
-      this.emitQwikEvents(Array.from(this.serializationCtx.$eventNames$, (s) => JSON.stringify(s)));
+      this.emitNewQwikEvents();
+    }
+  }
+  emitNewQwikEvents() {
+    const eventNames = [];
+    for (const eventName of this.serializationCtx.$eventNames$) {
+      if (!this.emittedQwikEventNames.has(eventName)) {
+        this.emittedQwikEventNames.add(eventName);
+        eventNames.push(JSON.stringify(eventName));
+      }
     }
+    this.emitQwikEvents(eventNames);
   }
   emitQwikEvents(eventNames) {
     if (eventNames.length > 0) {
@@ -2590,11 +3311,11 @@ var SSRContainer = class extends _SharedContainer {
       if (nonce) {
         scriptAttrs["nonce"] = nonce;
       }
-      this.openElement("script", null, scriptAttrs);
+      this.openScript(scriptAttrs);
       this.write(`(window._qwikEv||(window._qwikEv=[])).push(`);
       this.writeArray(eventNames, COMMA);
       this.write(PAREN_CLOSE);
-      this.closeElement();
+      this.closeScript();
     }
   }
   // Keep in sync with process-vnode-data.unit.ts
@@ -2662,7 +3383,7 @@ var SSRContainer = class extends _SharedContainer {
           text.push(
             `${indent}<${elementName}> <= is not allowed as a child of ${allowedContent(previousTagNesting)[0]}.`
           );
-          throw newTagError(text.map(escapeHTML).join("\n"));
+          throw newTagError(text.join("\n"));
         }
       }
     }
@@ -2672,7 +3393,8 @@ var SSRContainer = class extends _SharedContainer {
       elementName,
       depthFirstElementIdx,
       vNodeData: [0 /* NONE */],
-      currentFile: isDev8 ? currentFile || null : null
+      currentFile: isDev8 ? currentFile || null : null,
+      refBase: null
     };
     this.currentElementFrame = frame;
     this.vNodeDatas.push(frame.vNodeData);
@@ -2687,6 +3409,17 @@ var SSRContainer = class extends _SharedContainer {
     this.size += text.length;
     this.writer.write(text);
   }
+  writeRootRef(id) {
+    this.size += String(id).length;
+    this.writer.writeRootRef(id);
+  }
+  writeRootRefPath(path) {
+    this.size += String(path[0]).length;
+    this.writer.writeRootRefPath(path);
+    for (let i = 1; i < path.length; i++) {
+      this.size += 1 + String(path[i]).length;
+    }
+  }
   writeArray(array, separator) {
     for (let i = 0; i < array.length; i++) {
       const element = array[i];
@@ -2722,7 +3455,11 @@ var SSRContainer = class extends _SharedContainer {
           throw qError(15 /* invalidRefValue */, [currentFile]);
         }
       } else if (key === ITERATION_ITEM_SINGLE || key === ITERATION_ITEM_MULTI) {
-        value = this.serializationCtx.$addRoot$(value);
+        const rootId = this.addRoot(value);
+        if (rootId === void 0) {
+          continue;
+        }
+        value = typeof rootId === "number" ? [rootId] : String(rootId);
       } else if (isSignal(value)) {
         const lastNode = this.getOrCreateLastNode();
         const signalData = new SubscriptionData({
@@ -2738,7 +3475,11 @@ var SSRContainer = class extends _SharedContainer {
         const lastNode = this.getOrCreateLastNode();
         this.addPromiseAttribute(value);
         value.then((resolvedValue) => {
-          this.addBackpatchEntry(lastNode.id, key, resolvedValue);
+          this.addBackpatchEntry(
+            lastNode.id,
+            key,
+            serializeAttribute(key, resolvedValue, styleScopedId)
+          );
         });
         continue;
       }
@@ -2771,14 +3512,30 @@ var SSRContainer = class extends _SharedContainer {
         this.write(key);
         if (serializedValue !== true) {
           this.write(ATTR_EQUALS_QUOTE);
-          const strValue = escapeHTML(String(serializedValue));
-          this.write(strValue);
+          if (Array.isArray(serializedValue)) {
+            this.writeEscapedChunks(serializedValue);
+          } else {
+            const strValue = escapeHTML(String(serializedValue));
+            this.write(strValue);
+          }
           this.write(QUOTE);
         }
       }
     }
     return innerHTML;
   }
+  writeEscapedChunks(chunks) {
+    for (let i = 0; i < chunks.length; i++) {
+      const chunk = chunks[i];
+      if (typeof chunk === "string") {
+        this.write(escapeHTML(chunk));
+      } else if (typeof chunk === "number") {
+        this.writeRootRef(chunk);
+      } else {
+        this.writeRootRefPath(chunk.path);
+      }
+    }
+  }
   addPromiseAttribute(promise) {
     this.promiseAttributes ||= [];
     this.promiseAttributes.push(promise);
@@ -2790,6 +3547,277 @@ var SSRContainer = class extends _SharedContainer {
     }
   }
 };
+var SSRSegmentContainer = class extends SSRContainer {
+  constructor(opts, $rootContainer$) {
+    super(opts);
+    this.$rootContainer$ = $rootContainer$;
+  }
+  $outOfOrderState$ = 0 /* Rendering */;
+  $outOfOrderRootIdMap$ = null;
+  subscriptionPatchRecords = [];
+  pendingVNodeDataPatches = null;
+  nextOutOfOrderId() {
+    return this.$rootContainer$.nextOutOfOrderId();
+  }
+  $runQueuedRender$(render) {
+    return this.$rootContainer$.$runQueuedRender$(render);
+  }
+  queueOutOfOrderSegment(segment) {
+    this.$rootContainer$.queueOutOfOrderSegment(segment);
+  }
+  emitOutOfOrderSegmentScripts(scripts) {
+    this.$rootContainer$.emitOutOfOrderSegmentScripts(scripts);
+  }
+  emitOutOfOrderExecutorIfNeeded() {
+    this.$rootContainer$.emitOutOfOrderExecutorIfNeeded();
+  }
+  $recordExternalRootEffect$(producer, effect, prop, sourceEffects) {
+    recordExternalRootEffect(
+      this.$rootContainer$.serializationCtx,
+      this.serializationCtx,
+      this.$rootContainer$.$storeProxyMap$,
+      this.subscriptionPatchRecords,
+      producer,
+      effect,
+      prop,
+      sourceEffects
+    );
+  }
+  async $finalizeOutOfOrderSegment$(segmentId, segment) {
+    const rootContainer = this.$rootContainer$;
+    const rootReadyAtSegment = rootContainer.$isReadyForOOOS$();
+    const segmentSerializationCtx = this.serializationCtx;
+    try {
+      const commit = this.$commitRoots$(rootContainer, segmentSerializationCtx);
+      this.$mergeSegmentEventData$(rootContainer, segmentSerializationCtx);
+      this.$mergeSegmentSyncFns$(rootContainer, segmentSerializationCtx);
+      const subscriptionPatchRootId = this.$addSubscriptionsToRoots$(
+        rootContainer,
+        rootReadyAtSegment,
+        segmentSerializationCtx
+      );
+      if (rootReadyAtSegment && (commit.newRootLocalIds.length > 0 || subscriptionPatchRootId !== void 0)) {
+        segmentSerializationCtx.$forwardRefOffset$ = rootContainer.serializationCtx.$serializedForwardRefCount$;
+        await this.emitStatePatchData(
+          segmentId,
+          commit.newRootStart,
+          commit.newRootLocalIds,
+          subscriptionPatchRootId
+        );
+        rootContainer.serializationCtx.$serializedRootCount$ = rootContainer.serializationCtx.$roots$.length + (rootContainer.serializationCtx.$hasRootStateForwardRefs$ ? 1 : 0);
+        rootContainer.serializationCtx.$serializedForwardRefCount$ += segmentSerializationCtx.$serializedForwardRefCount$;
+      }
+      this.emitPendingVNodeDataPatches();
+      if (rootReadyAtSegment) {
+        this.$noMoreRoots$ = true;
+        this.emitVNodeData(segmentId);
+        const segmentCtx = this.serializationCtx;
+        this.serializationCtx = rootContainer.serializationCtx;
+        this.emittedSyncFnCount = rootContainer.emittedSyncFnCount;
+        this.emitSyncFnsData(true);
+        rootContainer.emittedSyncFnCount = this.emittedSyncFnCount;
+        this.serializationCtx = segmentCtx;
+        this.emitNewQwikEvents();
+      }
+      this.emitPatchDataIfNeeded();
+      this.drainCleanupQueue();
+      const rootIdMap = commit.rootIdMap;
+      if (rootReadyAtSegment) {
+        this.$outOfOrderState$ = 2 /* Done */;
+      } else {
+        this.$outOfOrderRootIdMap$ = rootIdMap;
+        this.$outOfOrderState$ = 1 /* EarlyFinalized */;
+      }
+      return {
+        html: renderSSRChunks(segment.htmlChunks, rootIdMap),
+        scripts: segment.writer.toString(rootIdMap)
+      };
+    } finally {
+      if (this.$outOfOrderState$ !== 1 /* EarlyFinalized */) {
+        segmentSerializationCtx.$onAddRoot$ = void 0;
+        rootContainer.removeOutOfOrderSegment(this);
+      }
+      rootContainer.serializationCtx.$setWriter$(rootContainer.writer);
+    }
+  }
+  $emitDelayedOutOfOrderVNodeData$() {
+    try {
+      this.emitVNodeData(this.vnodeSegment);
+      this.emitPendingVNodeDataPatches();
+      this.$rootContainer$.emitOutOfOrderSegmentScripts(
+        this.writer.toString(this.$outOfOrderRootIdMap$)
+      );
+      this.$outOfOrderState$ = 2 /* Done */;
+      this.$rootContainer$.removeOutOfOrderSegment(this);
+    } finally {
+      this.serializationCtx.$onAddRoot$ = void 0;
+    }
+  }
+  markVNodeDataForSerialization(node, flags = 16 /* SERIALIZE */) {
+    const previousFlags = node.vnodeData[0];
+    const nextFlags = previousFlags | flags;
+    if (nextFlags !== previousFlags) {
+      node.vnodeData[0] = nextFlags;
+      this.queueLateVNodeDataPatch(node, nextFlags & ~previousFlags);
+    }
+  }
+  queueLateVNodeDataPatch(node, addedFlags) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming || !(addedFlags & (16 /* SERIALIZE */ | 8 /* REFERENCE */))) {
+      return;
+    }
+    const owner = this.getVNodeDataOwnerFromNodeId(node.id);
+    if (!this.$getRootContainer$().isVNodeDataOwnerEmitted(owner.owner)) {
+      return;
+    }
+    let ownerPatches = (this.pendingVNodeDataPatches ||= /* @__PURE__ */ new Map()).get(owner.owner);
+    if (!ownerPatches) {
+      this.pendingVNodeDataPatches.set(owner.owner, ownerPatches = /* @__PURE__ */ new Map());
+    }
+    ownerPatches.set(owner.localIndex, node.vnodeData);
+  }
+  emitPendingVNodeDataPatches() {
+    const pendingPatches = this.pendingVNodeDataPatches;
+    this.pendingVNodeDataPatches = null;
+    if (!pendingPatches) {
+      return;
+    }
+    for (const [owner, entries] of pendingPatches) {
+      if (entries.size === 0) {
+        continue;
+      }
+      const sortedEntries = Array.from(entries).sort((a, b) => a[0] - b[0]);
+      this.emitVNodeDataScript(owner, sortedEntries, true);
+    }
+  }
+  $commitRoots$(rootContainer, segmentSerializationCtx) {
+    const commit = this.commitSegmentRoots(rootContainer, segmentSerializationCtx);
+    segmentSerializationCtx.$onAddRoot$ = (localId, root, obj) => {
+      this.commitSegmentRoot(rootContainer, localId, root, obj, commit);
+    };
+    return commit;
+  }
+  $addSubscriptionsToRoots$(rootContainer, rootReadyAtSegment, segmentSerializationCtx) {
+    let subscriptionPatchRootId = void 0;
+    const subscriptionPatches = rootReadyAtSegment ? this.collectSubscriptionPatches(
+      rootContainer,
+      rootContainer.rootContainerSerializedRootCount
+    ) : void 0;
+    if (subscriptionPatches) {
+      subscriptionPatchRootId = segmentSerializationCtx.$addRoot$(subscriptionPatches);
+    }
+    return subscriptionPatchRootId;
+  }
+  commitSegmentRoots(rootContainer, segmentSerializationCtx) {
+    const rootIdMap = [];
+    const newRootStart = rootContainer.$isReadyForOOOS$() ? rootContainer.serializationCtx.$serializedRootCount$ : rootContainer.serializationCtx.$roots$.length;
+    const newRootLocalIds = [];
+    const commit = {
+      rootIdMap,
+      newRootStart,
+      newRootLocalIds
+    };
+    this.promoteSharedSegmentRoots(rootContainer, segmentSerializationCtx, commit);
+    const segmentRoots = segmentSerializationCtx.$roots$;
+    const segmentRootObjs = segmentSerializationCtx.$rootObjs$;
+    for (let i = 0; i < segmentRoots.length; i++) {
+      const rootObj = segmentRootObjs[i];
+      this.commitSegmentRoot(rootContainer, i, segmentRoots[i], rootObj, commit);
+    }
+    return commit;
+  }
+  promoteSharedSegmentRoots(rootContainer, segmentSerializationCtx, commit) {
+    const segmentRoots = segmentSerializationCtx.$roots$;
+    const segmentRootObjs = segmentSerializationCtx.$rootObjs$;
+    for (let i = 0; i < segmentRootObjs.length; i++) {
+      const rootObj = segmentRootObjs[i];
+      if (this.isRootOrUsedByOtherLiveSegment(rootContainer, rootObj)) {
+        this.commitSegmentRoot(rootContainer, i, segmentRoots[i], rootObj, commit);
+      }
+    }
+  }
+  isRootOrUsedByOtherLiveSegment(rootContainer, obj) {
+    if (rootContainer.serializationCtx.$hasRootId$(obj) !== void 0) {
+      return true;
+    }
+    const segments = rootContainer.outOfOrderSegments;
+    for (let i = 0; i < segments.length; i++) {
+      const segment = segments[i];
+      if (segment === this) {
+        continue;
+      }
+      const rootObjs = segment.serializationCtx.$rootObjs$;
+      for (let j = 0; j < rootObjs.length; j++) {
+        if (rootObjs[j] === obj) {
+          return true;
+        }
+      }
+    }
+    return false;
+  }
+  commitSegmentRoot(rootContainer, localId, root, rootObj, commit) {
+    if (commit.rootIdMap[localId] !== void 0) {
+      return;
+    }
+    let rootId = rootContainer.serializationCtx.$hasRootId$(rootObj);
+    if (rootId === void 0) {
+      rootId = rootContainer.serializationCtx.$commitRoot$(root, rootObj);
+      commit.newRootLocalIds.push(localId);
+      this.seedCommittedRootForLiveSegments(rootContainer, rootObj);
+    }
+    const rootCtx = rootContainer.serializationCtx;
+    commit.rootIdMap[localId] = rootContainer.$isReadyForOOOS$() && rootId >= rootCtx.$rootStateRootCount$ ? rootId + (rootCtx.$hasRootStateForwardRefs$ ? 1 : 0) : rootId;
+  }
+  seedCommittedRootForLiveSegments(rootContainer, rootObj) {
+    const segments = rootContainer.outOfOrderSegments;
+    for (let i = 0; i < segments.length; i++) {
+      const segment = segments[i];
+      if (segment !== this && segment.$outOfOrderState$ === 0 /* Rendering */) {
+        segment.serializationCtx.$addRoot$(rootObj);
+      }
+    }
+  }
+  $mergeSegmentEventData$(rootContainer, segmentSerializationCtx) {
+    for (const eventName of segmentSerializationCtx.$eventNames$) {
+      rootContainer.serializationCtx.$eventNames$.add(eventName);
+    }
+    for (const qrl of segmentSerializationCtx.$eventQrls$) {
+      rootContainer.serializationCtx.$eventQrls$.add(qrl);
+    }
+  }
+  $mergeSegmentSyncFns$(rootContainer, segmentSerializationCtx) {
+    rootContainer.serializationCtx.$syncFns$.push(...segmentSerializationCtx.$syncFns$);
+  }
+  collectSubscriptionPatches(rootContainer, rootLimit) {
+    if (!__EXPERIMENTAL__.suspense || !this.outOfOrderStreaming) {
+      return;
+    }
+    return collectSubscriptionPatches(
+      rootContainer.serializationCtx,
+      this.subscriptionPatchRecords,
+      rootLimit
+    );
+  }
+  emitStatePatchData(segmentId, rootStart, rootIds, subscriptionPatchRootId) {
+    const attrs = this.statePatchScriptAttrs(segmentId);
+    this.openScript(attrs);
+    this.serializationCtx.$setWriter$(this.writer);
+    this.serializationCtx.$markSsrNodeForSerialization$ = this.markVNodeDataForSerialization.bind(this);
+    return maybeThen(
+      this.serializationCtx.$serializePatch$(rootStart, rootIds, subscriptionPatchRootId, 0),
+      () => {
+        this.closeScript();
+      }
+    );
+  }
+  statePatchScriptAttrs(segmentId) {
+    const attrs = this.stateScriptAttrs();
+    attrs[QStatePatchAttr] = true;
+    if (segmentId) {
+      attrs[QSuspenseResolved] = segmentId;
+    }
+    return attrs;
+  }
+};
 var isQwikStyleElement = (tag, attrs) => {
   if (tag === "style" && attrs != null) {
     return Object.prototype.hasOwnProperty.call(attrs, QStyle) || Object.prototype.hasOwnProperty.call(attrs, QScopedStyle);
@@ -2851,58 +3879,43 @@ var StreamHandler = class {
     let stream;
     switch (this.inOrderStreaming.strategy) {
       case "disabled":
-        stream = {
-          write(chunk) {
-            if (chunk === void 0 || chunk === null) {
-              return;
-            }
-            handler.enqueue(chunk);
-          },
-          waitForDrain() {
-            return handler.waitForPendingFlush();
+        stream = createStringStreamWriter((chunk) => {
+          if (chunk === void 0 || chunk === null) {
+            return;
           }
-        };
+          handler.enqueue(chunk);
+        });
         break;
       case "direct": {
         const originalStream = this.nativeStream;
-        stream = {
-          write(chunk) {
-            if (chunk === void 0 || chunk === null) {
-              return;
-            }
-            if (handler.pendingFlush) {
-              const queued = handler.pendingFlush.then(() => originalStream.write(chunk));
-              return handler.trackPendingFlush(queued);
-            }
-            return handler.trackPendingFlush(originalStream.write(chunk));
-          },
-          waitForDrain() {
-            return handler.waitForPendingFlush();
+        stream = createStringStreamWriter((chunk) => {
+          if (chunk === void 0 || chunk === null) {
+            return;
+          }
+          if (handler.pendingFlush) {
+            const queued = handler.pendingFlush.then(() => originalStream.write(chunk));
+            return handler.trackPendingFlush(queued);
           }
-        };
+          return handler.trackPendingFlush(originalStream.write(chunk));
+        });
         break;
       }
       default:
       case "auto": {
         const minimumChunkSize = this.inOrderStreaming.maximumChunk ?? 0;
         const initialChunkSize = this.inOrderStreaming.maximumInitialChunk ?? 0;
-        stream = {
-          write(chunk) {
-            if (chunk === void 0 || chunk === null) {
-              return;
-            }
-            handler.enqueue(chunk);
-            if (handler.streamBlockDepth === 0) {
-              const maxBufferSize = handler.networkFlushes === 0 ? initialChunkSize : minimumChunkSize;
-              if (handler.bufferSize >= maxBufferSize) {
-                return handler.flush();
-              }
+        stream = createStringStreamWriter((chunk) => {
+          if (chunk === void 0 || chunk === null) {
+            return;
+          }
+          handler.enqueue(chunk);
+          if (handler.streamBlockDepth === 0) {
+            const maxBufferSize = handler.networkFlushes === 0 ? initialChunkSize : minimumChunkSize;
+            if (handler.bufferSize >= maxBufferSize) {
+              return handler.flush();
             }
-          },
-          waitForDrain() {
-            return handler.waitForPendingFlush();
           }
-        };
+        });
         break;
       }
     }
@@ -2982,22 +3995,26 @@ var StreamHandler = class {
 
 // packages/qwik/src/server/ssr-render.ts
 var renderToString = async (jsx, opts = {}) => {
-  const chunks = [];
-  const stream = {
-    write(chunk) {
-      chunks.push(chunk);
-    }
-  };
+  const stream = new StringSSRWriter();
   const result = await renderToStream(jsx, { ...opts, stream });
   return {
     isStatic: result.isStatic,
     timing: result.timing,
     manifest: result.manifest,
     snapshotResult: result.snapshotResult,
-    html: chunks.join("")
+    html: stream.toString()
   };
 };
 var renderToStream = async (jsx, opts) => {
+  if (__EXPERIMENTAL__.suspense && opts.streaming?.outOfOrder === void 0) {
+    opts = {
+      ...opts,
+      streaming: {
+        ...opts.streaming,
+        outOfOrder: true
+      }
+    };
+  }
   const timing = {
     firstFlush: 0,
     render: 0,