solid-js 1.2.5 → 1.3.0-beta.0

package/types/render/hydration.d.ts

@@ -1,13 +1,14 @@
-declare type HydrationContext = {
+export declare type HydrationContext = {
     id: string;
     count: number;
-    loadResource?: (id: string) => Promise<any>;
 };
 declare type SharedConfig = {
     context?: HydrationContext;
     resources?: {
         [key: string]: any;
     };
+    load?: (id: string) => Promise<any> | undefined;
+    gather?: (key: string) => void;
     registry?: Map<string, Element>;
 };
 export declare const sharedConfig: SharedConfig;

package/types/server/index.d.ts

@@ -1,3 +1,3 @@
 export { createRoot, createSignal, createComputed, createRenderEffect, createEffect, createDeferred, createSelector, createMemo, getListener, onMount, onCleanup, onError, untrack, batch, on, children, createContext, useContext, getOwner, runWithOwner, equalFn, requestCallback, mapArray, observable, from, $PROXY, DEV } from "./reactive";
-export { awaitSuspense, mergeProps, splitProps, createComponent, For, Index, Show, Switch, Match, ErrorBoundary, Suspense, SuspenseList, createResource, enableScheduling, startTransition, useTransition, createUniqueId, lazy, sharedConfig } from "./rendering";
+export { mergeProps, splitProps, createComponent, For, Index, Show, Switch, Match, ErrorBoundary, Suspense, SuspenseList, createResource, enableScheduling, startTransition, useTransition, createUniqueId, lazy, sharedConfig } from "./rendering";
 export type { Component, Resource } from "./rendering";

package/types/server/reactive.d.ts

@@ -1,9 +1,8 @@
+import type { Accessor, Setter } from "../reactive/signal";
 export declare const equalFn: <T>(a: T, b: T) => boolean;
 export declare const $PROXY: unique symbol;
 export declare const DEV: {};
 export declare let Owner: Owner | null;
-export declare type Accessor<T> = () => T;
-export declare type Setter<T> = undefined extends T ? <U extends T>(v?: (U extends Function ? never : U) | ((prev?: U) => U)) => U : <U extends T>(v: (U extends Function ? never : U) | ((prev: U) => U)) => U;
 interface Owner {
     owner: Owner | null;
     context: any | null;

package/types/server/rendering.d.ts

@@ -94,8 +94,10 @@ declare type HydrationContext = {
     writeResource?: (id: string, v: Promise<any>) => void;
     resources: Record<string, any>;
     suspense: Record<string, SuspenseContextType>;
+    registerFragment: (v: string) => (v?: string) => void;
     async?: boolean;
     streaming?: boolean;
+    noHydrate: boolean;
 };
 export declare function SuspenseList(props: {
     children: string;
@@ -106,5 +108,4 @@ export declare function Suspense(props: {
     fallback: string;
     children: string;
 }): any;
-export declare function awaitSuspense(fn: () => any): Promise<unknown>;
 export {};

package/web/dist/dev.cjs

@@ -219,27 +219,25 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  solidJs.sharedConfig.resources = globalThis._$HYDRATION.resources;
-  solidJs.sharedConfig.completed = globalThis._$HYDRATION.completed;
-  solidJs.sharedConfig.events = globalThis._$HYDRATION.events;
+  if (!globalThis._$HY.sync) {
+    let dispose;
+    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
+    return () => dispose();
+  }
+  solidJs.sharedConfig.completed = globalThis._$HY.completed;
+  solidJs.sharedConfig.events = globalThis._$HY.events;
+  solidJs.sharedConfig.load = globalThis._$HY.load;
+  solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
+  solidJs.sharedConfig.registry = new Map();
   solidJs.sharedConfig.context = {
     id: "",
-    count: 0,
-    loadResource: globalThis._$HYDRATION.loadResource
+    count: 0
   };
-  solidJs.sharedConfig.registry = new Map();
   gatherHydratable(element);
   const dispose = render(code, element, [...element.childNodes]);
   solidJs.sharedConfig.context = null;
   return dispose;
 }
-function gatherHydratable(element) {
-  const templates = element.querySelectorAll(`*[data-hk]`);
-  for (let i = 0; i < templates.length; i++) {
-    const node = templates[i];
-    solidJs.sharedConfig.registry.set(node.getAttribute("data-hk"), node);
-  }
-}
 function getNextElement(template) {
   let node, key;
   if (!solidJs.sharedConfig.context || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
@@ -333,7 +331,7 @@ function eventHandler(e) {
   Object.defineProperty(e, "currentTarget", {
     configurable: true,
     get() {
-      return node;
+      return node || document;
     }
   });
   while (node !== null) {
@@ -388,7 +386,12 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
       solidJs.createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
       return () => current;
     }
-    if (solidJs.sharedConfig.context && current && current.length) return current;
+    if (solidJs.sharedConfig.context && current && current.length) {
+      for (let i; i < array.length; i++) {
+        if (array[i].parentNode) return array;
+      }
+      return current;
+    }
     if (array.length === 0) {
       current = cleanChildren(parent, current, marker);
       if (multi) return current;
@@ -456,6 +459,14 @@ function cleanChildren(parent, current, marker, replacement) {
   } else parent.insertBefore(node, marker);
   return [node];
 }
+function gatherHydratable(element, root) {
+  const templates = element.querySelectorAll(`*[data-hk]`);
+  for (let i = 0; i < templates.length; i++) {
+    const node = templates[i];
+    const key = node.getAttribute("data-hk");
+    if (!root || key.startsWith(root)) solidJs.sharedConfig.registry.set(key, node);
+  }
+}
 function getHydrationKey() {
   const hydrate = solidJs.sharedConfig.context;
   return `${hydrate.id}${hydrate.count++}`;
@@ -630,7 +641,6 @@ exports.clearDelegatedEvents = clearDelegatedEvents;
 exports.delegateEvents = delegateEvents;
 exports.dynamicProperty = dynamicProperty;
 exports.escape = escape;
-exports.gatherHydratable = gatherHydratable;
 exports.generateHydrationScript = generateHydrationScript;
 exports.getHydrationKey = getHydrationKey;
 exports.getNextElement = getNextElement;

package/web/dist/dev.js

@@ -216,27 +216,25 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
   }
 }
 function hydrate(code, element) {
-  sharedConfig.resources = globalThis._$HYDRATION.resources;
-  sharedConfig.completed = globalThis._$HYDRATION.completed;
-  sharedConfig.events = globalThis._$HYDRATION.events;
+  if (!globalThis._$HY.sync) {
+    let dispose;
+    globalThis._$HY.queue.push(() => dispose = hydrate(code, element));
+    return () => dispose();
+  }
+  sharedConfig.completed = globalThis._$HY.completed;
+  sharedConfig.events = globalThis._$HY.events;
+  sharedConfig.load = globalThis._$HY.load;
+  sharedConfig.gather = root => gatherHydratable(element, root);
+  sharedConfig.registry = new Map();
   sharedConfig.context = {
     id: "",
-    count: 0,
-    loadResource: globalThis._$HYDRATION.loadResource
+    count: 0
   };
-  sharedConfig.registry = new Map();
   gatherHydratable(element);
   const dispose = render(code, element, [...element.childNodes]);
   sharedConfig.context = null;
   return dispose;
 }
-function gatherHydratable(element) {
-  const templates = element.querySelectorAll(`*[data-hk]`);
-  for (let i = 0; i < templates.length; i++) {
-    const node = templates[i];
-    sharedConfig.registry.set(node.getAttribute("data-hk"), node);
-  }
-}
 function getNextElement(template) {
   let node, key;
   if (!sharedConfig.context || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
@@ -330,7 +328,7 @@ function eventHandler(e) {
   Object.defineProperty(e, "currentTarget", {
     configurable: true,
     get() {
-      return node;
+      return node || document;
     }
   });
   while (node !== null) {
@@ -385,7 +383,12 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
       createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
       return () => current;
     }
-    if (sharedConfig.context && current && current.length) return current;
+    if (sharedConfig.context && current && current.length) {
+      for (let i; i < array.length; i++) {
+        if (array[i].parentNode) return array;
+      }
+      return current;
+    }
     if (array.length === 0) {
       current = cleanChildren(parent, current, marker);
       if (multi) return current;
@@ -453,6 +456,14 @@ function cleanChildren(parent, current, marker, replacement) {
   } else parent.insertBefore(node, marker);
   return [node];
 }
+function gatherHydratable(element, root) {
+  const templates = element.querySelectorAll(`*[data-hk]`);
+  for (let i = 0; i < templates.length; i++) {
+    const node = templates[i];
+    const key = node.getAttribute("data-hk");
+    if (!root || key.startsWith(root)) sharedConfig.registry.set(key, node);
+  }
+}
 function getHydrationKey() {
   const hydrate = sharedConfig.context;
   return `${hydrate.id}${hydrate.count++}`;
@@ -536,4 +547,4 @@ function Dynamic(props) {
   });
 }
 
-export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, gatherHydratable, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, insert, isServer, memo, pipeToNodeWritable, pipeToWritable, render, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };
+export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, insert, isServer, memo, pipeToNodeWritable, pipeToWritable, render, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };

package/web/dist/server.cjs

@@ -232,111 +232,162 @@ function stringifyString(str) {
   return result;
 }
 
+const REPLACE_SCRIPT = `function $df(e,t){t=document.getElementById(e),document.getElementById("pl"+e).replaceWith(...t.childNodes),_$HY.set(e)}`;
+const SYNC_SCRIPT = `_$HY.sync=!0;for(let e=0;e<_$HY.queue.length;e++)_$HY.queue[e]()`;
 function renderToString(code, options = {}) {
-  solidJs.sharedConfig.context = Object.assign({
+  solidJs.sharedConfig.context = {
     id: "",
     count: 0,
-    assets: []
-  }, options);
+    suspense: {},
+    assets: [],
+    nonce: options.nonce
+  };
   let html = resolveSSRNode(escape(code()));
-  return injectAssets(solidJs.sharedConfig.context.assets, html);
+  return injectAssets(solidJs.sharedConfig.context.assets, html) + `<script${options.nonce ? ` nonce="${options.nonce}"` : ""}>${SYNC_SCRIPT}</script>`;
 }
 function renderToStringAsync(code, options = {}) {
-  options = {
-    timeoutMs: 30000,
-    ...options
-  };
-  const context = solidJs.sharedConfig.context = Object.assign({
+  const {
+    nonce,
+    timeoutMs = 30000
+  } = options;
+  const context = solidJs.sharedConfig.context = {
     id: "",
     count: 0,
     resources: {},
     suspense: {},
     assets: [],
-    async: true
-  }, options);
-  const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), options.timeoutMs));
-  return Promise.race([solidJs.awaitSuspense(() => escape(code())), timeout]).then(res => {
+    async: true,
+    nonce
+  };
+  let scripts = "";
+  solidJs.sharedConfig.context.writeResource = (id, p) => p.then(d => scripts += `_$HY.set("${id}", ${devalue(d)});`);
+  const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), timeoutMs));
+  return Promise.race([asyncWrap(() => escape(code())), timeout]).then(res => {
     let html = resolveSSRNode(res);
+    html += `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts.length ? scripts + ";" : ""}${SYNC_SCRIPT}</script>`;
     return injectAssets(context.assets, html);
   });
 }
-function pipeToNodeWritable(code, writable, options = {}) {
+function renderToPipeableStream(code, options) {
   const {
     nonce,
-    onReady = ({
-      startWriting
-    }) => startWriting(),
-    onComplete
+    onCompleteShell,
+    onCompleteAll
   } = options;
   const tmp = [];
-  let count = 0,
-      completed = 0,
-      buffer = {
-    write(payload) {
-      tmp.push(payload);
+  const tasks = [];
+  const registry = new Set();
+  const checkEnd = () => {
+    if (!registry.size && !completed) {
+      onCompleteAll && onCompleteAll(result);
+      writable && writable.end();
+      completed = true;
     }
   };
-  const result = {
-    startWriting() {
-      buffer = writable;
-      tmp.forEach(chunk => buffer.write(chunk));
-      setTimeout(checkEnd);
-    },
-    write(c) {
-      writable.write(c);
-    },
-    abort() {
-      completed = count;
-      checkEnd();
+  const writeInitialScript = () => {
+    if (tasks.length) {
+      buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.join(";")}</script>`);
+      tasks.length = 0;
     }
+    scheduled = false;
   };
-  const checkEnd = () => {
-    if (completed === count) {
-      onComplete && onComplete(result);
-      writable.end();
+  let writable;
+  let completed = false;
+  let scriptFlushed = false;
+  let scheduled = true;
+  let buffer = {
+    write(payload) {
+      tmp.push(payload);
     }
   };
-  solidJs.sharedConfig.context = Object.assign({
+  solidJs.sharedConfig.context = {
     id: "",
     count: 0,
+    async: true,
     streaming: true,
+    resources: {},
     suspense: {},
-    assets: []
-  }, options);
-  solidJs.sharedConfig.context.writeResource = (id, p) => {
-    count++;
-    Promise.resolve().then(() => buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.startResource("${id}")</script>`));
-    p.then(d => {
-      buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.resolveResource("${id}", ${devalue(d)})</script>`);
-      ++completed && checkEnd();
-    });
+    assets: [],
+    nonce,
+    writeResource(id, p) {
+      if (!scheduled) {
+        Promise.resolve().then(writeInitialScript);
+        scheduled = true;
+      }
+      tasks.push(`_$HY.init("${id}")`);
+      p.then(d => {
+        buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", ${devalue(d)})</script>`);
+      });
+    },
+    registerFragment(key) {
+      registry.add(key);
+      Promise.resolve().then(() => {
+        if (registry.has(key)) {
+          if (!scheduled) {
+            Promise.resolve().then(writeInitialScript);
+            scheduled = true;
+          }
+          tasks.push(`_$HY.init("${key}")`);
+        }
+      });
+      return value => {
+        registry.delete(key);
+        if (!value) return;
+        Promise.resolve().then(() => {
+          buffer.write(`<div hidden id="${key}">${value}</div><script${nonce ? ` nonce="${nonce}"` : ""}>${!scriptFlushed ? REPLACE_SCRIPT : ""}$df("${key}")</script>`);
+          scriptFlushed = true;
+          checkEnd();
+        });
+      };
+    }
   };
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(solidJs.sharedConfig.context.assets, html);
   buffer.write(html);
-  onReady(result);
+  Promise.resolve().then(() => {
+    writeInitialScript();
+    buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>${SYNC_SCRIPT}</script>`);
+    onCompleteShell && onCompleteShell();
+  });
+  return {
+    pipe(w) {
+      buffer = writable = w;
+      tmp.forEach(chunk => buffer.write(chunk));
+      if (completed) writable.end();else setTimeout(checkEnd);
+    }
+  };
 }
 function pipeToWritable(code, writable, options = {}) {
   const {
     nonce,
-    onReady = ({
+    onCompleteShell = ({
       startWriting
     }) => startWriting(),
-    onComplete
+    onCompleteAll
   } = options;
   const tmp = [];
+  const tasks = [];
   const writer = writable.getWriter();
   const encoder = new TextEncoder();
-  solidJs.sharedConfig.context = Object.assign({
-    id: "",
-    count: 0,
-    streaming: true,
-    suspense: {},
-    assets: []
-  }, options);
-  let count = 0,
-      completed = 0,
-      buffer = {
+  const registry = new Set();
+  const checkEnd = () => {
+    if (!registry.size && !completed) {
+      onCompleteAll && onCompleteAll(result);
+      writable && writable.close();
+      completed = true;
+    }
+  };
+  const writeInitialScript = () => {
+    if (tasks.length) {
+      buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.join(";")}</script>`));
+      tasks.length = 0;
+    }
+    scheduled = false;
+  };
+  let completed = false;
+  let scriptFlushed = false;
+  let scheduled = true;
+  let buffer = {
     write(payload) {
       tmp.push(payload);
     }
@@ -351,28 +402,62 @@ function pipeToWritable(code, writable, options = {}) {
       writer.write(encoder.encode(c));
     },
     abort() {
-      completed = count;
+      registry.clear();
       checkEnd();
     }
   };
-  const checkEnd = () => {
-    if (completed === count) {
-      onComplete && onComplete(result);
-      writable.close();
+  solidJs.sharedConfig.context = {
+    id: "",
+    count: 0,
+    async: true,
+    streaming: true,
+    resources: {},
+    suspense: {},
+    assets: [],
+    nonce,
+    writeResource(id, p) {
+      if (!scheduled) {
+        Promise.resolve().then(writeInitialScript);
+        scheduled = true;
+      }
+      tasks.push(`_$HY.init("${id}")`);
+      p.then(d => {
+        buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", ${devalue(d)})</script>`));
+      });
+    },
+    registerFragment(key) {
+      registry.add(key);
+      Promise.resolve().then(() => {
+        if (registry.has(key)) {
+          if (!scheduled) {
+            Promise.resolve().then(writeInitialScript);
+            scheduled = true;
+          }
+          tasks.push(`_$HY.init("${key}")`);
+        }
+      });
+      return value => {
+        registry.delete(key);
+        if (!value) return;
+        Promise.resolve().then(() => {
+          buffer.write(encoder.encode(`<div hidden id="${key}">${value}</div><script${nonce ? ` nonce="${nonce}"` : ""}>${!scriptFlushed ? REPLACE_SCRIPT : ""}$df("${key}")</script>`));
+          scriptFlushed = true;
+          checkEnd();
+        });
+      };
     }
   };
-  solidJs.sharedConfig.context.writeResource = (id, p) => {
-    count++;
-    Promise.resolve().then(() => buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.startResource("${id}")</script>`)));
-    p.then(d => {
-      buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.resolveResource("${id}", ${devalue(d)})</script>`));
-      ++completed && checkEnd();
-    });
-  };
   let html = resolveSSRNode(escape(code()));
   html = injectAssets(solidJs.sharedConfig.context.assets, html);
   buffer.write(encoder.encode(html));
