remote-components 0.3.0 → 0.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/dist/config/nextjs.cjs.map +1 -1
  2. package/dist/config/nextjs.js.map +1 -1
  3. package/dist/host/html.cjs +467 -395
  4. package/dist/host/html.cjs.map +1 -1
  5. package/dist/host/html.js +467 -395
  6. package/dist/host/html.js.map +1 -1
  7. package/dist/host/nextjs/app/client-only.cjs +507 -447
  8. package/dist/host/nextjs/app/client-only.cjs.map +1 -1
  9. package/dist/host/nextjs/app/client-only.js +515 -455
  10. package/dist/host/nextjs/app/client-only.js.map +1 -1
  11. package/dist/host/nextjs/app.cjs +5 -6
  12. package/dist/host/nextjs/app.cjs.map +1 -1
  13. package/dist/host/nextjs/app.js +5 -6
  14. package/dist/host/nextjs/app.js.map +1 -1
  15. package/dist/host/nextjs/pages.cjs +6 -11
  16. package/dist/host/nextjs/pages.cjs.map +1 -1
  17. package/dist/host/nextjs/pages.js +9 -11
  18. package/dist/host/nextjs/pages.js.map +1 -1
  19. package/dist/host/react.cjs +435 -374
  20. package/dist/host/react.cjs.map +1 -1
  21. package/dist/host/react.js +435 -374
  22. package/dist/host/react.js.map +1 -1
  23. package/dist/internal/host/nextjs/dom-flight.cjs +16 -7
  24. package/dist/internal/host/nextjs/dom-flight.cjs.map +1 -1
  25. package/dist/internal/host/nextjs/dom-flight.d.ts +2 -2
  26. package/dist/internal/host/nextjs/dom-flight.js +16 -7
  27. package/dist/internal/host/nextjs/dom-flight.js.map +1 -1
  28. package/dist/internal/host/nextjs/image-shared.cjs +2 -2
  29. package/dist/internal/host/nextjs/image-shared.cjs.map +1 -1
  30. package/dist/internal/host/nextjs/image-shared.js +2 -2
  31. package/dist/internal/host/nextjs/image-shared.js.map +1 -1
  32. package/dist/internal/host/server/fetch-remote-component.cjs +183 -149
  33. package/dist/internal/host/server/fetch-remote-component.cjs.map +1 -1
  34. package/dist/internal/host/server/fetch-remote-component.js +185 -149
  35. package/dist/internal/host/server/fetch-remote-component.js.map +1 -1
  36. package/dist/internal/host/shared/remote-image-loader.cjs +2 -5
  37. package/dist/internal/host/shared/remote-image-loader.cjs.map +1 -1
  38. package/dist/internal/host/shared/remote-image-loader.js +2 -5
  39. package/dist/internal/host/shared/remote-image-loader.js.map +1 -1
  40. package/dist/internal/runtime/constants.cjs +6 -6
  41. package/dist/internal/runtime/constants.cjs.map +1 -1
  42. package/dist/internal/runtime/constants.d.ts +3 -3
  43. package/dist/internal/runtime/constants.js +4 -4
  44. package/dist/internal/runtime/constants.js.map +1 -1
  45. package/dist/internal/runtime/html/parse-remote-html.cjs +11 -15
  46. package/dist/internal/runtime/html/parse-remote-html.cjs.map +1 -1
  47. package/dist/internal/runtime/html/parse-remote-html.d.ts +2 -12
  48. package/dist/internal/runtime/html/parse-remote-html.js +17 -15
  49. package/dist/internal/runtime/html/parse-remote-html.js.map +1 -1
  50. package/dist/internal/runtime/loaders/script-loader.cjs +2 -2
  51. package/dist/internal/runtime/loaders/script-loader.cjs.map +1 -1
  52. package/dist/internal/runtime/loaders/script-loader.js +1 -1
  53. package/dist/internal/runtime/loaders/script-loader.js.map +1 -1
  54. package/dist/internal/runtime/metadata.cjs +42 -0
  55. package/dist/internal/runtime/metadata.cjs.map +1 -1
  56. package/dist/internal/runtime/metadata.d.ts +21 -1
  57. package/dist/internal/runtime/metadata.js +38 -0
  58. package/dist/internal/runtime/metadata.js.map +1 -1
  59. package/dist/internal/runtime/patterns.cjs +38 -0
  60. package/dist/internal/runtime/patterns.cjs.map +1 -0
  61. package/dist/internal/runtime/patterns.d.ts +5 -0
  62. package/dist/internal/runtime/patterns.js +12 -0
  63. package/dist/internal/runtime/patterns.js.map +1 -0
  64. package/dist/internal/runtime/turbopack/chunk-loader.cjs +79 -128
  65. package/dist/internal/runtime/turbopack/chunk-loader.cjs.map +1 -1
  66. package/dist/internal/runtime/turbopack/chunk-loader.d.ts +22 -7
  67. package/dist/internal/runtime/turbopack/chunk-loader.js +85 -131
  68. package/dist/internal/runtime/turbopack/chunk-loader.js.map +1 -1
  69. package/dist/internal/runtime/turbopack/module.cjs +56 -57
  70. package/dist/internal/runtime/turbopack/module.cjs.map +1 -1
  71. package/dist/internal/runtime/turbopack/module.d.ts +14 -11
  72. package/dist/internal/runtime/turbopack/module.js +54 -56
  73. package/dist/internal/runtime/turbopack/module.js.map +1 -1
  74. package/dist/internal/runtime/turbopack/remote-scope.cjs +101 -0
  75. package/dist/internal/runtime/turbopack/remote-scope.cjs.map +1 -0
  76. package/dist/internal/runtime/turbopack/remote-scope.d.ts +55 -0
  77. package/dist/internal/runtime/turbopack/remote-scope.js +73 -0
  78. package/dist/internal/runtime/turbopack/remote-scope.js.map +1 -0
  79. package/dist/internal/runtime/turbopack/shared-modules.cjs +62 -56
  80. package/dist/internal/runtime/turbopack/shared-modules.cjs.map +1 -1
  81. package/dist/internal/runtime/turbopack/shared-modules.d.ts +7 -3
  82. package/dist/internal/runtime/turbopack/shared-modules.js +63 -57
  83. package/dist/internal/runtime/turbopack/shared-modules.js.map +1 -1
  84. package/dist/internal/runtime/turbopack/webpack-runtime.cjs +50 -31
  85. package/dist/internal/runtime/turbopack/webpack-runtime.cjs.map +1 -1
  86. package/dist/internal/runtime/turbopack/webpack-runtime.d.ts +5 -2
  87. package/dist/internal/runtime/turbopack/webpack-runtime.js +52 -34
  88. package/dist/internal/runtime/turbopack/webpack-runtime.js.map +1 -1
  89. package/dist/internal/runtime/types.cjs.map +1 -1
  90. package/dist/internal/runtime/types.d.ts +4 -3
  91. package/dist/internal/utils/logger.cjs.map +1 -1
  92. package/dist/internal/utils/logger.d.ts +1 -1
  93. package/dist/internal/utils/logger.js.map +1 -1
  94. package/dist/internal/utils.cjs +5 -0
  95. package/dist/internal/utils.cjs.map +1 -1
  96. package/dist/internal/utils.d.ts +15 -1
  97. package/dist/internal/utils.js +4 -0
  98. package/dist/internal/utils.js.map +1 -1
  99. package/dist/remote/html.cjs.map +1 -1
  100. package/dist/remote/html.js.map +1 -1
  101. package/dist/remote/nextjs/app.cjs +2 -1
  102. package/dist/remote/nextjs/app.cjs.map +1 -1
  103. package/dist/remote/nextjs/app.js +2 -1
  104. package/dist/remote/nextjs/app.js.map +1 -1
  105. package/package.json +1 -1
