remote-components 0.0.41 → 0.0.42

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 (33) hide show
  1. package/dist/html/host.cjs +429 -312
  2. package/dist/html/host.cjs.map +1 -1
  3. package/dist/html/host.js +429 -312
  4. package/dist/html/host.js.map +1 -1
  5. package/dist/html/remote.cjs.map +1 -1
  6. package/dist/html/remote.js.map +1 -1
  7. package/dist/internal/shared/client/remote-component.cjs +404 -304
  8. package/dist/internal/shared/client/remote-component.cjs.map +1 -1
  9. package/dist/internal/shared/client/remote-component.d.ts +10 -1
  10. package/dist/internal/shared/client/remote-component.js +404 -304
  11. package/dist/internal/shared/client/remote-component.js.map +1 -1
  12. package/dist/internal/shared/error.cjs +4 -4
  13. package/dist/internal/shared/error.cjs.map +1 -1
  14. package/dist/internal/shared/error.d.ts +5 -2
  15. package/dist/internal/shared/error.js +4 -4
  16. package/dist/internal/shared/error.js.map +1 -1
  17. package/dist/internal/shared/ssr/fetch-remote-component.cjs +22 -7
  18. package/dist/internal/shared/ssr/fetch-remote-component.cjs.map +1 -1
  19. package/dist/internal/shared/ssr/fetch-remote-component.js +22 -7
  20. package/dist/internal/shared/ssr/fetch-remote-component.js.map +1 -1
  21. package/dist/internal/webpack/shared-modules.cjs +36 -1
  22. package/dist/internal/webpack/shared-modules.cjs.map +1 -1
  23. package/dist/internal/webpack/shared-modules.js +36 -1
  24. package/dist/internal/webpack/shared-modules.js.map +1 -1
  25. package/dist/next/host/client/index.cjs +412 -311
  26. package/dist/next/host/client/index.cjs.map +1 -1
  27. package/dist/next/host/client/index.js +412 -311
  28. package/dist/next/host/client/index.js.map +1 -1
  29. package/dist/react/index.cjs +4 -3
  30. package/dist/react/index.cjs.map +1 -1
  31. package/dist/react/index.js +4 -3
  32. package/dist/react/index.js.map +1 -1
  33. package/package.json +4 -6
@@ -63,6 +63,18 @@ var JSXRuntime = __toESM(require("react/jsx-runtime"), 1);
63
63
  var ReactDOM = __toESM(require("react-dom"), 1);
64
64
  var ReactDOMClient = __toESM(require("react-dom/client"), 1);
65
65
 
66
+ // src/shared/utils/logger.ts
67
+ var PREFIX = "remote-components";
68
+ var DEBUG = typeof window !== "undefined" && localStorage.getItem("RC_DEBUG") === "true";
69
+ function logDebug(location2, message) {
70
+ if (DEBUG) {
71
+ console.debug(`[${PREFIX}:${location2}]: ${message}`);
72
+ }
73
+ }
74
+ function logWarn(location2, message) {
75
+ console.warn(`[${PREFIX}:${location2}]: ${message}`);
76
+ }
77
+
66
78
  // src/shared/webpack/next-client-pages-loader.ts
67
79
  function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
68
80
  const self = globalThis;
@@ -177,28 +189,62 @@ function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
177
189
 
178
190
  // src/shared/webpack/shared-modules.ts
179
191
  function applySharedModules(bundle, resolve) {
192
+ logDebug(
193
+ "SharedModules",
194
+ `applySharedModules called for bundle: "${bundle}"`
195
+ );
196
+ logDebug(
197
+ "SharedModules",
198
+ `Shared modules to resolve: ${Object.keys(resolve)}`
199
+ );
180
200
  const self = globalThis;
181
201
  if (self.__remote_webpack_require__?.[bundle]) {
182
202
  const modulePaths = Object.keys(
183
203
  self.__remote_webpack_module_map__?.[bundle] ?? self.__remote_webpack_require__[bundle].m ?? {}
184
204
  );
205
+ logDebug(
206
+ "SharedModules",
207
+ `Available module paths in __remote_webpack_require__[${bundle}]: ${modulePaths}`
208
+ );
185
209
  for (const [key, value] of Object.entries(resolve)) {
186
210
  let ids = modulePaths.filter((p) => p === key);
187
211
  if (ids.length === 0) {
188
212
  ids = modulePaths.filter((p) => p.includes(key));
189
213
  }
214
+ if (ids.length === 0) {
215
+ logDebug(
216
+ "SharedModules",
217
+ `No matching module path found for shared module "${key}"`
218
+ );
219
+ }
190
220
  for (let id of ids) {
191
221
  const webpackBundle = self.__remote_webpack_require__[bundle];
192
222
  if (webpackBundle.m) {
193
223
  if (self.__remote_webpack_module_map__?.[bundle]?.[id]) {
194
- id = `${self.__remote_webpack_module_map__[bundle][id]}`;
224
+ const mappedId = `${self.__remote_webpack_module_map__[bundle][id]}`;
225
+ logDebug(
226
+ "SharedModules",
227
+ `Mapped module id: "${id}" -> "${mappedId}"`
228
+ );
229
+ id = mappedId;
195
230
  }
196
231
  webpackBundle.m[id] = (module2) => {
197
232
  module2.exports = value;
198
233
  };
234
+ } else {
235
+ logWarn(
236
+ "SharedModules",
237
+ `webpackBundle.m is not available for bundle "${bundle}"`
238
+ );
199
239
  }
200
240
  }
201
241
  }
242
+ } else {
243
+ logWarn("SharedModules", `No webpack require found for bundle "${bundle}"`);
244
+ logDebug(
245
+ "SharedModules",
246
+ `Available bundles: ${Object.keys(self.__remote_webpack_require__ ?? {})}`
247
+ );
202
248
  }
203
249
  }
