packageReferences
A module of the server's (as it loads, source) with its imports of the packages' browser components it renders
(keys, by packageRefKey) made Flight client references to them instead (createClientReference from server,
the module flightServerFile writes): their packages aren't loaded on the server for them, and the browser,
which has them, renders them. Declared first, so the module's own top-level code finds them.
import { npmAlias } from "#codebase/tcmts/loader/packages"; export function packageReferences(source: string, keys: string[], server: string): string { const made: string[] = []; let out = source; for (const key of keys) { const at = key.lastIndexOf("#"); const name = key.slice(at + 1); const m = /^(npm:(?:@[^/]+\/)?[^@/]+@[^/]+)(?:\/(.+))?$/.exec(key.slice(0, at)); if (!m) continue; const spec = JSON.stringify(npmAlias(m[1]!) + (m[2] ? `/${m[2]}` : "")); const quoted = spec.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"); const ref = (local: string) => made.push(`const ${local} = __tcm_clientReference(${JSON.stringify(key)}, "c", []);`); out = out.replace( new RegExp(`import\\s*\\{([^}]*)\\}\\s*from\\s*${quoted};?`, "g"), (_all, names: string) => { const kept: string[] = []; for (const part of names .split(",") .map((s) => s.trim()) .filter(Boolean)) { const [exported, local = exported] = part.split(/\s+as\s+/) as [string, string?]; if (exported === name) ref(local!); else kept.push(part); } return kept.length ? `import { ${kept.join(", ")} } from ${spec};` : ""; }, ); if (name === "default") out = out.replace( new RegExp(`import\\s+([\\w$]+)\\s+from\\s*${quoted};?`, "g"), (_all, local: string) => { ref(local); return ""; }, ); } if (!made.length) return source; return [ `import { createClientReference as __tcm_clientReference } from ${JSON.stringify(server)};`, ...made, out, ].join("\n"); }