@quilted/quilt 0.5.136 → 0.5.137

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @quilted/quilt
 
+## 0.5.137
+
+### Patch Changes
+
+- [#527](https://github.com/lemonmade/quilt/pull/527) [`a255c7c2`](https://github.com/lemonmade/quilt/commit/a255c7c284391b2c3157fffed5a5feb576cd45ac) Thanks [@lemonmade](https://github.com/lemonmade)! - Improve asset manifests
+
+- Updated dependencies [[`a255c7c2`](https://github.com/lemonmade/quilt/commit/a255c7c284391b2c3157fffed5a5feb576cd45ac)]:
+  - @quilted/assets@0.0.1
+  - @quilted/react-assets@0.0.1
+
 ## 0.5.136
 
 ### Patch Changes

package/build/cjs/index.cjs

@@ -1,7 +1,9 @@
 'use strict';
 
+var assets = require('@quilted/assets');
 var async = require('@quilted/async');
 var events = require('@quilted/events');
+var reactAssets = require('@quilted/react-assets');
 var reactAsync = require('@quilted/react-async');
 var reactGraphql = require('@quilted/react-graphql');
 var reactIdle = require('@quilted/react-idle');
@@ -16,6 +18,30 @@ var App = require('./App.cjs');
 
 
 
+Object.defineProperty(exports, 'createBrowserAssetsEntryFromManifest', {
+  enumerable: true,
+  get: function () { return assets.createBrowserAssetsEntryFromManifest; }
+});
+Object.defineProperty(exports, 'createBrowserAssetsFromManifests', {
+  enumerable: true,
+  get: function () { return assets.createBrowserAssetsFromManifests; }
+});
+Object.defineProperty(exports, 'scriptAssetAttributes', {
+  enumerable: true,
+  get: function () { return assets.scriptAssetAttributes; }
+});
+Object.defineProperty(exports, 'scriptAssetPreloadAttributes', {
+  enumerable: true,
+  get: function () { return assets.scriptAssetPreloadAttributes; }
+});
+Object.defineProperty(exports, 'styleAssetAttributes', {
+  enumerable: true,
+  get: function () { return assets.styleAssetAttributes; }
+});
+Object.defineProperty(exports, 'styleAssetPreloadAttributes', {
+  enumerable: true,
+  get: function () { return assets.styleAssetPreloadAttributes; }
+});
 Object.defineProperty(exports, 'createAsyncModule', {
   enumerable: true,
   get: function () { return async.createAsyncModule; }
@@ -56,6 +82,10 @@ Object.defineProperty(exports, 'sleep', {
   enumerable: true,
   get: function () { return events.sleep; }
 });
+Object.defineProperty(exports, 'useUpdateCacheKey', {
+  enumerable: true,
+  get: function () { return reactAssets.useUpdateCacheKey; }
+});
 Object.defineProperty(exports, 'createAsyncComponent', {
   enumerable: true,
   get: function () { return reactAsync.createAsyncComponent; }

package/build/cjs/server/ServerContext.cjs

@@ -1,20 +1,22 @@
 'use strict';
 
+var server$3 = require('@quilted/react-assets/server');
 var reactRouter = require('@quilted/react-router');
-var server$1 = require('@quilted/react-html/server');
-var server$2 = require('@quilted/react-async/server');
-var server = require('@quilted/react-http/server');
+var server$2 = require('@quilted/react-html/server');
+var server = require('@quilted/react-async/server');
+var server$1 = require('@quilted/react-http/server');
 var react = require('../utilities/react.cjs');
 
 function ServerContext({
   url,
   html,
   http,
+  assets,
   asyncAssets,
   children
 }) {
   const normalizedUrl = typeof url === 'string' ? new URL(url) : url;
-  return react.maybeWrapContext(server$2.AsyncAssetContext, asyncAssets, react.maybeWrapContext(server.HttpServerContext, http, react.maybeWrapContext(server$1.HtmlContext, html, react.maybeWrapContext(reactRouter.InitialUrlContext, normalizedUrl, children))));
+  return react.maybeWrapContext(server$3.AssetsContext, assets, react.maybeWrapContext(server.AsyncAssetContext, asyncAssets, react.maybeWrapContext(server$1.HttpServerContext, http, react.maybeWrapContext(server$2.HtmlContext, html, react.maybeWrapContext(reactRouter.InitialUrlContext, normalizedUrl, children)))));
 }
 
 exports.ServerContext = ServerContext;

package/build/cjs/server/index.cjs

@@ -2,13 +2,15 @@
 
 var server = require('@quilted/react-html/server');
 var server$1 = require('@quilted/react-server-render/server');
-var server$2 = require('@quilted/async/server');
+var assets = require('@quilted/assets');
+var server$2 = require('@quilted/react-assets/server');
 var server$3 = require('@quilted/react-async/server');
 var requestRouter = require('@quilted/react-localize/request-router');
 var requestRouter$1 = require('@quilted/request-router');
 var reactLocalize = require('@quilted/react-localize');
 var ServerContext = require('./ServerContext.cjs');
 var requestRouter$2 = require('./request-router.cjs');
+var preload = require('./preload.cjs');
 
 
 
@@ -56,25 +58,45 @@ Object.defineProperty(exports, 'useServerAction', {
   enumerable: true,
   get: function () { return server$1.useServerAction; }
 });
-Object.defineProperty(exports, 'createAssetManifest', {
+Object.defineProperty(exports, 'createBrowserAssetsEntryFromManifest', {
   enumerable: true,
-  get: function () { return server$2.createAssetManifest; }
+  get: function () { return assets.createBrowserAssetsEntryFromManifest; }
+});
+Object.defineProperty(exports, 'createBrowserAssetsFromManifests', {
+  enumerable: true,
+  get: function () { return assets.createBrowserAssetsFromManifests; }
 });
 Object.defineProperty(exports, 'scriptAssetAttributes', {
   enumerable: true,
-  get: function () { return server$2.scriptAssetAttributes; }
+  get: function () { return assets.scriptAssetAttributes; }
 });
 Object.defineProperty(exports, 'scriptAssetPreloadAttributes', {
   enumerable: true,
-  get: function () { return server$2.scriptAssetPreloadAttributes; }
+  get: function () { return assets.scriptAssetPreloadAttributes; }
 });
 Object.defineProperty(exports, 'styleAssetAttributes', {
   enumerable: true,
-  get: function () { return server$2.styleAssetAttributes; }
+  get: function () { return assets.styleAssetAttributes; }
 });
 Object.defineProperty(exports, 'styleAssetPreloadAttributes', {
   enumerable: true,
-  get: function () { return server$2.styleAssetPreloadAttributes; }
+  get: function () { return assets.styleAssetPreloadAttributes; }
+});
+Object.defineProperty(exports, 'ASSETS_SERVER_ACTION_ID', {
+  enumerable: true,
+  get: function () { return server$2.SERVER_ACTION_ID; }
+});
+Object.defineProperty(exports, 'AssetsContext', {
+  enumerable: true,
+  get: function () { return server$2.AssetsContext; }
+});
+Object.defineProperty(exports, 'AssetsManager', {
+  enumerable: true,
+  get: function () { return server$2.AssetsManager; }
+});
+Object.defineProperty(exports, 'useUpdateCacheKey', {
+  enumerable: true,
+  get: function () { return server$2.useUpdateCacheKey; }
 });
 Object.defineProperty(exports, 'ASYNC_ASSETS_SERVER_ACTION_ID', {
   enumerable: true,
@@ -124,3 +146,4 @@ exports.ServerContext = ServerContext.ServerContext;
 exports.createServerRender = requestRouter$2.createServerRender;
 exports.renderAppToResponse = requestRouter$2.renderAppToResponse;
 exports.renderAppToStreamedResponse = requestRouter$2.renderAppToStreamedResponse;
+exports.createAssetPreloader = preload.createAssetPreloader;

package/build/cjs/server/preload.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+var requestRouter = require('@quilted/request-router');
+
+function createAssetPreloader(options) {
+  return async function handler(request, requestContext) {
+    const manifest = await assetsForRequest(request, {
+      ...options,
+      context: requestContext
+    });
+    return requestRouter.json(manifest);
+  };
+}
+async function assetsForRequest(request, {
+  assets,
+  context,
+  cacheKey: getCacheKey
+}) {
+  const url = new URL(request.url);
+  const modules = url.searchParams.get('modules')?.split(',') ?? [];
+  const includeStyles = url.searchParams.get('styles') !== 'false';
+  const includeScripts = url.searchParams.get('scripts') !== 'false';
+  const cacheKey = (await getCacheKey?.(request, context)) ?? (await assets.cacheKey?.(request));
+  const {
+    styles,
+    scripts
+  } = await assets.entry({
+    modules,
+    cacheKey
+  });
+  const result = {};
+  if (includeStyles) result.styles = styles;
+  if (includeScripts) result.scripts = scripts;
+  return result;
+}
+
+exports.createAssetPreloader = createAssetPreloader;

package/build/cjs/server/request-router.cjs

@@ -1,17 +1,17 @@
 'use strict';
 
 var react = require('react');
-var server = require('@quilted/async/server');
-var server$2 = require('@quilted/react-async/server');
-var server$3 = require('@quilted/react-http/server');
-var server$1 = require('@quilted/react-html/server');
+var assets = require('@quilted/assets');
+var server$3 = require('@quilted/react-assets/server');
+var server$1 = require('@quilted/react-async/server');
+var server$2 = require('@quilted/react-http/server');
+var server = require('@quilted/react-html/server');
 var server$4 = require('@quilted/react-server-render/server');
 var requestRouter = require('@quilted/request-router');
 var ServerContext = require('./ServerContext.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
 function createServerRender(getApp, {
-  context,
   stream,
   ...options
 } = {}) {
@@ -19,23 +19,29 @@ function createServerRender(getApp, {
     const accepts = request.headers.get('Accept');
     if (accepts != null && !accepts.includes('text/html')) return;
     const renderResponse = stream ? renderAppToStreamedResponse : renderAppToResponse;
-    return renderResponse(typeof getApp === 'function' ? () => getApp(request, requestContext) : getApp, request, {
+    return renderResponse(typeof getApp === 'function' ? () => getApp(request, requestContext) : getApp, {
       ...options,
+      request,
+      context: requestContext,
       extract: {
         ...options.extract,
-        context: options.extract ?? context?.(request, requestContext) ?? requestContext
+        context: typeof options.extract?.context === 'function' ? options.extract.context(request, requestContext) : options.extract?.context
       }
     });
   };
 }
-async function renderAppToResponse(getApp, request, {
+async function renderAppToResponse(getApp, {
+  request,
+  context,
   assets,
   extract,
   renderHtml
-} = {}) {
+}) {
   const app = typeof getApp === 'function' ? await getApp() : getApp;
+  const cacheKey = await assets?.cacheKey?.(request);
   const renderDetails = await serverRenderDetailsForApp(app, {
     extract,
+    cacheKey,
     url: request.url,
     headers: request.headers
   });
@@ -50,7 +56,9 @@ async function renderAppToResponse(getApp, request, {
       headers
     });
   }
-  const content = await renderAppDetailsToHtmlString(renderDetails, request, {
+  const content = await renderAppDetailsToHtmlString(renderDetails, {
+    request,
+    context,
     assets,
     renderHtml
   });
@@ -59,25 +67,25 @@ async function renderAppToResponse(getApp, request, {
     status: statusCode
   });
 }
-async function renderAppToStreamedResponse(getApp, request, {
-  assets,
+async function renderAppToStreamedResponse(getApp, {
+  request,
+  context,
+  assets: assets$1,
   extract,
   renderHtml
-} = {}) {
+}) {
   const headers = new Headers();
   const stream = new TransformStream();
-  const assetContext = {
-    userAgent: request.headers.get('User-Agent')
-  };
-  const guaranteedAssets = await assets?.assets({
-    context: assetContext
+  const cacheKey = await assets$1?.cacheKey?.(request);
+  const guaranteedAssets = await assets$1?.entry({
+    cacheKey
   });
   if (guaranteedAssets) {
     for (const style of guaranteedAssets.styles) {
-      headers.append('Link', preloadHeader(server.styleAssetPreloadAttributes(style)));
+      headers.append('Link', preloadHeader(assets.styleAssetPreloadAttributes(style)));
     }
     for (const script of guaranteedAssets.scripts) {
-      headers.append('Link', preloadHeader(server.scriptAssetPreloadAttributes(script)));
+      headers.append('Link', preloadHeader(assets.scriptAssetPreloadAttributes(script)));
     }
   }
   renderResponseToStream();
@@ -89,11 +97,14 @@ async function renderAppToStreamedResponse(getApp, request, {
     const app = typeof getApp === 'function' ? await getApp() : getApp;
     const renderDetails = await serverRenderDetailsForApp(app, {
       extract,
+      cacheKey,
       url: request.url,
       headers: request.headers
     });
-    const content = await renderAppDetailsToHtmlString(renderDetails, request, {
-      assets,
+    const content = await renderAppDetailsToHtmlString(renderDetails, {
+      request,
+      context,
+      assets: assets$1,
       renderHtml
     });
     const encoder = new TextEncoder();
@@ -105,13 +116,17 @@ async function renderAppToStreamedResponse(getApp, request, {
 async function serverRenderDetailsForApp(app, {
   url,
   headers,
+  cacheKey,
   extract: extractOptions
 } = {}) {
-  const html = new server$1.HtmlManager();
-  const asyncAssets = new server$2.AsyncAssetManager();
-  const http = new server$3.HttpManager({
+  const html = new server.HtmlManager();
+  const asyncAssets = new server$1.AsyncAssetManager();
+  const http = new server$2.HttpManager({
     headers
   });
+  const assets = new server$3.AssetsManager({
+    cacheKey
+  });
   const {
     decorate,
     ...rest
@@ -123,6 +138,7 @@ async function serverRenderDetailsForApp(app, {
         http: http,
         html: html,
         url: url,
+        assets: assets,
         children: decorate?.(app) ?? app
       });
     },
@@ -132,66 +148,71 @@ async function serverRenderDetailsForApp(app, {
     rendered,
     http,
     html,
-    asyncAssets
+    asyncAssets,
+    assets
   };
 }
-async function renderAppDetailsToHtmlString(details, request, {
+async function renderAppDetailsToHtmlString(details, {
+  request,
+  context,
   assets,
   renderHtml = defaultRenderHtml
-} = {}) {
+}) {
   const {
-    html: htmlManager,
     http,
     rendered,
-    asyncAssets
+    asyncAssets,
+    html: htmlManager,
+    assets: assetsManager
   } = details;
-  const usedAssets = asyncAssets.used({
+  const usedModules = asyncAssets.used({
     timing: 'load'
   });
-  const assetContext = {
-    userAgent: request.headers.get('User-Agent')
-  };
-  const [entryAssets, preloadAssets] = assets ? await Promise.all([assets.assets({
-    async: usedAssets,
-    context: assetContext
-  }), assets.asyncAssets(asyncAssets.used({
+  const cacheKey = assetsManager.cacheKey;
+  const [entryAssets, preloadAssets] = assets ? await Promise.all([assets.entry({
+    modules: usedModules,
+    cacheKey
+  }), assets.modules(asyncAssets.used({
     timing: 'preload'
   }), {
-    context: assetContext
+    cacheKey
   })]) : [];
-  const htmlElement = await renderHtml(rendered, request, {
+  const htmlElement = await renderHtml(rendered, {
+    request,
+    context,
     html: htmlManager,
     http,
     assets: entryAssets,
     preloadAssets
   });
-  return server$1.renderHtmlToString(htmlElement);
+  return server.renderHtmlToString(htmlElement);
 }
-const defaultRenderHtml = function defaultRenderHtml(content, request, {
+const defaultRenderHtml = function defaultRenderHtml(content, {
+  request,
   html,
-  assets,
+  assets: assets$1,
   preloadAssets
 }) {
   const baseUrl = new URL(request.url);
-  return /*#__PURE__*/jsxRuntime.jsx(server$1.Html, {
+  return /*#__PURE__*/jsxRuntime.jsx(server.Html, {
     manager: html,
     headEndContent: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [assets && [...assets.styles].map(style => {
-        const attributes = server.styleAssetAttributes(style, {
+      children: [assets$1 && assets$1.styles.map(style => {
+        const attributes = assets.styleAssetAttributes(style, {
           baseUrl
         });
         return /*#__PURE__*/jsxRuntime.jsx("link", {
           ...attributes
         }, style.source);
-      }), assets && [...assets.scripts].map(script => {
-        const isModule = script.attributes.type === 'module';
-        const attributes = server.scriptAssetAttributes(script, {
+      }), assets$1 && assets$1.scripts.map(script => {
+        const isModule = script.attributes?.type === 'module';
+        const attributes = assets.scriptAssetAttributes(script, {
           baseUrl
         });
         if (isModule) {
           return /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
             children: [/*#__PURE__*/jsxRuntime.jsx("link", {
-              ...server.scriptAssetPreloadAttributes(script)
+              ...assets.scriptAssetPreloadAttributes(script)
             }), /*#__PURE__*/jsxRuntime.jsx("script", {
               ...attributes,
               async: true
@@ -202,15 +223,15 @@ const defaultRenderHtml = function defaultRenderHtml(content, request, {
           ...attributes,
           defer: true
         }, script.source);
-      }), preloadAssets && [...preloadAssets.styles].map(style => {
-        const attributes = server.styleAssetPreloadAttributes(style, {
+      }), preloadAssets && preloadAssets.styles.map(style => {
+        const attributes = assets.styleAssetPreloadAttributes(style, {
           baseUrl
         });
         return /*#__PURE__*/jsxRuntime.jsx("link", {
           ...attributes
         }, style.source);
-      }), preloadAssets && [...preloadAssets.scripts].map(script => {
-        const attributes = server.scriptAssetPreloadAttributes(script, {
+      }), preloadAssets && preloadAssets.scripts.map(script => {
+        const attributes = assets.scriptAssetPreloadAttributes(script, {
           baseUrl
         });
         return /*#__PURE__*/jsxRuntime.jsx("link", {

package/build/cjs/static/StaticContext.cjs

@@ -1,20 +1,22 @@
 'use strict';
 
+var server$3 = require('@quilted/react-assets/server');
 var reactRouter = require('@quilted/react-router');
-var server$1 = require('@quilted/react-html/server');
-var server$2 = require('@quilted/react-async/server');
-var server = require('@quilted/react-http/server');
+var server$2 = require('@quilted/react-html/server');
+var server = require('@quilted/react-async/server');
+var server$1 = require('@quilted/react-http/server');
 var react = require('../utilities/react.cjs');
 
 function StaticContext({
   url,
   html,
   http,
+  assets,
   asyncAssets,
   children
 }) {
   const normalizedUrl = typeof url === 'string' ? new URL(url) : url;
-  return react.maybeWrapContext(server$2.AsyncAssetContext, asyncAssets, react.maybeWrapContext(server.HttpServerContext, http, react.maybeWrapContext(server$1.HtmlContext, html, react.maybeWrapContext(reactRouter.InitialUrlContext, normalizedUrl, children))));
+  return react.maybeWrapContext(server$3.AssetsContext, assets, react.maybeWrapContext(server.AsyncAssetContext, asyncAssets, react.maybeWrapContext(server$1.HttpServerContext, http, react.maybeWrapContext(server$2.HtmlContext, html, react.maybeWrapContext(reactRouter.InitialUrlContext, normalizedUrl, children)))));
 }
 
 exports.StaticContext = StaticContext;

package/build/cjs/static/index.cjs

@@ -1,6 +1,7 @@
 'use strict';
 
-var server$1 = require('@quilted/async/server');
+var react = require('react');
+var assets = require('@quilted/assets');
 var server = require('@quilted/react-html/server');
 var _static = require('@quilted/react-router/static');
 var render = require('./render.cjs');
@@ -8,7 +9,7 @@ var jsxRuntime = require('react/jsx-runtime');
 
 const BASE_URL = 'http://localhost:3000';
 async function renderStatic(App, {
-  assets,
+  assets: assets$1,
   routes: startingRoutes,
   onRender,
   crawl = true,
@@ -159,13 +160,16 @@ async function renderStatic(App, {
     const routeRecorder = new _static.StaticRenderer({
       forceFallback: fallback ? url.pathname : undefined
     });
+    const initialCacheKey = await assets$1.cacheKey?.(new Request(url));
     const {
       http,
       html: htmlManager,
+      assets: assetsManager,
       markup,
       asyncAssets
     } = await render.renderApp( /*#__PURE__*/jsxRuntime.jsx(App, {}), {
       url,
+      cacheKey: initialCacheKey,
       decorate(app) {
         return /*#__PURE__*/jsxRuntime.jsx(_static.StaticRendererContext.Provider, {
           value: routeRecorder,
@@ -173,66 +177,49 @@ async function renderStatic(App, {
         });
       }
     });
-    const usedAssets = asyncAssets.used({
-      timing: 'load'
-    });
-    const [moduleAssets, modulePreload, nomoduleAssets] = await Promise.all([assets.assets({
-      async: usedAssets,
-      context: {
-        modules: true
-      }
-    }), assets.asyncAssets(asyncAssets.used({
+    const cacheKey = assetsManager.cacheKey;
+    const [mainAssets, preloadAssets] = await Promise.all([assets$1.entry({
+      modules: asyncAssets.used({
+        timing: 'load'
+      }),
+      cacheKey
+    }), assets$1.modules(asyncAssets.used({
       timing: 'preload'
     }), {
-      context: {
-        modules: true
-      }
-    }), assets.assets({
-      async: usedAssets,
-      context: {
-        modules: false
-      }
+      cacheKey
     })]);
-
-    // We don’t want to load styles from both bundles, so we only use module styles,
-    // since modules are intended to be the default and CSS (usually) doesn’t
-    // have features that meaningfully break older user agents.
-    const styles = moduleAssets.styles.length > 0 ? moduleAssets.styles : nomoduleAssets.styles;
     const minifiedHtml = server.renderHtmlToString( /*#__PURE__*/jsxRuntime.jsx(server.Html, {
       manager: htmlManager,
       headEndContent: /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-        children: [[...styles].map(style => {
-          const attributes = server$1.styleAssetAttributes(style, {
+        children: [[...mainAssets.styles].map(style => {
+          const attributes = assets.styleAssetAttributes(style, {
             baseUrl: url
           });
           return /*#__PURE__*/jsxRuntime.jsx("link", {
             ...attributes
           }, style.source);
-        }), [...moduleAssets.scripts].map(script => {
-          const attributes = server$1.scriptAssetAttributes(script, {
+        }), [...mainAssets.scripts].map(script => {
+          const attributes = assets.scriptAssetAttributes(script, {
             baseUrl: url
           });
-          return /*#__PURE__*/jsxRuntime.jsx("script", {
+          return attributes.type === 'module' ? /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
+            children: [/*#__PURE__*/jsxRuntime.jsx("link", {
+              ...assets.scriptAssetPreloadAttributes(script)
+            }), /*#__PURE__*/jsxRuntime.jsx("script", {
+              ...attributes
+            })]
+          }, script.source) : /*#__PURE__*/jsxRuntime.jsx("script", {
             ...attributes
           }, script.source);
-        }), [...nomoduleAssets.scripts].map(script => {
-          const attributes = server$1.scriptAssetAttributes(script, {
-            baseUrl: url
-          });
-          return /*#__PURE__*/jsxRuntime.jsx("script", {
-            ...attributes,
-            // @ts-expect-error Rendering to HTML, so using the lowercase name
-            nomodule: moduleAssets.scripts.length > 0 ? true : undefined
-          }, script.source);
-        }), [...modulePreload.styles].map(style => {
-          const attributes = server$1.styleAssetPreloadAttributes(style, {
+        }), [...preloadAssets.styles].map(style => {
+          const attributes = assets.styleAssetPreloadAttributes(style, {
             baseUrl: url
           });
           return /*#__PURE__*/jsxRuntime.jsx("link", {
             ...attributes
           }, style.source);
-        }), [...modulePreload.scripts].map(script => {
-          const attributes = server$1.scriptAssetPreloadAttributes(script, {
+        }), [...preloadAssets.scripts].map(script => {
+          const attributes = assets.scriptAssetPreloadAttributes(script, {
             baseUrl: url
           });
           return /*#__PURE__*/jsxRuntime.jsx("link", {

package/build/cjs/static/render.cjs

@@ -1,9 +1,10 @@
 'use strict';
 
-var server$3 = require('@quilted/react-server-render/server');
+var server$4 = require('@quilted/react-server-render/server');
 var server = require('@quilted/react-html/server');
 var server$2 = require('@quilted/react-http/server');
 var server$1 = require('@quilted/react-async/server');
+var server$3 = require('@quilted/react-assets/server');
 var StaticContext = require('./StaticContext.cjs');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -11,6 +12,7 @@ async function renderApp(app, {
   decorate,
   url,
   headers,
+  cacheKey,
   ...rest
 } = {}) {
   const html = new server.HtmlManager();
@@ -18,7 +20,10 @@ async function renderApp(app, {
   const http = new server$2.HttpManager({
     headers
   });
-  const markup = await server$3.extract(app, {
+  const assets = new server$3.AssetsManager({
+    cacheKey
+  });
+  const markup = await server$4.extract(app, {
     decorate(app) {
       return /*#__PURE__*/jsxRuntime.jsx(StaticContext.StaticContext, {
         asyncAssets: asyncAssets,
@@ -34,6 +39,7 @@ async function renderApp(app, {
     markup,
     http,
     html,
+    assets,
     asyncAssets
   };
 }

package/build/esm/index.mjs

@@ -1,5 +1,7 @@
+export { createBrowserAssetsEntryFromManifest, createBrowserAssetsFromManifests, scriptAssetAttributes, scriptAssetPreloadAttributes, styleAssetAttributes, styleAssetPreloadAttributes } from '@quilted/assets';
 export { createAsyncModule } from '@quilted/async';
 export { AbortError, NestedAbortController, TimedAbortController, anyAbortSignal, createEmitter, on, once, raceAgainstAbortSignal, sleep } from '@quilted/events';
+export { useUpdateCacheKey } from '@quilted/react-assets';
 export { createAsyncComponent, useAsyncModule, useAsyncModulePreload, usePreload } from '@quilted/react-async';
 export { GraphQLContext, createGraphQLHttpFetch, useGraphQLFetch } from '@quilted/react-graphql';
 export { useIdleCallback } from '@quilted/react-idle';