@mui/internal-docs-infra 0.3.1-canary.3 → 0.3.1-canary.4

package/esm/pipeline/loadPrecomputedCodeHighlighterClient/generateResolvedExternals.js

@@ -1,5 +1,3 @@
-import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 /**
  * Generates a unique import name based on module path and original name
  */
@@ -14,30 +12,30 @@ function generateUniqueImportName(originalName, modulePath, type, usedNames) {
   // - Named imports from simple test cases (lib1, lib2, etc.): use numbered suffixes
   // - Other cases: try module-based names first
 
-  var wantsNumberedSuffix = type === 'namespace' || modulePath.startsWith('lib') && /^lib\d+$/.test(modulePath);
+  const wantsNumberedSuffix = type === 'namespace' || modulePath.startsWith('lib') && /^lib\d+$/.test(modulePath);
   if (wantsNumberedSuffix) {
     // Use numbered suffixes
-    var attempt = 1;
-    var _uniqueName = "".concat(originalName).concat(attempt);
-    while (usedNames.has(_uniqueName)) {
+    let attempt = 1;
+    let uniqueName = `${originalName}${attempt}`;
+    while (usedNames.has(uniqueName)) {
       attempt += 1;
-      _uniqueName = "".concat(originalName).concat(attempt);
+      uniqueName = `${originalName}${attempt}`;
     }
-    return _uniqueName;
+    return uniqueName;
   }
 
   // For real modules, try module-based names first
-  var moduleKey = modulePath.replace(/[@/.-]/g, '') // Remove special characters
+  const moduleKey = modulePath.replace(/[@/.-]/g, '') // Remove special characters
   .toLowerCase().slice(0, 20); // Limit length
 
-  var uniqueName = "".concat(originalName).concat(moduleKey);
+  let uniqueName = `${originalName}${moduleKey}`;
 
   // If that's still taken, try numbered suffixes
   if (usedNames.has(uniqueName)) {
-    var _attempt = 1;
+    let attempt = 1;
     do {
-      uniqueName = "".concat(originalName).concat(_attempt);
-      _attempt += 1;
+      uniqueName = `${originalName}${attempt}`;
+      attempt += 1;
     } while (usedNames.has(uniqueName));
   }
   return uniqueName;
@@ -56,131 +54,106 @@ function isValidIdentifier(str) {
  * Returns the import statements and the externals as a JavaScript object
  */
 export function generateResolvedExternals(externals) {
-  var moduleImports = {};
-  var usedNames = new Set();
-  var seenImports = new Set();
+  const moduleImports = {};
+  const usedNames = new Set();
+  const seenImports = new Set();
 
   // First pass: collect all imports and resolve naming conflicts
-  for (var _i = 0, _Object$entries = Object.entries(externals); _i < _Object$entries.length; _i++) {
-    var _Object$entries$_i = _slicedToArray(_Object$entries[_i], 2),
-      modulePath = _Object$entries$_i[0],
-      importItems = _Object$entries$_i[1];
+  for (const [modulePath, importItems] of Object.entries(externals)) {
     if (!moduleImports[modulePath]) {
       moduleImports[modulePath] = {
         named: [],
         namespace: []
       };
     }
-    var _iterator = _createForOfIteratorHelper(importItems),
-      _step;
-    try {
-      for (_iterator.s(); !(_step = _iterator.n()).done;) {
-        var _step$value = _step.value,
-          originalName = _step$value.name,
-          type = _step$value.type,
-          isType = _step$value.isType;
-        // Skip type-only imports and empty names
-        if (isType || !originalName.trim()) {
-          continue;
-        }
-        var importKey = "".concat(modulePath, ":").concat(originalName, ":").concat(type);
-
-        // Skip duplicates
-        if (seenImports.has(importKey)) {
-          continue;
-        }
-        seenImports.add(importKey);
-        var uniqueName = generateUniqueImportName(originalName, modulePath, type, usedNames);
-        usedNames.add(uniqueName);
-        if (type === 'default') {
-          moduleImports[modulePath]["default"] = uniqueName;
-        } else if (type === 'named') {
-          moduleImports[modulePath].named.push({
-            original: originalName,
-            unique: uniqueName
-          });
-        } else if (type === 'namespace') {
-          moduleImports[modulePath].namespace.push(uniqueName);
-        }
+    for (const {
+      name: originalName,
+      type,
+      isType
+    } of importItems) {
+      // Skip type-only imports and empty names
+      if (isType || !originalName.trim()) {
+        continue;
+      }
+      const importKey = `${modulePath}:${originalName}:${type}`;
+
+      // Skip duplicates
+      if (seenImports.has(importKey)) {
+        continue;
+      }
+      seenImports.add(importKey);
+      const uniqueName = generateUniqueImportName(originalName, modulePath, type, usedNames);
+      usedNames.add(uniqueName);
+      if (type === 'default') {
+        moduleImports[modulePath].default = uniqueName;
+      } else if (type === 'named') {
+        moduleImports[modulePath].named.push({
+          original: originalName,
+          unique: uniqueName
+        });
+      } else if (type === 'namespace') {
+        moduleImports[modulePath].namespace.push(uniqueName);
       }
-    } catch (err) {
-      _iterator.e(err);
-    } finally {
-      _iterator.f();
     }
   }
 
   // Second pass: generate consolidated import statements and resolved externals
-  var imports = [];
-  var resolvedExternalsObject = {};
-  for (var _i2 = 0, _Object$entries2 = Object.entries(moduleImports); _i2 < _Object$entries2.length; _i2++) {
-    var _Object$entries2$_i = _slicedToArray(_Object$entries2[_i2], 2),
-      _modulePath = _Object$entries2$_i[0],
-      moduleImport = _Object$entries2$_i[1];
-    var hasDefault = moduleImport["default"] !== undefined;
-    var hasNamed = moduleImport.named.length > 0;
-    var hasNamespace = moduleImport.namespace.length > 0;
+  const imports = [];
+  const resolvedExternalsObject = {};
+  for (const [modulePath, moduleImport] of Object.entries(moduleImports)) {
+    const hasDefault = moduleImport.default !== undefined;
+    const hasNamed = moduleImport.named.length > 0;
+    const hasNamespace = moduleImport.namespace.length > 0;
 
     // Skip modules that have no valid imports
     if (!hasDefault && !hasNamed && !hasNamespace) {
       continue;
     }
-    var importParts = [];
+    const importParts = [];
 
     // Add default import
-    if (moduleImport["default"]) {
-      importParts.push(moduleImport["default"]);
+    if (moduleImport.default) {
+      importParts.push(moduleImport.default);
     }
 
     // Add named imports (consolidated into one statement)
     if (moduleImport.named.length > 0) {
-      var namedImports = moduleImport.named.map(function (_ref) {
-        var original = _ref.original,
-          unique = _ref.unique;
-        return original === unique ? original : "".concat(original, " as ").concat(unique);
-      }).join(', ');
-      importParts.push("{ ".concat(namedImports, " }"));
+      const namedImports = moduleImport.named.map(({
+        original,
+        unique
+      }) => original === unique ? original : `${original} as ${unique}`).join(', ');
+      importParts.push(`{ ${namedImports} }`);
     }
 
     // Generate import statement
     if (importParts.length > 0) {
-      imports.push("import ".concat(importParts.join(', '), " from '").concat(_modulePath, "';"));
+      imports.push(`import ${importParts.join(', ')} from '${modulePath}';`);
     }
 
     // Add namespace imports (separate statements as they can't be combined)
-    var _iterator2 = _createForOfIteratorHelper(moduleImport.namespace),
-      _step2;
-    try {
-      for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-        var namespaceName = _step2.value;
-        imports.push("import * as ".concat(namespaceName, " from '").concat(_modulePath, "';"));
-      }
-
-      // Generate resolved externals entry for this module
-      // For invalid JavaScript identifiers, use the quoted version as the key
-    } catch (err) {
-      _iterator2.e(err);
-    } finally {
-      _iterator2.f();
+    for (const namespaceName of moduleImport.namespace) {
+      imports.push(`import * as ${namespaceName} from '${modulePath}';`);
     }
-    var objectKey = isValidIdentifier(_modulePath) ? _modulePath : "\"".concat(_modulePath, "\"");
-    var resolvedValue = void 0;
+
+    // Generate resolved externals entry for this module
+    // For invalid JavaScript identifiers, use the quoted version as the key
+    const objectKey = isValidIdentifier(modulePath) ? modulePath : `"${modulePath}"`;
+    let resolvedValue;
     if (hasDefault && !hasNamed && !hasNamespace) {
       // Single default export - use direct assignment (e.g., 'react': React)
-      resolvedValue = moduleImport["default"];
+      resolvedValue = moduleImport.default;
     } else if (!hasDefault && hasNamed && !hasNamespace) {
       // Named exports only - use object syntax (e.g., '@mui/material': { Button, TextField })
-      var namedExports = moduleImport.named.map(function (_ref2) {
-        var original = _ref2.original;
-        return original;
-      }).join(', ');
-      resolvedValue = "{ ".concat(namedExports, " }");
+      const namedExports = moduleImport.named.map(({
+        original
+      }) => original).join(', ');
+      resolvedValue = `{ ${namedExports} }`;
     } else if (!hasDefault && !hasNamed && hasNamespace) {
       // Single namespace export - use direct assignment (e.g., 'lodash': lodash)
       resolvedValue = moduleImport.namespace[0];
     } else if (hasDefault) {
       // Mixed imports - prefer default for the resolved externals
-      resolvedValue = moduleImport["default"];
+      resolvedValue = moduleImport.default;
     } else if (hasNamespace) {
       // Mixed imports - use namespace if no default
       resolvedValue = moduleImport.namespace[0];
@@ -192,7 +165,7 @@ export function generateResolvedExternals(externals) {
     resolvedExternalsObject[objectKey] = resolvedValue;
   }
   return {
-    imports: imports,
+    imports,
     resolvedExternals: resolvedExternalsObject
   };
 }

package/esm/pipeline/loadPrecomputedCodeHighlighterClient/injectImportsIntoSource.js

@@ -6,16 +6,16 @@ export function injectImportsIntoSource(source, importLines) {
   if (importLines.length === 0) {
     return source;
   }
-  var importString = "".concat(importLines.join('\n'), "\n\n");
+  const importString = `${importLines.join('\n')}\n\n`;
 
   // Check if file starts with 'use client'
-  var useClientMatch = source.match(/^['"]use client['"]\s*;\s*\n/);
+  const useClientMatch = source.match(/^['"]use client['"]\s*;\s*\n/);
   if (useClientMatch) {
     // Insert after 'use client' directive
-    var afterUseClient = useClientMatch[0];
-    return "".concat(afterUseClient).concat(importString).concat(source.slice(afterUseClient.length));
+    const afterUseClient = useClientMatch[0];
+    return `${afterUseClient}${importString}${source.slice(afterUseClient.length)}`;
   }
 
   // Insert at the beginning
-  return "".concat(importString).concat(source);
+  return `${importString}${source}`;
 }

package/esm/pipeline/loadPrecomputedCodeHighlighterClient/loadPrecomputedCodeHighlighterClient.js

@@ -1,7 +1,3 @@
-import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
-import _regenerator from "@babel/runtime/helpers/esm/regenerator";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 // webpack does not like node: imports
 // eslint-disable-next-line n/prefer-node-protocol
 import { readFile } from 'fs/promises';
@@ -30,214 +26,168 @@ import { replacePrecomputeValue } from "../loadPrecomputedCodeHighlighter/replac
  *
  * Automatically skips processing if skipPrecompute: true is set.
  */
-export function loadPrecomputedCodeHighlighterClient(_x) {
-  return _loadPrecomputedCodeHighlighterClient.apply(this, arguments);
-}
+export async function loadPrecomputedCodeHighlighterClient(source) {
+  const callback = this.async();
+  this.cacheable();
+  try {
+    // Convert the filesystem path to a file:// URL for cross-platform compatibility
+    // pathToFileURL handles Windows drive letters correctly (e.g., C:\... → file:///C:/...)
+    const resourceFileUrl = pathToFileURL(this.resourcePath).toString();
 
-// Default export for webpack loader
-function _loadPrecomputedCodeHighlighterClient() {
-  _loadPrecomputedCodeHighlighterClient = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(source) {
-    var _this = this;
-    var callback, resourceFileUrl, demoCall, allDependencies, allExternalsArray, clientDir, indexPath, indexFileUrl, indexDemoCall, indexSource, resolvedVariantMap, loadSource, variantPromises, variantResults, _iterator, _step, result, allExternals, runtimeExternals, _generateResolvedExte, importLines, resolvedExternals, precomputeData, modifiedSource, _t2, _t3;
-    return _regenerator().w(function (_context2) {
-      while (1) switch (_context2.p = _context2.n) {
-        case 0:
-          callback = this.async();
-          this.cacheable();
-          _context2.p = 1;
-          // Convert the filesystem path to a file:// URL for cross-platform compatibility
-          // pathToFileURL handles Windows drive letters correctly (e.g., C:\... → file:///C:/...)
-          resourceFileUrl = pathToFileURL(this.resourcePath).toString(); // Parse the source to find a single createDemoClient call
-          // Use metadataOnly mode since client calls only have (url, options?) arguments
-          _context2.n = 2;
-          return parseCreateFactoryCall(source, resourceFileUrl, {
-            metadataOnly: true
-          });
-        case 2:
-          demoCall = _context2.v;
-          if (demoCall) {
-            _context2.n = 3;
-            break;
-          }
-          callback(null, source);
-          return _context2.a(2);
-        case 3:
-          if (demoCall.functionName.includes('Client')) {
-            _context2.n = 4;
-            break;
-          }
-          callback(null, source);
-          return _context2.a(2);
-        case 4:
-          if (!demoCall.options.skipPrecompute) {
-            _context2.n = 5;
-            break;
-          }
-          callback(null, source);
-          return _context2.a(2);
-        case 5:
-          // Load variant data for all variants to collect externals
-          allDependencies = [];
-          allExternalsArray = []; // For client files, we need to read the corresponding index.ts to get variants
-          // The client.ts and index.ts should be in the same directory
-          clientDir = path.dirname(this.resourcePath);
-          indexPath = path.join(clientDir, 'index.ts'); // Convert to file:// URL for parseCreateFactoryCall
-          indexFileUrl = pathToFileURL(indexPath).toString(); // Read and parse the index.ts file to get variant information
-          indexDemoCall = null;
-          _context2.p = 6;
-          _context2.n = 7;
-          return readFile(indexPath, 'utf-8');
-        case 7:
-          indexSource = _context2.v;
-          // Add index.ts as a dependency for hot reloading
-          this.addDependency(indexPath);
-          _context2.n = 8;
-          return parseCreateFactoryCall(indexSource, indexFileUrl);
-        case 8:
-          indexDemoCall = _context2.v;
-          _context2.n = 10;
-          break;
-        case 9:
-          _context2.p = 9;
-          _t2 = _context2.v;
-          // If we can't read index.ts, we can't determine variants
-          console.warn("Could not read ".concat(indexPath, " to determine variants for client: ").concat(_t2));
-          callback(null, source);
-          return _context2.a(2);
-        case 10:
-          if (!(!indexDemoCall || !indexDemoCall.variants)) {
-            _context2.n = 11;
-            break;
-          }
-          console.warn("No createDemo call or variants found in ".concat(indexPath, " for client processing"));
-          callback(null, source);
-          return _context2.a(2);
-        case 11:
-          _context2.n = 12;
-          return resolveVariantPathsWithFs(indexDemoCall.variants);
-        case 12:
-          resolvedVariantMap = _context2.v;
-          // Create loader functions
-          loadSource = createLoadServerSource({
-            includeDependencies: true,
-            storeAt: 'flat' // TODO: choose whichever is most performant as it shouldn't affect the output
-          }); // Process variants in parallel to collect externals
-          variantPromises = Array.from(resolvedVariantMap.entries()).map(/*#__PURE__*/function () {
-            var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(_ref) {
-              var _indexDemoCall$namedE;
-              var _ref3, variantName, fileUrl, namedExport, variant, _getFileNameFromUrl, fileName, _yield$loadCodeVarian, dependencies, externals, _t;
-              return _regenerator().w(function (_context) {
-                while (1) switch (_context.p = _context.n) {
-                  case 0:
-                    _ref3 = _slicedToArray(_ref, 2), variantName = _ref3[0], fileUrl = _ref3[1];
-                    namedExport = (_indexDemoCall$namedE = indexDemoCall.namedExports) == null ? void 0 : _indexDemoCall$namedE[variantName];
-                    variant = fileUrl;
-                    if (!namedExport) {
-                      _context.n = 2;
-                      break;
-                    }
-                    _getFileNameFromUrl = getFileNameFromUrl(variant), fileName = _getFileNameFromUrl.fileName;
-                    if (fileName) {
-                      _context.n = 1;
-                      break;
-                    }
-                    throw new Error("Cannot determine fileName from URL \"".concat(variant, "\" for variant \"").concat(variantName, "\". ") + "Please ensure the URL has a valid file extension.");
-                  case 1:
-                    variant = {
-                      url: fileUrl,
-                      fileName: fileName,
-                      namedExport: namedExport
-                    };
-                  case 2:
-                    _context.p = 2;
-                    _context.n = 3;
-                    return loadCodeVariant(fileUrl,
-                    // URL for the variant entry point (already includes file://)
-                    variantName, variant, {
-                      loadSource: loadSource,
-                      // For loading source files and dependencies
-                      maxDepth: 5,
-                      disableParsing: true,
-                      disableTransforms: true
-                    });
-                  case 3:
-                    _yield$loadCodeVarian = _context.v;
-                    dependencies = _yield$loadCodeVarian.dependencies;
-                    externals = _yield$loadCodeVarian.externals;
-                    return _context.a(2, {
-                      variantName: variantName,
-                      dependencies: dependencies,
-                      // All files that were loaded
-                      externals: externals // Combined externals from all loaded files
-                    });
-                  case 4:
-                    _context.p = 4;
-                    _t = _context.v;
-                    throw new Error("Failed to load variant ".concat(variantName, " from ").concat(fileUrl, ": ").concat(_t));
-                  case 5:
-                    return _context.a(2);
-                }
-              }, _callee, null, [[2, 4]]);
-            }));
-            return function (_x2) {
-              return _ref2.apply(this, arguments);
-            };
-          }());
-          _context2.n = 13;
-          return Promise.all(variantPromises);
-        case 13:
-          variantResults = _context2.v;
-          // Process results and collect dependencies and externals
-          _iterator = _createForOfIteratorHelper(variantResults);
-          try {
-            for (_iterator.s(); !(_step = _iterator.n()).done;) {
-              result = _step.value;
-              if (result) {
-                result.dependencies.forEach(function (file) {
-                  allDependencies.push(file);
-                });
-                // Collect externals for proper merging
-                allExternalsArray.push(result.externals);
-              }
-            }
-
-            // Properly merge externals from all variants
-          } catch (err) {
-            _iterator.e(err);
-          } finally {
-            _iterator.f();
-          }
-          allExternals = mergeExternals(allExternalsArray); // Filter out type-only imports since they don't exist at runtime
-          runtimeExternals = filterRuntimeExternals(allExternals); // Generate import statements and resolved externals object
-          _generateResolvedExte = generateResolvedExternals(runtimeExternals), importLines = _generateResolvedExte.imports, resolvedExternals = _generateResolvedExte.resolvedExternals; // Add externals argument to the createDemoClient call using replacePrecomputeValue first
-          // (before injecting imports, so the original positions are still valid)
-          // with passPrecomputeAsIs enabled so externals are passed as resolved objects
-          precomputeData = {
-            externals: resolvedExternals
-          };
-          modifiedSource = replacePrecomputeValue(source, precomputeData, demoCall, {
-            passPrecomputeAsIs: true
-          }); // Then inject imports at the top of the file (after 'use client' if present)
-          modifiedSource = injectImportsIntoSource(modifiedSource, importLines);
-
-          // Add all dependencies to webpack's watch list
-          allDependencies.forEach(function (dep) {
-            // Convert file:// URLs to proper file system paths for webpack's dependency tracking
-            // Using fileURLToPath handles Windows drive letters correctly (e.g., file:///C:/... → C:\...)
-            _this.addDependency(dep.startsWith('file://') ? fileURLToPath(dep) : dep);
-          });
-          callback(null, modifiedSource);
-          _context2.n = 15;
-          break;
-        case 14:
-          _context2.p = 14;
-          _t3 = _context2.v;
-          callback(_t3 instanceof Error ? _t3 : new Error(String(_t3)));
-        case 15:
-          return _context2.a(2);
+    // Parse the source to find a single createDemoClient call
+    // Use metadataOnly mode since client calls only have (url, options?) arguments
+    const demoCall = await parseCreateFactoryCall(source, resourceFileUrl, {
+      metadataOnly: true
+    });
+
+    // If no createDemoClient call found, return the source unchanged
+    if (!demoCall) {
+      callback(null, source);
+      return;
+    }
+
+    // Only process client factory calls (functions with "Client" in the name)
+    if (!demoCall.functionName.includes('Client')) {
+      callback(null, source);
+      return;
+    }
+
+    // If skipPrecompute is true, return the source unchanged
+    if (demoCall.options.skipPrecompute) {
+      callback(null, source);
+      return;
+    }
+
+    // Load variant data for all variants to collect externals
+    const allDependencies = [];
+    const allExternalsArray = [];
+
+    // For client files, we need to read the corresponding index.ts to get variants
+    // The client.ts and index.ts should be in the same directory
+    const clientDir = path.dirname(this.resourcePath);
+    const indexPath = path.join(clientDir, 'index.ts');
+    // Convert to file:// URL for parseCreateFactoryCall
+    const indexFileUrl = pathToFileURL(indexPath).toString();
+
+    // Read and parse the index.ts file to get variant information
+    let indexDemoCall = null;
+    try {
+      const indexSource = await readFile(indexPath, 'utf-8');
+
+      // Add index.ts as a dependency for hot reloading
+      this.addDependency(indexPath);
+      indexDemoCall = await parseCreateFactoryCall(indexSource, indexFileUrl);
+    } catch (error) {
+      // If we can't read index.ts, we can't determine variants
+      console.warn(`Could not read ${indexPath} to determine variants for client: ${error}`);
+      callback(null, source);
+      return;
+    }
+    if (!indexDemoCall || !indexDemoCall.variants) {
+      console.warn(`No createDemo call or variants found in ${indexPath} for client processing`);
+      callback(null, source);
+      return;
+    }
+
+    // Use variants from the index.ts file
+    const resolvedVariantMap = await resolveVariantPathsWithFs(indexDemoCall.variants);
+
+    // Create loader functions
+    const loadSource = createLoadServerSource({
+      includeDependencies: true,
+      storeAt: 'flat' // TODO: choose whichever is most performant as it shouldn't affect the output
+    });
+
+    // Process variants in parallel to collect externals
+    const variantPromises = Array.from(resolvedVariantMap.entries()).map(async ([variantName, fileUrl]) => {
+      const namedExport = indexDemoCall.namedExports?.[variantName];
+      let variant = fileUrl;
+      if (namedExport) {
+        const {
+          fileName
+        } = getFileNameFromUrl(variant);
+        if (!fileName) {
+          throw new Error(`Cannot determine fileName from URL "${variant}" for variant "${variantName}". ` + `Please ensure the URL has a valid file extension.`);
+        }
+        variant = {
+          url: fileUrl,
+          fileName,
+          namedExport
+        };
       }
-    }, _callee2, this, [[6, 9], [1, 14]]);
-  }));
-  return _loadPrecomputedCodeHighlighterClient.apply(this, arguments);
+      try {
+        // Use loadCodeVariant to collect all dependencies and externals
+        const {
+          dependencies,
+          externals
+        } = await loadCodeVariant(fileUrl,
+        // URL for the variant entry point (already includes file://)
+        variantName, variant, {
+          loadSource,
+          // For loading source files and dependencies
+          maxDepth: 5,
+          disableParsing: true,
+          disableTransforms: true
+        });
+        return {
+          variantName,
+          dependencies,
+          // All files that were loaded
+          externals // Combined externals from all loaded files
+        };
+      } catch (error) {
+        throw new Error(`Failed to load variant ${variantName} from ${fileUrl}: ${error}`);
+      }
+    });
+    const variantResults = await Promise.all(variantPromises);
+
+    // Process results and collect dependencies and externals
+    for (const result of variantResults) {
+      if (result) {
+        result.dependencies.forEach(file => {
+          allDependencies.push(file);
+        });
+        // Collect externals for proper merging
+        allExternalsArray.push(result.externals);
+      }
+    }
+
+    // Properly merge externals from all variants
+    const allExternals = mergeExternals(allExternalsArray);
+
+    // Filter out type-only imports since they don't exist at runtime
+    const runtimeExternals = filterRuntimeExternals(allExternals);
+
+    // Generate import statements and resolved externals object
+    const {
+      imports: importLines,
+      resolvedExternals
+    } = generateResolvedExternals(runtimeExternals);
+
+    // Add externals argument to the createDemoClient call using replacePrecomputeValue first
+    // (before injecting imports, so the original positions are still valid)
+    // with passPrecomputeAsIs enabled so externals are passed as resolved objects
+    const precomputeData = {
+      externals: resolvedExternals
+    };
+    let modifiedSource = replacePrecomputeValue(source, precomputeData, demoCall, {
+      passPrecomputeAsIs: true
+    });
+
+    // Then inject imports at the top of the file (after 'use client' if present)
+    modifiedSource = injectImportsIntoSource(modifiedSource, importLines);
+
+    // Add all dependencies to webpack's watch list
+    allDependencies.forEach(dep => {
+      // Convert file:// URLs to proper file system paths for webpack's dependency tracking
+      // Using fileURLToPath handles Windows drive letters correctly (e.g., file:///C:/... → C:\...)
+      this.addDependency(dep.startsWith('file://') ? fileURLToPath(dep) : dep);
+    });
+    callback(null, modifiedSource);
+  } catch (error) {
+    callback(error instanceof Error ? error : new Error(String(error)));
+  }
 }
+
+// Default export for webpack loader
 export default loadPrecomputedCodeHighlighterClient;