-  onReady(result);
+  Promise.resolve().then(() => {
+    writeInitialScript();
+    buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>${SYNC_SCRIPT}</script>`));
+    onCompleteShell && onCompleteShell(result);
+  });
+}
+function pipeToNodeWritable(code, writable, options = {}) {
+  renderToPipeableStream(code, options).pipe(writable);
 }
 function Assets(props) {
   solidJs.sharedConfig.context.assets.push(() => NoHydration({
@@ -382,15 +467,21 @@ function Assets(props) {
   }));
   return ssr(`%%$${solidJs.sharedConfig.context.assets.length - 1}%%`);
 }
-function HydrationScript() {
-  solidJs.sharedConfig.context.assets.push(generateHydrationScript);
+function HydrationScript(props) {
+  const {
+    nonce
+  } = solidJs.sharedConfig.context;
+  solidJs.sharedConfig.context.assets.push(() => generateHydrationScript({
+    nonce,
+    ...props
+  }));
   return ssr(`%%$${solidJs.sharedConfig.context.assets.length - 1}%%`);
 }
 function NoHydration(props) {
   const c = solidJs.sharedConfig.context;
-  delete solidJs.sharedConfig.context;
+  c.noHydrate = true;
   const children = props.children;
-  solidJs.sharedConfig.context = c;
+  c.noHydrate = false;
   return children;
 }
 function ssr(t, ...nodes) {
@@ -518,26 +609,13 @@ function resolveSSRNode(node) {
 }
 function getHydrationKey() {
   const hydrate = solidJs.sharedConfig.context;
-  return hydrate && `${hydrate.id}${hydrate.count++}`;
+  return hydrate && !hydrate.noHydrate && `${hydrate.id}${hydrate.count++}`;
 }
-function generateHydrationScript() {
-  const {
-    nonce,
-    streaming,
-    resources,
-    eventNames = ["click", "input"]
-  } = solidJs.sharedConfig.context;
-  let s = `<script${nonce ? ` nonce="${nonce}"` : ""}>(()=>{_$HYDRATION={events:[],completed:new WeakSet};const t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),e=e=>{let o=e.composedPath&&e.composedPath()[0]||e.target,s=t(o);s&&!_$HYDRATION.completed.has(s)&&_$HYDRATION.events.push([s,e])};["${eventNames.join('","')}"].forEach(t=>document.addEventListener(t,e))})();`;
-  if (streaming) {
-    s += `(()=>{const e=_$HYDRATION,o={};e.startResource=e=>{let r;o[e]=[new Promise(e=>r=e),r]},e.resolveResource=(e,r)=>{const n=o[e];if(!n)return o[e]=[r];n[1](r)},e.loadResource=e=>{const r=o[e];if(r)return r[0]}})();`;
-  }
-  if (resources) {
-    s += `_$HYDRATION.resources = ${devalue(Object.keys(resources).reduce((r, k) => {
-      r[k] = resources[k].data;
-      return r;
-    }, {}))};`;
-  }
-  return s + `</script>`;
+function generateHydrationScript({
+  eventNames = ["click", "input"],
+  nonce
+}) {
+  return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet,queue:[]}));</script>`;
 }
 function injectAssets(assets, html) {
   for (let i = 0; i < assets.length; i++) {
@@ -545,6 +623,33 @@ function injectAssets(assets, html) {
   }
   return html;
 }
+const FRAGMENT_REPLACE = /<!\[([\d.]+)\]>/;
+function asyncWrap(fn) {
+  return new Promise(resolve => {
+    const registry = new Set();
+    const cache = Object.create(null);
+    solidJs.sharedConfig.context.registerFragment = register;
+    const rendered = fn();
+    if (!registry.size) resolve(rendered);
+    function register(key) {
+      registry.add(key);
+      return value => {
+        if (value) cache[key] = value;
+        registry.delete(key);
+        if (!registry.size) Promise.resolve().then(() => {
+          let source = resolveSSRNode(rendered);
+          let final = "";
+          let match;
+          while (match = source.match(FRAGMENT_REPLACE)) {
+            final += source.substring(0, match.index);
+            source = cache[match[1]] + source.substring(match.index + match[0].length);
+          }
+          resolve(final + source);
+        });
+      };
+    }
+  });
+}
 
 const isServer = true;
 function spread() {}
@@ -634,6 +739,7 @@ exports.getHydrationKey = getHydrationKey;
 exports.isServer = isServer;
 exports.pipeToNodeWritable = pipeToNodeWritable;
 exports.pipeToWritable = pipeToWritable;
+exports.renderToPipeableStream = renderToPipeableStream;
 exports.renderToString = renderToString;
 exports.renderToStringAsync = renderToStringAsync;
 exports.resolveSSRNode = resolveSSRNode;