@@ -37,11 +37,168 @@ var import_skeleton = require("#internal/host/nextjs/skeleton");
37
37
  var import_fetch_with_hooks = require("#internal/host/server/fetch-with-hooks");
38
38
  var import_get_client_src = require("#internal/host/server/get-client-src");
39
39
  var import_get_ssr_relative_path_base_url = require("#internal/host/server/get-ssr-relative-path-base-url");
40
+ var import_metadata = require("#internal/runtime/metadata");
41
+ var import_utils = require("#internal/utils");
40
42
  var import_error = require("#internal/utils/error");
41
- const CURRENT_ZONE = process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION;
42
- async function fetchRemoteComponent(src, options = {
43
- rsc: false
44
- }) {
43
+ async function buildRscComponent(rsc, serverUrl) {
44
+ const componentRSC = `0:${JSON.stringify(rsc)}
45
+ `;
46
+ const { createFromReadableStream } = await import("next/dist/compiled/react-server-dom-webpack/client.edge");
47
+ return createFromReadableStream(
48
+ new ReadableStream({
49
+ type: "bytes",
50
+ start(controller) {
51
+ const encoder = new TextEncoder();
52
+ controller.enqueue(encoder.encode(componentRSC));
53
+ controller.close();
54
+ }
55
+ }),
56
+ {
57
+ serverConsumerManifest: {
58
+ moduleLoading: {
59
+ prefix: serverUrl.origin,
60
+ crossOrigin: true
61
+ },
62
+ moduleMap: {}
63
+ }
64
+ }
65
+ );
66
+ }
67
+ function buildSkeletonResponse(serverUrl, metadata, skeletonComponent) {
68
+ return {
69
+ name: "remote-component-skeleton",
70
+ serverUrl,
71
+ metadata: {
72
+ ...metadata,
73
+ type: "remote-component"
74
+ },
75
+ rsc: (0, import_skeleton.getSkeletonMessage)(),
76
+ scripts: [],
77
+ links: [],
78
+ hydrationData: [],
79
+ nextData: void 0,
80
+ component: skeletonComponent,
81
+ html: (0, import_skeleton.getSkeletonHtml)(serverUrl.href),
82
+ remoteShared: {}
83
+ };
84
+ }
85
+ function scopeChunkReferences(chunk, bundle, scopedName) {
86
+ return chunk.replaceAll(`[${bundle}]`, `[${scopedName}]`);
87
+ }
88
+ function visitFragment(fragment, serverUrl, remoteName) {
89
+ const scriptSrcSet = /* @__PURE__ */ new Set();
90
+ const scriptTextSet = /* @__PURE__ */ new Set();
91
+ const scripts = [];
92
+ const linkKeySet = /* @__PURE__ */ new Set();
93
+ const links = [];
94
+ const hydrationData = [];
95
+ const htmlChunks = /* @__PURE__ */ new Set();
96
+ let metadata;
97
+ let nextData;
98
+ let remoteShared = {};
99
+ let hasRSC = false;
100
+ let hasShared = false;
101
+ let error;
102
+ const isCrossOrigin = serverUrl.origin !== (0, import_get_ssr_relative_path_base_url.getSSRRelativePathBaseUrl)();
103
+ const rawRscChunks = [];
104
+ const rsc = (0, import_dom_flight.visit)(fragment, {
105
+ url: serverUrl,
106
+ name: remoteName,
107
+ onMetadata(attrs) {
108
+ const incoming = (0, import_metadata.buildMetadata)(attrs, serverUrl);
109
+ if (!remoteName && metadata && metadata.id !== incoming.id && incoming.id !== "__next" && metadata.id !== "__next" && !nextData) {
110
+ throw (0, import_error.multipleRemoteComponentsError)(serverUrl.href);
111
+ }
112
+ metadata = incoming;
113
+ },
114
+ onScript(attrs) {
115
+ const clientSrc = (0, import_get_client_src.getClientSrc)(attrs.src, serverUrl.href);
116
+ const textContent = typeof attrs.textContent === "string" ? attrs.textContent : void 0;
117
+ if (textContent) {
118
+ if (!scriptTextSet.has(textContent)) {
119
+ scriptTextSet.add(textContent);
120
+ scripts.push({ src: "", textContent });
121
+ }
122
+ } else if (!scriptSrcSet.has(clientSrc)) {
123
+ scriptSrcSet.add(clientSrc);
124
+ scripts.push({ src: clientSrc });
125
+ }
126
+ },
127
+ onLink(attrs) {
128
+ const relativeAttrs = {
129
+ ...attrs,
130
+ href: (0, import_get_client_src.getClientSrc)(attrs.href, serverUrl.href)
131
+ };
132
+ const linkKey = `${relativeAttrs.href}::${attrs.rel}`;
133
+ if (!linkKeySet.has(linkKey)) {
134
+ linkKeySet.add(linkKey);
135
+ links.push(relativeAttrs);
136
+ }
137
+ },
138
+ onRSC(chunk) {
139
+ rawRscChunks.push(chunk);
140
+ hasRSC = true;
141
+ },
142
+ onNextData(data) {
143
+ nextData = data;
144
+ },
145
+ onHTML(chunk) {
146
+ if (!htmlChunks.has(chunk)) {
147
+ htmlChunks.add(chunk);
148
+ }
149
+ },
150
+ onShared(_shared) {
151
+ remoteShared = _shared;
152
+ hasShared = true;
153
+ },
154
+ onError(message, stack) {
155
+ error = new import_error.RemoteComponentsError(message);
156
+ if (stack) {
157
+ error.stack = stack;
158
+ }
159
+ }
160
+ });
161
+ if (isCrossOrigin && metadata?.bundle) {
162
+ const scopedName = (0, import_utils.computeScopedName)(metadata.bundle, {
163
+ remoteHost: serverUrl.host,
164
+ isCrossOrigin: true
165
+ });
166
+ for (const chunk of rawRscChunks) {
167
+ hydrationData.push(
168
+ scopeChunkReferences(chunk, metadata.bundle, scopedName)
169
+ );
170
+ }
171
+ } else {
172
+ hydrationData.push(...rawRscChunks);
173
+ }
174
+ if (error) {
175
+ throw error;
176
+ }
177
+ if (metadata) {
178
+ if (!hasRSC && !nextData && metadata.type === "nextjs") {
179
+ throw new import_error.RemoteComponentsError(
180
+ `The Remote Component at "${serverUrl.href}" seems to be a Next.js component but it does not contain any RSC flight data or Next.js props data. Make sure the remote URL is correct and contains a Remote Component.`
181
+ );
182
+ }
183
+ if (metadata.type === "nextjs" && !hasShared && !nextData?.props.__REMOTE_COMPONENT__?.shared) {
184
+ throw new import_error.RemoteComponentsError(
185
+ `No shared dependencies found for Remote Component at "${serverUrl.href}". Make sure the remote URL is correct and contains a Remote Component with shared dependencies.`
186
+ );
187
+ }
188
+ }
189
+ const resolvedShared = nextData?.props.__REMOTE_COMPONENT__?.shared ?? remoteShared;
190
+ return {
191
+ rsc,
192
+ metadata,
193
+ scripts,
194
+ links,
195
+ hydrationData,
196
+ nextData,
197
+ remoteShared: resolvedShared,
198
+ html: Array.from(htmlChunks).join("")
199
+ };
200
+ }
201
+ async function fetchRemoteComponent(src, options = {}) {
45
202
  const ssrRelativePathBaseUrl = (0, import_get_ssr_relative_path_base_url.getSSRRelativePathBaseUrl)();
46
203
  const serverUrl = new URL(src, ssrRelativePathBaseUrl);
47
204
  const tags = [
@@ -94,122 +251,36 @@ async function fetchRemoteComponent(src, options = {
94
251
  parser.tokenizer.write(decoder.decode(chunk), false);
95
252
  }
96
253
  const fragment = parser.getFragment();
97
- let metadata = {
98
- bundle: CURRENT_ZONE ?? "__vercel_remote_component",
99
- route: "/",
100
- runtime: "webpack",
101
- id: "__vercel_remote_component",
102
- type: "unknown"
103
- };
104
- let remoteShared = {};
105
- const scripts = [];
106
- const links = [];
107
- const hydrationData = [];
108
- let nextData;
109
- let html = "";
110
254
  const remoteName = options.name || (serverUrl.hash ? serverUrl.hash.substring(1) : void 0);
111
- let hasRemoteComponent = false;
112
- let hasRSC = false;
113
- let hasShared = false;
114
- let hasMultipleRemoteComponents = false;
115
- let error;
116
- const rsc = (0, import_dom_flight.visit)(fragment, {
117
- url: serverUrl,
118
- name: remoteName,
119
- onMetadata(_metadata) {
120
- if (hasRemoteComponent && metadata.id !== _metadata.id && _metadata.id !== "__next" && metadata.id !== "__next" && !nextData) {
121
- hasMultipleRemoteComponents = true;
122
- }
123
- metadata = _metadata;
124
- hasRemoteComponent = true;
125
- },
126
- onScript(attrs) {
127
- const clientSrc = (0, import_get_client_src.getClientSrc)(attrs.src, serverUrl.href);
128
- if (!scripts.find(
129
- (it) => it.src === clientSrc || attrs.textContent && it.textContent === attrs.textContent
130
- )) {
131
- scripts.push(
132
- typeof attrs.textContent === "string" ? {
133
- src: "",
134
- textContent: attrs.textContent
135
- } : {
136
- src: clientSrc
137
- }
138
- );
139
- }
140
- },
141
- onLink(attrs) {
142
- const relativeAttrs = {
143
- ...attrs,
144
- href: (0, import_get_client_src.getClientSrc)(attrs.href, serverUrl.href)
145
- };
146
- if (!links.find(
147
- (it) => it.href === relativeAttrs.href && it.rel === attrs.rel
148
- )) {
149
- links.push(relativeAttrs);
150
- }
151
- },
152
- onRSC(chunk) {
153
- hydrationData.push(chunk);
154
- hasRSC = true;
155
- },
156
- onNextData(data) {
157
- nextData = data;
158
- if (data.props.__REMOTE_COMPONENT__) {
159
- Object.assign(metadata, data.props.__REMOTE_COMPONENT__);
160
- metadata.id = "__next";
161
- metadata.route = data.page ?? "/";
162
- }
163
- },
164
- onHTML(_html) {
165
- if (!html.includes(_html)) {
166
- html += _html;
167
- }
168
- },
169
- onShared(_shared) {
170
- remoteShared = _shared;
171
- hasShared = true;
172
- },
173
- onError(message, stack) {
174
- error = new import_error.RemoteComponentsError(message);
175
- if (stack) {
176
- error.stack = stack;
177
- }
178
- }
179
- });
180
- if (error) {
181
- throw error;
182
- }
183
- if (!hasRemoteComponent) {
255
+ const {
256
+ rsc,
257
+ metadata,
258
+ scripts,
259
+ links,
260
+ hydrationData,
261
+ nextData,
262
+ remoteShared,
263
+ html
264
+ } = visitFragment(fragment, serverUrl, remoteName);
265
+ if (!metadata) {
184
266
  const isSSGBuild = process.env.NEXT_PHASE === "phase-production-build";
185
267
  const isSSRRelativePathBase = serverUrl.host === new URL(ssrRelativePathBaseUrl).host;
186
268
  const isPreview = process.env.VERCEL_TARGET_ENV === "preview";
187
269
  if (isSSGBuild && isSSRRelativePathBase && isPreview && options.appRouter) {
188
- const skeletonMessage = (0, import_skeleton.getSkeletonMessage)();
189
- const skeletonHtml = (0, import_skeleton.getSkeletonHtml)(serverUrl.href);
190
270
  let skeletonComponent;
191
271
  if (options.rsc) {
192
272
  const { createElement } = await import("react");
193
273
  skeletonComponent = createElement("div", {
194
- dangerouslySetInnerHTML: { __html: skeletonHtml }
274
+ dangerouslySetInnerHTML: {
275
+ __html: (0, import_skeleton.getSkeletonHtml)(serverUrl.href)
276
+ }
195
277
  });
196
278
  }
197
- return {
198
- name: "remote-component-skeleton",
279
+ return buildSkeletonResponse(
199
280
  serverUrl,
200
- metadata: {
201
- ...metadata,
202
- type: "remote-component"
203
- },
204
- rsc: skeletonMessage,
205
- scripts: [],
206
- links: [],
207
- hydrationData: [],
208
- nextData: void 0,
209
- component: skeletonComponent,
210
- html: skeletonHtml,
211
- remoteShared: {}
212
- };
281
+ (0, import_metadata.buildMetadata)({}, serverUrl),
282
+ skeletonComponent
283
+ );
213
284
  }
214
285
  throw (0, import_error.failedToFetchRemoteComponentError)(
215
286
  serverUrl.href,
@@ -217,47 +288,10 @@ async function fetchRemoteComponent(src, options = {
217
288
  `No Remote Component found. Make sure the remote URL is correct and contains a Remote Component.`
218
289
  );
219
290
  }
220
- if (hasMultipleRemoteComponents && !remoteName) {
221
- throw (0, import_error.multipleRemoteComponentsError)(serverUrl.href);
222
- }
223
- if (!hasRSC && !nextData && metadata.type === "nextjs") {
224
- throw new import_error.RemoteComponentsError(
225
- `The Remote Component at "${serverUrl.href}" seems to be a Next.js component but it does not contain any RSC flight data or Next.js props data. Make sure the remote URL is correct and contains a Remote Component.`
226
- );
227
- }
228
- if (metadata.type === "nextjs" && // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
229
- !hasShared && !nextData?.props.__REMOTE_COMPONENT__?.shared) {
230
- throw new import_error.RemoteComponentsError(
231
- `No shared dependencies found for Remote Component at "${serverUrl.href}". Make sure the remote URL is correct and contains a Remote Component with shared dependencies.`
232
- );
233
- }
234
- let component;
235
- if (options.rsc) {
236
- const componentRSC = `0:${JSON.stringify(rsc)}
237
- `;
238
- const { createFromReadableStream } = await import("next/dist/compiled/react-server-dom-webpack/client.edge");
239
- component = await createFromReadableStream(
240
- new ReadableStream({
241
- type: "bytes",
242
- start(controller) {
243
- const encoder = new TextEncoder();
244
- controller.enqueue(encoder.encode(componentRSC));
245
- controller.close();
246
- }
247
- }),
248
- {
249
- serverConsumerManifest: {
250
- moduleLoading: {
251
- prefix: serverUrl.origin,
252
- crossOrigin: true
253
- },
254
- moduleMap: {}
255
- }
256
- }
257
- );
258
- }
291
+ const name = remoteName || metadata.name;
292
+ const component = options.rsc ? await buildRscComponent(rsc, serverUrl) : void 0;
259
293
  return {
260
- name: remoteName || metadata.id.replace(/_ssr$/, ""),
294
+ name,
261
295
  serverUrl,
262
296
  metadata,
263
297
  rsc,
@@ -267,7 +301,7 @@ async function fetchRemoteComponent(src, options = {
267
301
  nextData,
268
302
  component,
269
303
  html,
270
- remoteShared: nextData?.props.__REMOTE_COMPONENT__?.shared ?? remoteShared
304
+ remoteShared
271
305
  };
272
306
  }
273
307
  // Annotate the CommonJS export names for ESM import in node:
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/host/server/fetch-remote-component.ts"],"sourcesContent":["import { type DefaultTreeAdapterMap, Parser } from 'parse5';\nimport { visit } from '#internal/host/nextjs/dom-flight';\nimport {\n getSkeletonHtml,\n getSkeletonMessage,\n} from '#internal/host/nextjs/skeleton';\nimport { fetchWithHooks } from '#internal/host/server/fetch-with-hooks';\nimport { getClientSrc } from '#internal/host/server/get-client-src';\nimport { getSSRRelativePathBaseUrl } from '#internal/host/server/get-ssr-relative-path-base-url';\nimport type {\n LinkDescriptor,\n ScriptDescriptor,\n} from '#internal/host/shared/asset-descriptors';\nimport type {\n OnRequestHook,\n OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport type { RemoteComponentMetadata } from '#internal/runtime/metadata';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n RemoteComponentsError,\n} from '#internal/utils/error';\nimport type { FetchRemoteComponentResponse, NextData } from './types';\n\nconst CURRENT_ZONE = process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION;\n\nexport async function fetchRemoteComponent(\n src: string | URL,\n options: {\n name?: string;\n rsc?: boolean;\n /** Whether this is being called from Next.js App Router. Used to enable skeleton fallback during SSG builds. */\n appRouter?: boolean;\n onRequest?: OnRequestHook;\n onResponse?: OnResponseHook;\n } = {\n rsc: false,\n },\n): Promise<FetchRemoteComponentResponse> {\n const ssrRelativePathBaseUrl = getSSRRelativePathBaseUrl();\n const serverUrl = new URL(src, ssrRelativePathBaseUrl);\n\n const tags = [\n '_vc_rc:fetch-remote-component',\n // the max size of a next cache tag is 256 characters\n serverUrl.host.slice(0, 256),\n // use the suffix so this tag is unique if multiple remote\n // components have the same host, but unique pathnames / query params\n (typeof src === 'string' ? src : src.href).slice(-256),\n ];\n if (options.name) {\n tags.push(options.name.slice(-256));\n }\n\n const fetchInit = {\n next: {\n tags,\n },\n };\n\n const res = await fetchWithHooks(serverUrl, fetchInit, {\n onRequest: options.onRequest,\n onResponse: options.onResponse,\n });\n\n // If there is an error in the remote, parse and extract the remote error (except 404 and 401).\n if (!res.ok && !res.body) {\n throw failedToFetchRemoteComponentError(serverUrl.href, res);\n }\n\n if (res.status === 401) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n 'If you are using Deployment Protection, ensure the automation bypass environment variable secret in the host matches an automation bypass value in the remote. See https://remote-components-docs.vercel.sh/docs/concepts/cors-external-urls#deployment-protection for details.',\n );\n }\n\n if (res.status === 404) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n 'Check if you can open it in the browser.',\n );\n }\n\n // create a parser for the HTML response\n const parser = Parser.getFragmentParser<DefaultTreeAdapterMap>();\n\n if (!res.body) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n `Response body is empty. Check if you can open it in the browser and you see the Remote Component content.`,\n );\n }\n\n const decoder = new TextDecoder();\n // read the response body as a stream and parse it using the parse5 fragment parser\n for await (const chunk of res.body as unknown as AsyncIterable<Uint8Array>) {\n parser.tokenizer.write(decoder.decode(chunk), false);\n }\n const fragment = parser.getFragment();\n\n let metadata: RemoteComponentMetadata = {\n bundle: CURRENT_ZONE ?? '__vercel_remote_component',\n route: '/',\n runtime: 'webpack',\n id: '__vercel_remote_component',\n type: 'unknown',\n };\n let remoteShared: Record<string, string> = {};\n const scripts: ScriptDescriptor[] = [];\n const links: LinkDescriptor[] = [];\n const hydrationData: string[] = [];\n let nextData: NextData | undefined;\n let html = '';\n\n const remoteName =\n options.name || (serverUrl.hash ? serverUrl.hash.substring(1) : undefined);\n // convert the parsed HTML fragment into an RSC flight data\n // and extract the metadata, scripts, links and remote component RSC flight data\n let hasRemoteComponent = false;\n let hasRSC = false;\n let hasShared = false;\n let hasMultipleRemoteComponents = false;\n let error: RemoteComponentsError | undefined;\n const rsc = visit(fragment, {\n url: serverUrl,\n name: remoteName,\n onMetadata(_metadata) {\n // Skip multiple component detection for Pages Router (__next) since it only supports one remote component per page\n if (\n hasRemoteComponent &&\n metadata.id !== _metadata.id &&\n _metadata.id !== '__next' &&\n metadata.id !== '__next' &&\n !nextData\n ) {\n hasMultipleRemoteComponents = true;\n }\n metadata = _metadata;\n hasRemoteComponent = true;\n },\n onScript(attrs) {\n const clientSrc = getClientSrc(attrs.src, serverUrl.href);\n if (\n !scripts.find(\n (it) =>\n it.src === clientSrc ||\n (attrs.textContent && it.textContent === attrs.textContent),\n )\n ) {\n scripts.push(\n typeof attrs.textContent === 'string'\n ? {\n src: '',\n textContent: attrs.textContent,\n }\n : {\n src: clientSrc,\n },\n );\n }\n },\n onLink(attrs) {\n const relativeAttrs = {\n ...attrs,\n href: getClientSrc(attrs.href, serverUrl.href),\n };\n if (\n !links.find(\n (it) => it.href === relativeAttrs.href && it.rel === attrs.rel,\n )\n ) {\n links.push(relativeAttrs);\n }\n },\n onRSC(chunk) {\n hydrationData.push(chunk);\n hasRSC = true;\n },\n onNextData(data) {\n nextData = data;\n\n // use the Next.js Pages Router props data to extract remote component metadata\n if (data.props.__REMOTE_COMPONENT__) {\n Object.assign(metadata, data.props.__REMOTE_COMPONENT__);\n // only a singleton remote component is supported per page when using the Next.js Pages Router\n metadata.id = '__next';\n metadata.route = data.page ?? '/';\n }\n },\n onHTML(_html) {\n if (!html.includes(_html)) {\n html += _html;\n }\n },\n onShared(_shared) {\n remoteShared = _shared;\n hasShared = true;\n },\n onError(message, stack) {\n error = new RemoteComponentsError(message);\n if (stack) {\n error.stack = stack;\n }\n },\n });\n\n if (error) {\n throw error;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!hasRemoteComponent) {\n // For microfrontend builds during run time, the host and remote build\n // may be happening concurrently. In this case, the request will 404.\n // We want to allow the build to continue with a placeholder remote\n // component. Once the build completes, vercel will automatically revalidate\n // ISR and fetch the built remote component.\n const isSSGBuild = process.env.NEXT_PHASE === 'phase-production-build';\n // If the remote component is part of a microfrontend, the src provided\n // will be relative.\n const isSSRRelativePathBase =\n serverUrl.host === new URL(ssrRelativePathBaseUrl).host;\n // Only want this skeleton behaviour in previews to unblock development.\n // For production, the remote component should already be built.\n const isPreview = process.env.VERCEL_TARGET_ENV === 'preview';\n\n if (isSSGBuild && isSSRRelativePathBase && isPreview && options.appRouter) {\n const skeletonMessage = getSkeletonMessage();\n const skeletonHtml = getSkeletonHtml(serverUrl.href);\n\n let skeletonComponent: React.ReactNode | undefined;\n if (options.rsc) {\n const { createElement } = await import('react');\n skeletonComponent = createElement('div', {\n dangerouslySetInnerHTML: { __html: skeletonHtml },\n });\n }\n\n return {\n name: 'remote-component-skeleton',\n serverUrl,\n metadata: {\n ...metadata,\n type: 'remote-component',\n },\n rsc: skeletonMessage,\n scripts: [],\n links: [],\n hydrationData: [],\n nextData: undefined,\n component: skeletonComponent,\n html: skeletonHtml,\n remoteShared: {},\n };\n }\n\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n `No Remote Component found. Make sure the remote URL is correct and contains a Remote Component.`,\n );\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (hasMultipleRemoteComponents && !remoteName) {\n throw multipleRemoteComponentsError(serverUrl.href);\n }\n\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n if (!hasRSC && !nextData && metadata.type === 'nextjs') {\n throw new RemoteComponentsError(\n `The Remote Component at \"${serverUrl.href}\" seems to be a Next.js component but it does not contain any RSC flight data or Next.js props data. Make sure the remote URL is correct and contains a Remote Component.`,\n );\n }\n\n if (\n metadata.type === 'nextjs' &&\n // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n !hasShared &&\n !nextData?.props.__REMOTE_COMPONENT__?.shared\n ) {\n throw new RemoteComponentsError(\n `No shared dependencies found for Remote Component at \"${serverUrl.href}\". Make sure the remote URL is correct and contains a Remote Component with shared dependencies.`,\n );\n }\n\n let component: React.ReactNode | undefined;\n\n // only create a React component if requested\n if (options.rsc) {\n // RSC flight data for the static HTML in a single RSC line\n const componentRSC = `0:${JSON.stringify(rsc)}\\n`;\n\n const { createFromReadableStream } = await import(\n 'next/dist/compiled/react-server-dom-webpack/client.edge'\n );\n\n // create a React tree from the RSC flight data\n component = await createFromReadableStream(\n new ReadableStream({\n type: 'bytes',\n start(controller) {\n const encoder = new TextEncoder();\n controller.enqueue(encoder.encode(componentRSC));\n controller.close();\n },\n }),\n {\n serverConsumerManifest: {\n moduleLoading: {\n prefix: serverUrl.origin,\n crossOrigin: true,\n },\n moduleMap: {},\n },\n },\n );\n }\n\n return {\n name: remoteName || metadata.id.replace(/_ssr$/, ''),\n serverUrl,\n metadata,\n rsc,\n scripts,\n links,\n hydrationData,\n nextData,\n component,\n html,\n remoteShared: nextData?.props.__REMOTE_COMPONENT__?.shared ?? remoteShared,\n };\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../../src/host/server/fetch-remote-component.ts"],"sourcesContent":["import { type DefaultTreeAdapterMap, Parser } from 'parse5';\nimport { type RSC, visit } from '#internal/host/nextjs/dom-flight';\nimport {\n getSkeletonHtml,\n getSkeletonMessage,\n} from '#internal/host/nextjs/skeleton';\nimport { fetchWithHooks } from '#internal/host/server/fetch-with-hooks';\nimport { getClientSrc } from '#internal/host/server/get-client-src';\nimport { getSSRRelativePathBaseUrl } from '#internal/host/server/get-ssr-relative-path-base-url';\nimport type {\n LinkDescriptor,\n ScriptDescriptor,\n} from '#internal/host/shared/asset-descriptors';\nimport type {\n OnRequestHook,\n OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport {\n buildMetadata,\n type RawMetadataAttrs,\n type RemoteComponentMetadata,\n} from '#internal/runtime/metadata';\nimport { computeScopedName } from '#internal/utils';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n RemoteComponentsError,\n} from '#internal/utils/error';\nimport type { FetchRemoteComponentResponse, NextData } from './types';\n\n/**\n * Converts RSC flight data into a React element tree using the edge streaming\n * runtime. The manifest tells React how to resolve module references back to\n * the remote origin.\n */\nasync function buildRscComponent(\n rsc: RSC | RSC[] | string | null,\n serverUrl: URL,\n): Promise<React.ReactNode> {\n const componentRSC = `0:${JSON.stringify(rsc)}\\n`;\n const { createFromReadableStream } = await import(\n 'next/dist/compiled/react-server-dom-webpack/client.edge'\n );\n return createFromReadableStream(\n new ReadableStream({\n type: 'bytes',\n start(controller) {\n const encoder = new TextEncoder();\n controller.enqueue(encoder.encode(componentRSC));\n controller.close();\n },\n }),\n {\n serverConsumerManifest: {\n moduleLoading: {\n prefix: serverUrl.origin,\n crossOrigin: true,\n },\n moduleMap: {},\n },\n },\n );\n}\n\nfunction buildSkeletonResponse(\n serverUrl: URL,\n metadata: RemoteComponentMetadata,\n skeletonComponent: React.ReactNode | undefined,\n): FetchRemoteComponentResponse {\n return {\n name: 'remote-component-skeleton',\n serverUrl,\n metadata: {\n ...metadata,\n type: 'remote-component',\n },\n rsc: getSkeletonMessage(),\n scripts: [],\n links: [],\n hydrationData: [],\n nextData: undefined,\n component: skeletonComponent,\n html: getSkeletonHtml(serverUrl.href),\n remoteShared: {},\n };\n}\n\n/**\n * Rewrites the bundle identifier in RSC flight data from the plain bundle\n * name to the origin-qualified scoped name. When multiple remotes share the\n * same bundle name (e.g. production and preview of the same app), this\n * makes each one unique so the client can look up the correct RemoteScope\n * by name alone.\n *\n * `[bundle] /path` → `[scopedName] /path`\n * `[bundle] 12345` → `[scopedName] 12345`\n *\n * Only applied for cross-origin remotes — same-origin chunks keep the\n * plain bundle name since there's no ambiguity.\n */\nfunction scopeChunkReferences(\n chunk: string,\n bundle: string,\n scopedName: string,\n): string {\n return chunk.replaceAll(`[${bundle}]`, `[${scopedName}]`);\n}\n\n/**\n * Walks the parsed HTML fragment and extracts all remote component data:\n * metadata, scripts, links, hydration data, Next.js data, shared deps, and HTML.\n */\nfunction visitFragment(\n fragment: DefaultTreeAdapterMap['documentFragment'],\n serverUrl: URL,\n remoteName: string | undefined,\n) {\n const scriptSrcSet = new Set<string>();\n const scriptTextSet = new Set<string>();\n const scripts: ScriptDescriptor[] = [];\n\n const linkKeySet = new Set<string>();\n const links: LinkDescriptor[] = [];\n\n const hydrationData: string[] = [];\n const htmlChunks = new Set<string>();\n\n let metadata: RemoteComponentMetadata | undefined;\n let nextData: NextData | undefined;\n let remoteShared: Record<string, string> = {};\n let hasRSC = false;\n let hasShared = false;\n let error: RemoteComponentsError | undefined;\n\n // For cross-origin remotes, rewrite bundle identifiers in RSC chunks to\n // the scoped name so the client dispatchers resolve the correct scope.\n // Chunks are collected raw during visit() and rewritten afterwards because\n // RSC script tags appear before the metadata element in the HTML.\n const isCrossOrigin = serverUrl.origin !== getSSRRelativePathBaseUrl();\n\n const rawRscChunks: string[] = [];\n\n const rsc = visit(fragment, {\n url: serverUrl,\n name: remoteName,\n onMetadata(attrs: RawMetadataAttrs) {\n const incoming = buildMetadata(attrs, serverUrl);\n // Skip multiple component detection for Pages Router (__next) since\n // it only supports one remote component per page\n if (\n !remoteName &&\n metadata &&\n metadata.id !== incoming.id &&\n incoming.id !== '__next' &&\n metadata.id !== '__next' &&\n !nextData\n ) {\n throw multipleRemoteComponentsError(serverUrl.href);\n }\n metadata = incoming;\n },\n onScript(attrs) {\n const clientSrc = getClientSrc(attrs.src, serverUrl.href);\n const textContent =\n typeof attrs.textContent === 'string' ? attrs.textContent : undefined;\n\n if (textContent) {\n if (!scriptTextSet.has(textContent)) {\n scriptTextSet.add(textContent);\n scripts.push({ src: '', textContent });\n }\n } else if (!scriptSrcSet.has(clientSrc)) {\n scriptSrcSet.add(clientSrc);\n scripts.push({ src: clientSrc });\n }\n },\n onLink(attrs) {\n const relativeAttrs = {\n ...attrs,\n href: getClientSrc(attrs.href, serverUrl.href),\n };\n const linkKey = `${relativeAttrs.href}::${attrs.rel}`;\n if (!linkKeySet.has(linkKey)) {\n linkKeySet.add(linkKey);\n links.push(relativeAttrs);\n }\n },\n onRSC(chunk) {\n rawRscChunks.push(chunk);\n hasRSC = true;\n },\n onNextData(data) {\n nextData = data;\n },\n onHTML(chunk) {\n if (!htmlChunks.has(chunk)) {\n htmlChunks.add(chunk);\n }\n },\n onShared(_shared) {\n remoteShared = _shared;\n hasShared = true;\n },\n onError(message, stack) {\n error = new RemoteComponentsError(message);\n if (stack) {\n error.stack = stack;\n }\n },\n });\n\n // Rewrite bundle identifiers in RSC chunk references to use the scoped name\n // so the client dispatchers can resolve the correct scope with a direct lookup.\n // This must happen after visit() because RSC script tags appear before the\n // metadata element in the HTML.\n if (isCrossOrigin && metadata?.bundle) {\n const scopedName = computeScopedName(metadata.bundle, {\n remoteHost: serverUrl.host,\n isCrossOrigin: true,\n });\n for (const chunk of rawRscChunks) {\n hydrationData.push(\n scopeChunkReferences(chunk, metadata.bundle, scopedName),\n );\n }\n } else {\n hydrationData.push(...rawRscChunks);\n }\n\n if (error) {\n throw error;\n }\n\n if (metadata) {\n if (!hasRSC && !nextData && metadata.type === 'nextjs') {\n throw new RemoteComponentsError(\n `The Remote Component at \"${serverUrl.href}\" seems to be a Next.js component but it does not contain any RSC flight data or Next.js props data. Make sure the remote URL is correct and contains a Remote Component.`,\n );\n }\n\n if (\n metadata.type === 'nextjs' &&\n !hasShared &&\n !nextData?.props.__REMOTE_COMPONENT__?.shared\n ) {\n throw new RemoteComponentsError(\n `No shared dependencies found for Remote Component at \"${serverUrl.href}\". Make sure the remote URL is correct and contains a Remote Component with shared dependencies.`,\n );\n }\n }\n\n const resolvedShared =\n nextData?.props.__REMOTE_COMPONENT__?.shared ?? remoteShared;\n\n return {\n rsc,\n metadata,\n scripts,\n links,\n hydrationData,\n nextData,\n remoteShared: resolvedShared,\n html: Array.from(htmlChunks).join(''),\n };\n}\n\nexport async function fetchRemoteComponent(\n src: string | URL,\n options: {\n name?: string;\n rsc?: boolean;\n /** Whether this is being called from Next.js App Router. Used to enable skeleton fallback during SSG builds. */\n appRouter?: boolean;\n onRequest?: OnRequestHook;\n onResponse?: OnResponseHook;\n } = {},\n): Promise<FetchRemoteComponentResponse> {\n const ssrRelativePathBaseUrl = getSSRRelativePathBaseUrl();\n const serverUrl = new URL(src, ssrRelativePathBaseUrl);\n\n const tags = [\n '_vc_rc:fetch-remote-component',\n // the max size of a next cache tag is 256 characters\n serverUrl.host.slice(0, 256),\n // use the suffix so this tag is unique if multiple remote\n // components have the same host, but unique pathnames / query params\n (typeof src === 'string' ? src : src.href).slice(-256),\n ];\n if (options.name) {\n tags.push(options.name.slice(-256));\n }\n\n const fetchInit = {\n next: {\n tags,\n },\n };\n\n const res = await fetchWithHooks(serverUrl, fetchInit, {\n onRequest: options.onRequest,\n onResponse: options.onResponse,\n });\n\n // If there is an error in the remote, parse and extract the remote error (except 404 and 401).\n if (!res.ok && !res.body) {\n throw failedToFetchRemoteComponentError(serverUrl.href, res);\n }\n\n if (res.status === 401) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n 'If you are using Deployment Protection, ensure the automation bypass environment variable secret in the host matches an automation bypass value in the remote. See https://remote-components-docs.vercel.sh/docs/concepts/cors-external-urls#deployment-protection for details.',\n );\n }\n\n if (res.status === 404) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n 'Check if you can open it in the browser.',\n );\n }\n\n // create a parser for the HTML response\n const parser = Parser.getFragmentParser<DefaultTreeAdapterMap>();\n\n if (!res.body) {\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n `Response body is empty. Check if you can open it in the browser and you see the Remote Component content.`,\n );\n }\n\n const decoder = new TextDecoder();\n // read the response body as a stream and parse it using the parse5 fragment parser\n for await (const chunk of res.body as unknown as AsyncIterable<Uint8Array>) {\n parser.tokenizer.write(decoder.decode(chunk), false);\n }\n const fragment = parser.getFragment();\n\n const remoteName =\n options.name || (serverUrl.hash ? serverUrl.hash.substring(1) : undefined);\n\n const {\n rsc,\n metadata,\n scripts,\n links,\n hydrationData,\n nextData,\n remoteShared,\n html,\n } = visitFragment(fragment, serverUrl, remoteName);\n\n if (!metadata) {\n // For microfrontend builds during run time, the host and remote build\n // may be happening concurrently. In this case, the request will 404.\n // We want to allow the build to continue with a placeholder remote\n // component. Once the build completes, vercel will automatically revalidate\n // ISR and fetch the built remote component.\n const isSSGBuild = process.env.NEXT_PHASE === 'phase-production-build';\n // If the remote component is part of a microfrontend, the src provided\n // will be relative.\n const isSSRRelativePathBase =\n serverUrl.host === new URL(ssrRelativePathBaseUrl).host;\n // Only want this skeleton behaviour in previews to unblock development.\n // For production, the remote component should already be built.\n const isPreview = process.env.VERCEL_TARGET_ENV === 'preview';\n\n if (isSSGBuild && isSSRRelativePathBase && isPreview && options.appRouter) {\n let skeletonComponent: React.ReactNode | undefined;\n if (options.rsc) {\n const { createElement } = await import('react');\n skeletonComponent = createElement('div', {\n dangerouslySetInnerHTML: {\n __html: getSkeletonHtml(serverUrl.href),\n },\n });\n }\n\n return buildSkeletonResponse(\n serverUrl,\n buildMetadata({}, serverUrl),\n skeletonComponent,\n );\n }\n\n throw failedToFetchRemoteComponentError(\n serverUrl.href,\n res,\n `No Remote Component found. Make sure the remote URL is correct and contains a Remote Component.`,\n );\n }\n\n const name = remoteName || metadata.name;\n const component = options.rsc\n ? await buildRscComponent(rsc, serverUrl)\n : undefined;\n\n return {\n name,\n serverUrl,\n metadata,\n rsc,\n scripts,\n links,\n hydrationData,\n nextData,\n component,\n html,\n remoteShared,\n };\n}\n"],"mappings":"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","names":[]}