204
250
 
@@ -312,52 +358,7 @@ function getBundleKey(bundle) {
312
358
  return escapeString(bundle);
313
359
  }
314
360
 
315
- // src/shared/client/webpack-adapter.ts
316
- async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location.href), bundle, shared = {}, remoteShared = {}) {
317
- const self = globalThis;
318
- if (!self.__remote_bundle_url__) {
319
- self.__remote_bundle_url__ = {};
320
- }
321
- self.__remote_bundle_url__[bundle ?? "default"] = url;
322
- self.__webpack_get_script_filename__ = () => null;
323
- if (typeof self.__webpack_require__ !== "function" || self.__webpack_require_type__ !== "turbopack") {
324
- if (!self.__original_webpack_require__ && !self.__original_webpack_chunk_load__) {
325
- self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;
326
- self.__original_webpack_require__ = self.__webpack_require__;
327
- }
328
- self.__webpack_chunk_load__ = createChunkLoader(runtime);
329
- self.__webpack_require__ = createModuleRequire(runtime);
330
- self.__webpack_require_type__ = runtime;
331
- if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {
332
- const remoteBundle = bundle ?? "default";
333
- self.__remote_webpack_require__[remoteBundle] = self.__webpack_require__;
334
- self.__remote_webpack_require__[remoteBundle].type = "turbopack";
335
- }
336
- }
337
- if (runtime === RUNTIME_TURBOPACK) {
338
- await Promise.all(
339
- scripts.map((script) => {
340
- if (script.src) {
341
- return self.__webpack_chunk_load__?.(script.src, bundle);
342
- }
343
- return Promise.resolve(void 0);
344
- })
345
- );
346
- }
347
- await initializeSharedModules(
348
- bundle ?? "default",
349
- // include all core modules as shared
350
- {
351
- react: async () => (await import("react")).default,
352
- "react-dom": async () => (await import("react-dom")).default,
353
- "react/jsx-dev-runtime": async () => (await import("react/jsx-dev-runtime")).default,
354
- "react/jsx-runtime": async () => (await import("react/jsx-runtime")).default,
355
- "react-dom/client": async () => (await import("react-dom/client")).default,
356
- ...shared
357
- },
358
- remoteShared
359
- );
360
- }
361
+ // src/shared/client/chunk-loader.ts
361
362
  function createChunkLoader(runtime) {
362
363
  return function __turbopack_chunk_load__(chunkId, scriptBundle) {
363
364
  const self = globalThis;
@@ -472,46 +473,232 @@ async function handleTurbopackChunk(code, bundle, url) {
472
473
  await Promise.all(loadChunkLists);
473
474
  }
474
475
  }
475
- function createModuleRequire(runtime) {
476
- return (id) => {
477
- const self = globalThis;
478
- const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)?.groups ?? {
479
- bundle: "default",
480
- id
481
- };
482
- const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? "default"] ? self.__remote_webpack_require__[bundle ?? "default"]?.type || "webpack" : runtime;
483
- try {
484
- if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {
485
- return self.__remote_webpack_require__?.[bundle]?.(moduleId);
476
+
477
+ // src/shared/client/turbopack-module.ts
478
+ function handleTurbopackModule(bundle, moduleId, id) {
479
+ const self = globalThis;
480
+ const bundleKey = getBundleKey(bundle);
481
+ const modules = self[`TURBOPACK_${bundleKey}`];
482
+ const moduleInit = findModuleInit(modules, moduleId);
483
+ const exports = {};
484
+ const moduleExports = { exports };
485
+ if (!self.__remote_components_turbopack_modules__) {
486
+ self.__remote_components_turbopack_modules__ = {};
487
+ }
488
+ if (!self.__remote_components_turbopack_modules__[bundle]) {
489
+ self.__remote_components_turbopack_modules__[bundle] = {};
490
+ }
491
+ if (self.__remote_components_turbopack_modules__[bundle][moduleId]) {
492
+ return self.__remote_components_turbopack_modules__[bundle][moduleId];
493
+ }
494
+ if (typeof moduleInit !== "function") {
495
+ throw new Error(
496
+ `Module ${id} not found in bundle ${bundle} with id ${moduleId}`
497
+ );
498
+ }
499
+ self.__remote_components_turbopack_modules__[bundle][moduleId] = moduleExports.exports;
500
+ if (!self.__remote_components_turbopack_global__) {
501
+ self.__remote_components_turbopack_global__ = {};
502
+ }
503
+ if (!self.__remote_components_turbopack_global__[bundle]) {
504
+ self.__remote_components_turbopack_global__[bundle] = {};
505
+ }
506
+ const allModules = modules?.flat() ?? [];
507
+ moduleInit(
508
+ createTurbopackContext(
509
+ bundle,
510
+ exports,
511
+ moduleExports,
512
+ allModules,
513
+ moduleInit,
514
+ id,
515
+ self
516
+ ),
517
+ moduleExports,
518
+ exports
519
+ );
520
+ if (self.__remote_components_turbopack_modules__[bundle][moduleId] !== moduleExports.exports) {
521
+ self.__remote_components_turbopack_modules__[bundle][moduleId] = moduleExports.exports;
522
+ }
523
+ return moduleExports.exports;
524
+ }
525
+ function findModuleInit(modules, moduleId) {
526
+ const allModules = modules?.flat() ?? [];
527
+ if (typeof allModules[1] === "string" || typeof allModules[1] === "number") {
528
+ const normalizedId = /^[0-9]+$/.test(moduleId) ? Number(moduleId) : moduleId;
529
+ let moduleIdIndex = allModules.indexOf(normalizedId);
530
+ if (moduleIdIndex === -1) {
531
+ moduleIdIndex = allModules.findIndex(
532
+ (bundleEntry) => typeof bundleEntry === "string" && bundleEntry.startsWith(moduleId) || bundleEntry === normalizedId
533
+ );
534
+ }
535
+ if (moduleIdIndex !== -1) {
536
+ while (typeof allModules[moduleIdIndex] !== "function" && moduleIdIndex < allModules.length) {
537
+ moduleIdIndex++;
486
538
  }
487
- const sharedModule = getSharedModule(bundle ?? "default", moduleId ?? id);
488
- if (sharedModule) {
489
- return sharedModule;
539
+ return allModules[moduleIdIndex];
540
+ }
541
+ } else {
542
+ return allModules.find(
543
+ (bundleEntry) => typeof bundleEntry === "object" && bundleEntry !== null && moduleId in bundleEntry
544
+ )?.[moduleId];
545
+ }
546
+ return void 0;
547
+ }
548
+ function createTurbopackContext(bundle, exports, moduleExports, allModules, moduleInit, id, self) {
549
+ return {
550
+ // HMR not implemented for Remote Components
551
+ k: {
552
+ register() {
553
+ },
554
+ registerExports() {
555
+ },
556
+ signature() {
557
+ return (fn) => fn;
490
558
  }
491
- if (bundle && moduleId) {
492
- return handleTurbopackModule(bundle, moduleId, id);
559
+ },
560
+ // ESM exports setup
561
+ s(bindings, esmId) {
562
+ let mod = exports;
563
+ if (typeof esmId === "string" || typeof esmId === "number") {
564
+ if (!self.__remote_components_turbopack_modules__) {
565
+ self.__remote_components_turbopack_modules__ = {};
566
+ }
567
+ if (!self.__remote_components_turbopack_modules__[bundle]) {
568
+ self.__remote_components_turbopack_modules__[bundle] = {};
569
+ }
570
+ if (!self.__remote_components_turbopack_modules__[bundle][esmId]) {
571
+ self.__remote_components_turbopack_modules__[bundle][esmId] = {};
572
+ }
573
+ mod = self.__remote_components_turbopack_modules__[bundle][esmId];
493
574
  }
494
- throw new Error(`Module "${id}" not found.`);
495
- } catch (requireError) {
496
- if (typeof self.__original_webpack_require__ !== "function") {
497
- throw new RemoteComponentsError(
498
- `Module "${id}" not found in remote component bundle "${bundle}".`,
499
- {
500
- cause: requireError instanceof Error ? requireError : void 0
575
+ Object.defineProperty(mod, "__esModule", { value: true });
576
+ if (Array.isArray(bindings)) {
577
+ let i = 0;
578
+ while (i < bindings.length) {
579
+ const propName = bindings[i++];
580
+ const tagOrFunc = bindings[i++];
581
+ if (typeof tagOrFunc === "number") {
582
+ Object.defineProperty(mod, propName, {
583
+ value: bindings[i++],
584
+ enumerable: true,
585
+ writable: false
586
+ });
587
+ } else {
588
+ const getterFn = tagOrFunc;
589
+ if (typeof bindings[i] === "function") {
590
+ const setterFn = bindings[i++];
591
+ Object.defineProperty(mod, propName, {
592
+ get: getterFn,
593
+ set: setterFn,
594
+ enumerable: true
595
+ });
596
+ } else {
597
+ Object.defineProperty(mod, propName, {
598
+ get: getterFn,
599
+ enumerable: true
600
+ });
601
+ }
501
602
  }
502
- );
603
+ }
503
604
  }
504
- try {
505
- return self.__original_webpack_require__(id);
506
- } catch (originalError) {
507
- throw new RemoteComponentsError(
508
- `Module "${id}" not found in remote component bundle "${bundle}".`,
509
- { cause: originalError instanceof Error ? originalError : void 0 }
605
+ },
606
+ // import
607
+ i(importId) {
608
+ let mod;
609
+ if (typeof importId === "string") {
610
+ const { exportSource, exportName } = /\s+<export (?<exportSource>.*?) as (?<exportName>.*?)>$/.exec(
611
+ importId
612
+ )?.groups ?? {};
613
+ const normalizedId = importId.replace(
614
+ /\s+<export(?<specifier>.*)>$/,
615
+ ""
510
616
  );
617
+ mod = self.__webpack_require__?.(`[${bundle}] ${normalizedId}`);
618
+ if (mod && exportSource && exportName && (exportSource === "*" || typeof mod[exportSource] !== "undefined") && typeof mod[exportName] === "undefined") {
619
+ if (exportSource === "*") {
620
+ mod[exportName] = mod;
621
+ } else {
622
+ mod[exportName] = mod[exportSource];
623
+ }
624
+ }
625
+ } else {
626
+ mod = self.__webpack_require__?.(`[${bundle}] ${importId}`);
511
627
  }
512
- }
628
+ if (typeof mod !== "object" || mod === null) {
629
+ mod = { default: mod };
630
+ } else if (!("default" in mod) && mod.toString() !== "[object Module]") {
631
+ try {
632
+ mod.default = mod;
633
+ } catch {
634
+ }
635
+ }
636
+ return mod;
637
+ },
638
+ // require
639
+ r(requireId) {
640
+ return self.__webpack_require__?.(`[${bundle}] ${requireId}`);
641
+ },
642
+ // value exports
643
+ v(value) {
644
+ if (typeof value === "function") {
645
+ exports.default = value((vid) => {
646
+ return self.__webpack_require__?.(`[${bundle}] ${vid}`);
647
+ });
648
+ } else {
649
+ moduleExports.exports = value;
650
+ }
651
+ },
652
+ // async module initializer
653
+ async a(mod) {
654
+ let result;
655
+ await mod(
656
+ () => {
657
+ },
658
+ (value) => result = value
659
+ );
660
+ exports.default = result;
661
+ },
662
+ // async module loader
663
+ async A(Aid) {
664
+ const mod = self.__webpack_require__?.(`[${bundle}] ${Aid}`);
665
+ return mod.default(
666
+ (parentId) => self.__webpack_require__?.(`[${bundle}] ${parentId}`)
667
+ );
668
+ },
669
+ // chunk loader
670
+ l(url) {
671
+ const moduleInitIndex = allModules.indexOf(moduleInit);
672
+ if (moduleInitIndex !== -1) {
673
+ const scriptIndex = allModules.slice(0, moduleInitIndex).findLastIndex((bundleEntry) => bundleEntry instanceof Element);
674
+ if (scriptIndex !== -1) {
675
+ const script = allModules[scriptIndex];
676
+ const scriptSrc = script.getAttribute("data-turbopack-src") || "";
677
+ const nextIndex = scriptSrc.indexOf("/_next");
678
+ const baseUrl = nextIndex !== -1 ? scriptSrc.slice(0, nextIndex) : "";
679
+ const bundleUrl = `[${bundle}] ${baseUrl}/_next/${url}`;
680
+ return self.__webpack_chunk_load__?.(bundleUrl, bundle);
681
+ }
682
+ }
683
+ throw new Error(
684
+ `Failed to load Turbopack chunk "${url}" for module "${id}". Check the URL is correct.`
685
+ );
686
+ },
687
+ // global object for this bundle
688
+ g: self.__remote_components_turbopack_global__?.[bundle],
689
+ m: moduleExports,
690
+ e: exports
513
691
  };
514
692
  }
693
+
694
+ // src/shared/client/turbopack-patterns.ts
695
+ var REMOTE_SHARED_MARKER_RE = /(?:self|[a-z])\.TURBOPACK_REMOTE_SHARED/;
696
+ var REMOTE_SHARED_ASSIGNMENT_RE = /\.TURBOPACK_REMOTE_SHARED=await (?:__turbopack_context__|e)\.A\((?<sharedModuleId>[0-9]+)\)/;
697
+ var ASYNC_MODULE_LOADER_RE = /(?:__turbopack_context__|e)\.A\((?<asyncSharedModuleId>[0-9]+)\)/;
698
+ var ASYNC_MODULE_RESOLVE_RE = /(?<ctx>__turbopack_context__|e)=>\{\k<ctx>\.v\((?<inner>parentImport|e)=>Promise\.resolve\(\)\.then\(\(\)=>\k<inner>\((?<sharedModuleId>[0-9]+)\)\)\)\}/;
699
+ var ASYNC_MODULE_ALL_RE = /(?<ctx>__turbopack_context__|e)=>\{\k<ctx>\.v\((?<vCb>parentImport|t)=>Promise\.all\(\["[^"]+"\]\.map\((?<mapCb>chunk|t)=>\k<ctx>\.l\(\k<mapCb>\)\)\)\.then\(\(\)=>\k<vCb>\((?<sharedModuleId>[0-9]+)\)\)\)\}/;
700
+
701
+ // src/shared/client/shared-modules.ts
515
702
  async function initializeSharedModules(bundle, hostShared = {}, remoteShared = {}) {
516
703
  const self = globalThis;
517
704
  self.__remote_shared_modules__ = self.__remote_shared_modules__ ?? {};
@@ -528,14 +715,12 @@ async function initializeSharedModules(bundle, hostShared = {}, remoteShared = {
528
715
  return false;
529
716
  }
530
717
  const funcCode = idOrFunc.toString();
531
- return /[a-z]\.TURBOPACK_REMOTE_SHARED/.test(funcCode);
718
+ return REMOTE_SHARED_MARKER_RE.test(funcCode);
532
719
  });
533
720
  if (sharedModuleInitializerIndex > 0) {
534
721
  const sharedModuleInitializerCode = allModules[sharedModuleInitializerIndex].toString();
535
722
  const sharedModuleInitializerId = allModules[sharedModuleInitializerIndex - 1];
536
- const { sharedModuleId } = /\.TURBOPACK_REMOTE_SHARED=await e\.A\((?<sharedModuleId>[0-9]+)\)/.exec(
537
- sharedModuleInitializerCode
538
- )?.groups ?? {};
723
+ const { sharedModuleId } = REMOTE_SHARED_ASSIGNMENT_RE.exec(sharedModuleInitializerCode)?.groups ?? {};
539
724
  if (sharedModuleId) {
540
725
  const { default: sharedModuleInitializerInstance } = handleTurbopackModule(
541
726
  bundle,
@@ -547,33 +732,11 @@ async function initializeSharedModules(bundle, hostShared = {}, remoteShared = {
547
732
  }
548
733
  if (sharedModuleInitializer) {
549
734
  const { shared } = await sharedModuleInitializer;
550
- const sharedModuleIds = Object.entries(shared).filter(([, value]) => typeof value === "function").reduce((acc, [key, value]) => {
551
- const { asyncSharedModuleId } = /e\.A\((?<asyncSharedModuleId>[0-9]+)\)/.exec(value.toString())?.groups ?? {};
552
- if (asyncSharedModuleId) {
553
- const asyncSharedModuleIdNumber = Number(asyncSharedModuleId);
554
- let asyncSharedModule;
555
- const newAllModules = self[`TURBOPACK_${bundleKey}`]?.flat() ?? [];
556
- const asyncSharedModuleIdIndex = newAllModules.indexOf(
557
- asyncSharedModuleIdNumber
558
- );
559
- if (asyncSharedModuleIdIndex !== -1 && typeof newAllModules[asyncSharedModuleIdIndex + 1] === "function") {
560
- asyncSharedModule = newAllModules[asyncSharedModuleIdIndex + 1];
561
- }
562
- if (asyncSharedModule) {
563
- const asyncSharedModuleCode = asyncSharedModule.toString();
564
- const { sharedModuleId } = /e=>{e\.v\(e=>Promise\.resolve\(\)\.then\(\(\)=>e\((?<sharedModuleId>[0-9]+)\)\)\)}/.exec(
565
- asyncSharedModuleCode
566
- )?.groups ?? /e=>{e\.v\(t=>Promise\.all\(\["[^"]+"\].map\(t=>e\.l\(t\)\)\)\.then\(\(\)=>t\((?<sharedModuleId>[0-9]+)\)\)\)}/.exec(
567
- asyncSharedModuleCode
568
- )?.groups ?? {};
569
- acc[sharedModuleId ?? asyncSharedModuleId] = key.replace(
570
- "__remote_shared_module_",
571
- ""
572
- );
573
- }
574
- }
575
- return acc;
576
- }, {});
735
+ const sharedModuleIds = extractSharedModuleIds(
736
+ shared,
737
+ bundleKey,
738
+ self
739
+ );
577
740
  return Promise.all(
578
741
  Object.entries(sharedModuleIds).map(async ([id, module2]) => {
579
742
  if (self.__remote_shared_modules__?.[bundle]) {
@@ -597,6 +760,31 @@ async function initializeSharedModules(bundle, hostShared = {}, remoteShared = {
597
760
  })
598
761
  );
599
762
  }
763
+ function extractSharedModuleIds(shared, bundleKey, self) {
764
+ return Object.entries(shared).filter(([, value]) => typeof value === "function").reduce((acc, [key, value]) => {
765
+ const { asyncSharedModuleId } = ASYNC_MODULE_LOADER_RE.exec(value.toString())?.groups ?? {};
766
+ if (asyncSharedModuleId) {
767
+ const asyncSharedModuleIdNumber = Number(asyncSharedModuleId);
768
+ let asyncSharedModule;
769
+ const newAllModules = self[`TURBOPACK_${bundleKey}`]?.flat() ?? [];
770
+ const asyncSharedModuleIdIndex = newAllModules.indexOf(
771
+ asyncSharedModuleIdNumber
772
+ );
773
+ if (asyncSharedModuleIdIndex !== -1 && typeof newAllModules[asyncSharedModuleIdIndex + 1] === "function") {
774
+ asyncSharedModule = newAllModules[asyncSharedModuleIdIndex + 1];
775
+ }
776
+ if (asyncSharedModule) {
777
+ const asyncSharedModuleCode = asyncSharedModule.toString();
778
+ const { sharedModuleId } = ASYNC_MODULE_RESOLVE_RE.exec(asyncSharedModuleCode)?.groups ?? ASYNC_MODULE_ALL_RE.exec(asyncSharedModuleCode)?.groups ?? {};
779
+ acc[sharedModuleId ?? asyncSharedModuleId] = key.replace(
780
+ "__remote_shared_module_",
781
+ ""
782
+ );
783
+ }
784
+ }
785
+ return acc;
786
+ }, {});
787
+ }
600
788
  function getSharedModule(bundle, id) {
601
789
  const self = globalThis;
602
790
  for (const [key, value] of Object.entries(
@@ -608,210 +796,100 @@ function getSharedModule(bundle, id) {
608
796
  }
609
797
  return null;
610
798
  }
611
- function handleTurbopackModule(bundle, moduleId, id) {
799
+
800
+ // src/shared/client/webpack-adapter.ts
801
+ async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location.href), bundle, shared = {}, remoteShared = {}) {
612
802
  const self = globalThis;
613
- const bundleKey = getBundleKey(bundle);
614
- const modules = self[`TURBOPACK_${bundleKey}`];
615
- let moduleInit;
616
- const allModules = modules?.flat() ?? [];
617
- if (typeof allModules[1] === "string" || typeof allModules[1] === "number") {
618
- const normalizedId = /^[0-9]+$/.test(moduleId) ? Number(moduleId) : moduleId;
619
- let moduleIdIndex = allModules.indexOf(normalizedId);
620
- if (moduleIdIndex === -1) {
621
- moduleIdIndex = allModules.findIndex(
622
- (bundleEntry) => typeof bundleEntry === "string" && bundleEntry.startsWith(moduleId) || bundleEntry === normalizedId
623
- );
803
+ if (!self.__remote_bundle_url__) {
804
+ self.__remote_bundle_url__ = {};
805
+ }
806
+ self.__remote_bundle_url__[bundle ?? "default"] = url;
807
+ self.__webpack_get_script_filename__ = () => null;
808
+ if (typeof self.__webpack_require__ !== "function" || self.__webpack_require_type__ !== "turbopack") {
809
+ if (!self.__original_webpack_require__ && !self.__original_webpack_chunk_load__) {
810
+ self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;
811
+ self.__original_webpack_require__ = self.__webpack_require__;
624
812
  }
625
- if (moduleIdIndex !== -1) {
626
- while (typeof allModules[moduleIdIndex] !== "function" && moduleIdIndex < allModules.length) {
627
- moduleIdIndex++;
628
- }
629
- moduleInit = allModules[moduleIdIndex];
813
+ self.__webpack_chunk_load__ = createChunkLoader(runtime);
814
+ self.__webpack_require__ = createModuleRequire(runtime);
815
+ self.__webpack_require_type__ = runtime;
816
+ if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {
817
+ const remoteBundle = bundle ?? "default";
818
+ self.__remote_webpack_require__[remoteBundle] = self.__webpack_require__;
819
+ self.__remote_webpack_require__[remoteBundle].type = "turbopack";
630
820
  }
631
- } else {
632
- moduleInit = allModules.find(
633
- (bundleEntry) => typeof bundleEntry === "object" && bundleEntry !== null && moduleId in bundleEntry
634
- )?.[moduleId];
635
- }
636
- const exports = {};
637
- const moduleExports = { exports };
638
- if (!self.__remote_components_turbopack_modules__) {
639
- self.__remote_components_turbopack_modules__ = {};
640
- }
641
- if (!self.__remote_components_turbopack_modules__[bundle]) {
642
- self.__remote_components_turbopack_modules__[bundle] = {};
643
821
  }
644
- if (self.__remote_components_turbopack_modules__[bundle][moduleId]) {
645
- return self.__remote_components_turbopack_modules__[bundle][moduleId];
646
- }
647
- if (typeof moduleInit !== "function") {
648
- throw new Error(
649
- `Module ${id} not found in bundle ${bundle} with id ${moduleId}`
822
+ if (runtime === RUNTIME_TURBOPACK) {
823
+ await Promise.all(
824
+ scripts.map((script) => {
825
+ if (script.src) {
826
+ return self.__webpack_chunk_load__?.(script.src, bundle);
827
+ }
828
+ return Promise.resolve(void 0);
829
+ })
650
830
  );
651
831
  }
652
- self.__remote_components_turbopack_modules__[bundle][moduleId] = moduleExports.exports;
653
- if (!self.__remote_components_turbopack_global__) {
654
- self.__remote_components_turbopack_global__ = {};
655
- }
656
- if (!self.__remote_components_turbopack_global__[bundle]) {
657
- self.__remote_components_turbopack_global__[bundle] = {};
658
- }
659
- moduleInit(
660
- {
661
- // HMR not implemented for Remote Components
662
- k: {
663
- register() {
664
- },
665
- registerExports() {
666
- },
667
- signature() {
668
- return (fn) => {
669
- return fn;
670
- };
671
- }
672
- },
673
- // esm
674
- s(bindings, esmId) {
675
- let mod = exports;
676
- if (typeof esmId === "string" || typeof esmId === "number") {
677
- if (!self.__remote_components_turbopack_modules__) {
678
- self.__remote_components_turbopack_modules__ = {};
679
- }
680
- if (!self.__remote_components_turbopack_modules__[bundle]) {
681
- self.__remote_components_turbopack_modules__[bundle] = {};
682
- }
683
- if (!self.__remote_components_turbopack_modules__[bundle][esmId]) {
684
- self.__remote_components_turbopack_modules__[bundle][esmId] = {};
685
- }
686
- mod = self.__remote_components_turbopack_modules__[bundle][esmId];
687
- }
688
- Object.defineProperty(mod, "__esModule", { value: true });
689
- if (Array.isArray(bindings)) {
690
- let i = 0;
691
- while (i < bindings.length) {
692
- const propName = bindings[i++];
693
- const tagOrFunc = bindings[i++];
694
- if (typeof tagOrFunc === "number") {
695
- Object.defineProperty(mod, propName, {
696
- value: bindings[i++],
697
- enumerable: true,
698
- writable: false
699
- });
700
- } else {
701
- const getterFn = tagOrFunc;
702
- if (typeof bindings[i] === "function") {
703
- const setterFn = bindings[i++];
704
- Object.defineProperty(mod, propName, {
705
- get: getterFn,
706
- set: setterFn,
707
- enumerable: true
708
- });
709
- } else {
710
- Object.defineProperty(mod, propName, {
711
- get: getterFn,
712
- enumerable: true
713
- });
714
- }
715
- }
716
- }
717
- }
718
- },
719
- // import
720
- i(importId) {
721
- let mod;
722
- if (typeof importId === "string") {
723
- const { exportSource, exportName } = /\s+<export (?<exportSource>.*?) as (?<exportName>.*?)>$/.exec(
724
- importId
725
- )?.groups ?? {};
726
- const normalizedId = importId.replace(
727
- /\s+<export(?<specifier>.*)>$/,
728
- ""
729
- );
730
- mod = self.__webpack_require__?.(
731
- `[${bundle}] ${normalizedId}`
732
- );
733
- if (exportSource && exportName && (exportSource === "*" || typeof mod[exportSource] !== "undefined") && typeof mod[exportName] === "undefined") {
734
- if (exportSource === "*") {
735
- mod[exportName] = mod;
736
- } else {
737
- mod[exportName] = mod[exportSource];
738
- }
739
- }
740
- } else {
741
- mod = self.__webpack_require__?.(`[${bundle}] ${importId}`);
742
- }
743
- if (typeof mod !== "object") {
744
- mod = { default: mod };
745
- } else if (!("default" in mod) && // eslint-disable-next-line @typescript-eslint/no-base-to-string
746
- mod.toString() !== "[object Module]") {
747
- try {
748
- mod.default = mod;
749
- } catch {
832
+ const coreShared = {
833
+ react: async () => (await import("react")).default,
834
+ "react-dom": async () => (await import("react-dom")).default,
835
+ "react/jsx-dev-runtime": async () => (await import("react/jsx-dev-runtime")).default,
836
+ "react/jsx-runtime": async () => (await import("react/jsx-runtime")).default,
837
+ "react-dom/client": async () => (await import("react-dom/client")).default,
838
+ ...shared
839
+ };
840
+ await initializeSharedModules(
841
+ bundle ?? "default",
842
+ // include all core modules as shared
843
+ coreShared,
844
+ remoteShared
845
+ );
846
+ }
847
+ function createModuleRequire(runtime) {
848
+ return (id) => {
849
+ const self = globalThis;
850
+ const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)?.groups ?? {
851
+ bundle: "default",
852
+ id
853
+ };
854
+ const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? "default"] ? self.__remote_webpack_require__[bundle ?? "default"]?.type || "webpack" : runtime;
855
+ logDebug("WebpackAdapter", `remoteRuntime: "${remoteRuntime}"`);
856
+ try {
857
+ if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {
858
+ return self.__remote_webpack_require__?.[bundle]?.(moduleId);
859
+ }
860
+ const sharedModuleId = moduleId ?? id;
861
+ const sharedModule = getSharedModule(bundle ?? "default", sharedModuleId);
862
+ if (sharedModule) {
863
+ return sharedModule;
864
+ }
865
+ if (bundle && moduleId) {
866
+ return handleTurbopackModule(bundle, moduleId, id);
867
+ }
868
+ throw new Error(`Module "${id}" not found.`);
869
+ } catch (requireError) {
870
+ logWarn(
871
+ "WebpackAdapter",
872
+ `Module require failed: ${String(requireError)}`
873
+ );
874
+ if (typeof self.__original_webpack_require__ !== "function") {
875
+ throw new RemoteComponentsError(
876
+ `Module "${id}" not found in remote component bundle "${bundle}".`,
877
+ {
878
+ cause: requireError instanceof Error ? requireError : void 0
750
879
  }
751
- }
752
- return mod;
753
- },
754
- // require
755
- r(requireId) {
756
- return self.__webpack_require__?.(`[${bundle}] ${requireId}`);
757
- },
758
- // value exports
759
- v(value) {
760
- if (typeof value === "function") {
761
- exports.default = value((vid) => {
762
- return self.__webpack_require__?.(`[${bundle}] ${vid}`);
763
- });
764
- } else {
765
- moduleExports.exports = value;
766
- }
767
- },
768
- // async module initializer
769
- async a(mod) {
770
- let result;
771
- await mod(
772
- () => {
773
- },
774
- (value) => result = value
775
880
  );
776
- exports.default = result;
777
- },
778
- // async module loader
779
- async A(Aid) {
780
- const mod = self.__webpack_require__?.(`[${bundle}] ${Aid}`);
781
- return mod.default(
782
- (parentId) => self.__webpack_require__?.(`[${bundle}] ${parentId}`)
783
- );
784
- },
785
- // chunk loader
786
- l(url) {
787
- const moduleInitIndex = allModules.indexOf(moduleInit);
788
- if (moduleInitIndex !== -1) {
789
- const scriptIndex = allModules.slice(0, moduleInitIndex).findLastIndex((bundleEntry) => bundleEntry instanceof Element);
790
- if (scriptIndex !== -1) {
791
- const script = allModules[scriptIndex];
792
- const scriptSrc = script.getAttribute("data-turbopack-src") || "";
793
- const nextIndex = scriptSrc.indexOf("/_next");
794
- const baseUrl = nextIndex !== -1 ? scriptSrc.slice(0, nextIndex) : "";
795
- const bundleUrl = `[${bundle}] ${baseUrl}/_next/${url}`;
796
- return self.__webpack_chunk_load__?.(bundleUrl, bundle);
797
- }
798
- }
799
- throw new Error(
800
- `Failed to load Turbopack chunk "${url}" for module "${id}". Check the URL is correct.`
881
+ }
882
+ try {
883
+ logDebug("WebpackAdapter", "Falling back to original webpack require");
884
+ return self.__original_webpack_require__(id);
885
+ } catch (originalError) {
886
+ throw new RemoteComponentsError(
887
+ `Module "${id}" not found in remote component bundle "${bundle}".`,
888
+ { cause: originalError instanceof Error ? originalError : void 0 }
801
889
  );
802
- },
803
- // global
804
- g: self.__remote_components_turbopack_global__[bundle],
805
- m: moduleExports,
806
- e: exports
807
- },
808
- moduleExports,
809
- exports
810
- );
811
- if (self.__remote_components_turbopack_modules__[bundle][moduleId] !== moduleExports.exports) {
812
- self.__remote_components_turbopack_modules__[bundle][moduleId] = moduleExports.exports;
813
- }
814
- return moduleExports.exports;
890
+ }
891
+ }
892
+ };
815
893
  }
816
894
 
817
895
  // src/shared/client/component-loader.ts
@@ -839,6 +917,18 @@ async function loadRemoteComponent({
839
917
  await loadScripts(scripts);
840
918
  }
841
919
  const hostShared = await shared;
920
+ logDebug(
921
+ "ComponentLoader",
922
+ `loadRemoteComponent: bundle="${bundle}", name="${name}"`
923
+ );
924
+ logDebug(
925
+ "ComponentLoader",
926
+ `Host shared modules available: ${Object.keys(hostShared)}`
927
+ );
928
+ logDebug(
929
+ "ComponentLoader",
930
+ `Remote shared modules requested: ${JSON.stringify(remoteShared)}`
931
+ );
842
932
  await setupWebpackRuntime(
843
933
  runtime,
844
934
  scripts,
@@ -858,6 +948,11 @@ async function loadRemoteComponent({
858
948
  (acc, [key, value]) => {
859
949
  if (typeof hostShared[value] !== "undefined") {
860
950
  acc[key.replace(/^\(ssr\)\/(?<relative>\.\/)?/, "")] = hostShared[value];
951
+ } else {
952
+ logDebug(
953
+ "ComponentLoader",
954
+ `Remote requests "${value}" but host doesn't provide it`
955
+ );
861
956
  }
862
957
  return acc;
863
958
  },
@@ -873,6 +968,11 @@ async function loadRemoteComponent({
873
968
  })
874
969
  );
875
970
  applySharedModules(bundle, resolve);
971
+ } else {
972
+ logWarn(
973
+ "ComponentLoader",
974
+ "No bundle specified, skipping shared module setup"
975
+ );
876
976
  }
877
977
  if (data.length > 0) {
878
978
  return await loadRSCComponent(rscName ?? name, data);