rwsdk 0.1.15 → 0.1.17

package/dist/vite/miniflarePlugin.mjs

@@ -0,0 +1,135 @@
+import { cloudflare } from "@cloudflare/vite-plugin";
+import { resolve } from "node:path";
+import colors from "picocolors";
+import { readFile } from "node:fs/promises";
+import { getShortName } from "../lib/getShortName.mjs";
+import { pathExists } from "fs-extra";
+const hasEntryAsAncestor = (module, entryFile, seen = new Set()) => {
+    // Prevent infinite recursion
+    if (seen.has(module))
+        return false;
+    seen.add(module);
+    // Check direct importers
+    for (const importer of module.importers) {
+        if (importer.file === entryFile)
+            return true;
+        // Recursively check importers
+        if (hasEntryAsAncestor(importer, entryFile, seen))
+            return true;
+    }
+    return false;
+};
+// Cache for "use client" status results
+const useClientCache = new Map();
+// Function to invalidate cache for a file
+const invalidateUseClientCache = (file) => {
+    useClientCache.delete(file);
+};
+const isUseClientModule = async (ctx, file, seen = new Set()) => {
+    // Prevent infinite recursion
+    if (seen.has(file))
+        return false;
+    seen.add(file);
+    try {
+        // Check cache first
+        if (useClientCache.has(file)) {
+            return useClientCache.get(file);
+        }
+        // Read and check the file
+        const content = (await pathExists(file))
+            ? await readFile(file, "utf-8")
+            : "";
+        const hasUseClient = content.includes("'use client'") || content.includes('"use client"');
+        if (hasUseClient) {
+            useClientCache.set(file, true);
+            return true;
+        }
+        // Get the module from the module graph to find importers
+        const module = ctx.server.moduleGraph.getModuleById(file);
+        if (!module) {
+            useClientCache.set(file, false);
+            return false;
+        }
+        // Check all importers recursively
+        for (const importer of module.importers) {
+            if (await isUseClientModule(ctx, importer.url, seen)) {
+                useClientCache.set(file, true);
+                return true;
+            }
+        }
+        useClientCache.set(file, false);
+        return false;
+    }
+    catch (error) {
+        useClientCache.set(file, false);
+        return false;
+    }
+};
+export const miniflarePlugin = (givenOptions) => [
+    cloudflare(givenOptions),
+    {
+        name: "rwsdk:miniflare-hmr",
+        async hotUpdate(ctx) {
+            const environment = givenOptions.viteEnvironment?.name ?? "worker";
+            const entry = givenOptions.workerEntryPathname;
+            if (!["client", environment].includes(this.environment.name)) {
+                return;
+            }
+            // todo(justinvdm, 12 Dec 2024): Skip client references
+            const modules = Array.from(ctx.server.environments[environment].moduleGraph.getModulesByFile(ctx.file) ?? []);
+            const isWorkerUpdate = ctx.file === entry ||
+                modules.some((module) => hasEntryAsAncestor(module, entry));
+            // The worker doesnt need an update
+            // => Short circuit HMR
+            if (!isWorkerUpdate) {
+                return [];
+            }
+            // The worker needs an update, but this is the client environment
+            // => Notify for HMR update of any css files imported by in worker, that are also in the client module graph
+            // Why: There may have been changes to css classes referenced, which might css modules to change
+            if (this.environment.name === "client") {
+                const cssModules = [];
+                for (const [_, module] of ctx.server.environments[environment]
+                    .moduleGraph.idToModuleMap) {
+                    // todo(justinvdm, 13 Dec 2024): We check+update _all_ css files in worker module graph,
+                    // but it could just be a subset of css files that are actually affected, depending
+                    // on the importers and imports of the changed file. We should be smarter about this.
+                    if (module.file && module.file.endsWith(".css")) {
+                        const clientModules = ctx.server.environments.client.moduleGraph.getModulesByFile(module.file);
+                        if (clientModules) {
+                            cssModules.push(...clientModules.values());
+                        }
+                    }
+                }
+                invalidateUseClientCache(ctx.file);
+                return (await isUseClientModule(ctx, ctx.file))
+                    ? [...ctx.modules, ...cssModules]
+                    : cssModules;
+            }
+            // The worker needs an update, and the hot check is for the worker environment
+            // => Notify for custom RSC-based HMR update, then short circuit HMR
+            if (isWorkerUpdate && this.environment.name === environment) {
+                const shortName = getShortName(ctx.file, ctx.server.config.root);
+                this.environment.logger.info(`${colors.green(`worker update`)} ${colors.dim(shortName)}`, {
+                    clear: true,
+                    timestamp: true,
+                });
+                const m = ctx.server.environments.client.moduleGraph
+                    .getModulesByFile(resolve(givenOptions.rootDir, "src", "app", "style.css"))
+                    ?.values()
+                    .next().value;
+                if (m) {
+                    ctx.server.environments.client.moduleGraph.invalidateModule(m, new Set(), ctx.timestamp, true);
+                }
+                ctx.server.environments.client.hot.send({
+                    type: "custom",
+                    event: "rsc:update",
+                    data: {
+                        file: ctx.file,
+                    },
+                });
+                return [];
+            }
+        },
+    },
+];

package/dist/vite/requestUtils.d.mts

@@ -0,0 +1,6 @@
+import { Miniflare, type RequestInit } from "miniflare";
+import type { IncomingMessage, ServerResponse } from "node:http";
+type MiniflareResponse = Awaited<ReturnType<typeof Miniflare.prototype.dispatchFetch>>;
+export declare const nodeToWebRequest: (req: IncomingMessage) => Request & RequestInit;
+export declare const webToNodeResponse: (webResponse: Response | MiniflareResponse, nodeResponse: ServerResponse) => Promise<void>;
+export {};

package/dist/vite/requestUtils.mjs

@@ -0,0 +1,35 @@
+export const nodeToWebRequest = (req) => {
+    const url = new URL(req.url, `http://${req.headers.host}`);
+    return new Request(url.href, {
+        method: req.method,
+        headers: req.headers,
+        body: req.method !== "GET" && req.method !== "HEAD"
+            ? req
+            : undefined,
+        // @ts-ignore
+        duplex: "half",
+    });
+};
+export const webToNodeResponse = async (webResponse, nodeResponse) => {
+    // Copy status and headers
+    nodeResponse.statusCode = webResponse.status;
+    webResponse.headers.forEach((value, key) => {
+        nodeResponse.setHeader(key, value);
+    });
+    // Stream the response
+    if (webResponse.body) {
+        const reader = webResponse.body.getReader();
+        try {
+            while (true) {
+                const { done, value } = await reader.read();
+                if (done)
+                    break;
+                nodeResponse.write(value);
+            }
+        }
+        finally {
+            reader.releaseLock();
+        }
+    }
+    nodeResponse.end();
+};

package/dist/vite/setupEnvFiles.d.mts

@@ -0,0 +1,4 @@
+export type EnvSetupOptions = {
+    rootDir: string;
+};
+export declare function setupEnvFiles({ rootDir, }: EnvSetupOptions): Promise<void>;

package/dist/vite/setupEnvFiles.mjs

@@ -0,0 +1,31 @@
+import { resolve } from "node:path";
+import { symlink, copyFile } from "node:fs/promises";
+import { pathExists } from "fs-extra";
+export async function setupEnvFiles({ rootDir, }) {
+    const envPath = resolve(rootDir, ".env");
+    const devVarsPath = resolve(rootDir, ".dev.vars");
+    const envExamplePath = resolve(rootDir, ".env.example");
+    const envExists = await pathExists(envPath);
+    const devVarsExists = await pathExists(devVarsPath);
+    const envExampleExists = await pathExists(envExamplePath);
+    // If .env.example exists but .env doesn't, copy from example to .env
+    if (!envExists && !devVarsExists && envExampleExists) {
+        try {
+            await copyFile(envExamplePath, envPath);
+            console.log("Created .env file from .env.example");
+        }
+        catch (error) {
+            console.warn("Failed to copy .env.example to .env:", error);
+        }
+    }
+    // Create symlink from .env to .dev.vars if needed
+    if ((await pathExists(envPath)) && !devVarsExists) {
+        try {
+            await symlink(envPath, devVarsPath);
+            console.log("Created symlink from .env to .dev.vars");
+        }
+        catch (error) {
+            console.warn("Failed to create symlink from .env to .dev.vars:", error);
+        }
+    }
+}

package/dist/vite/ssrBridgePlugin.mjs

@@ -93,22 +93,35 @@ export const ssrBridgePlugin = ({ clientFiles, serverFiles, }) => {
                     process.env.VERBOSE &&
                         log("Fetch module result: id=%s, result=%O", realId, result);
                     const code = "code" in result ? result.code : undefined;
+                    if (realId.endsWith(".css")) {
+                        process.env.VERBOSE &&
+                            log("Not a JS file, returning code: %s", code);
+                        return code ?? "";
+                    }
                     log("Fetched SSR module code length: %d", code?.length || 0);
                     const { imports, dynamicImports } = findSsrImportSpecifiers(realId, code || "", log);
-                    const allSpecifiers = [...new Set([...imports, ...dynamicImports])];
+                    const allSpecifiers = [
+                        ...new Set([...imports, ...dynamicImports]),
+                    ].map((id) => id.startsWith("/@id/") ? id.slice("/@id/".length) : id);
                     const switchCases = allSpecifiers
-                        .map((specifier) => `    case "${specifier}": return import("${VIRTUAL_SSR_PREFIX}${specifier}");`)
+                        .map((specifier) => `    case "${specifier}": void import("${VIRTUAL_SSR_PREFIX}${specifier}");`)
                         .join("\n");
                     const transformedCode = `
 await (async function(__vite_ssr_import__, __vite_ssr_dynamic_import__) {${code}})(
-  (id, ...args) => {ssrImport(id); return __vite_ssr_import__('/@id/${VIRTUAL_SSR_PREFIX}' + id, ...args);},
-  (id, ...args) => {ssrImport(id); return __vite_ssr_dynamic_import__('/@id/${VIRTUAL_SSR_PREFIX}' + id, ...args);}
+  __ssrImport.bind(null, false),
+  __ssrImport.bind(null, true)
 );
 
-function ssrImport(id) {
+function __ssrImport(isDynamic, id, ...args) {
+  id = id.startsWith('/@id/') ? id.slice('/@id/'.length) : id;
+
   switch (id) {
 ${switchCases}
   }
+
+  return isDynamic
+    ? __vite_ssr_dynamic_import__("/@id/${VIRTUAL_SSR_PREFIX}" + id, ...args)
+    : __vite_ssr_import__("/@id/${VIRTUAL_SSR_PREFIX}" + id, ...args);
 }
 `;
                     log("Transformed SSR module code length: %d", transformedCode.length);

package/dist/vite/useClientPlugin.d.mts

@@ -0,0 +1,8 @@
+import { Plugin } from "vite";
+interface TransformResult {
+    code: string;
+    map?: any;
+}
+export declare function transformUseClientCode(code: string, relativeId: string): Promise<TransformResult | undefined>;
+export declare const useClientPlugin: () => Plugin;
+export {};

package/dist/vite/useClientPlugin.mjs

@@ -0,0 +1,295 @@
+import { relative } from "node:path";
+import { Project, Node, SyntaxKind, } from "ts-morph";
+function isJsxFunction(text) {
+    return (text.includes("jsx(") || text.includes("jsxs(") || text.includes("jsxDEV("));
+}
+export async function transformUseClientCode(code, relativeId) {
+    const cleanCode = code.trimStart();
+    if (!cleanCode.startsWith('"use client"') &&
+        !cleanCode.startsWith("'use client'")) {
+        return;
+    }
+    const project = new Project({
+        useInMemoryFileSystem: true,
+        compilerOptions: {
+            sourceMap: true,
+            target: 2, // ES6
+            module: 1, // CommonJS
+            jsx: 2, // React
+        },
+    });
+    const sourceFile = project.createSourceFile("temp.tsx", code);
+    // Add import declaration properly through the AST
+    sourceFile.addImportDeclaration({
+        moduleSpecifier: "rwsdk/worker",
+        namedImports: [{ name: "registerClientReference" }],
+    });
+    const components = new Map();
+    let anonymousDefaultCount = 0;
+    // Pass 1: Collect all component information
+    // Handle function declarations
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.FunctionDeclaration)
+        .forEach((node) => {
+        const name = node.getName() || `DefaultComponent${anonymousDefaultCount++}`;
+        if (!name)
+            return;
+        // Only track if it's a component (has JSX return)
+        if (isJsxFunction(node.getText())) {
+            const ssrName = `${name}SSR`;
+            const isInlineExport = node.hasModifier(SyntaxKind.ExportKeyword);
+            // Check if this function is used in a default export
+            const isDefault = node.hasModifier(SyntaxKind.DefaultKeyword) ||
+                sourceFile
+                    .getDescendantsOfKind(SyntaxKind.ExportAssignment)
+                    .some((exp) => exp.getExpression().getText() === name);
+            components.set(name, {
+                name,
+                ssrName,
+                isDefault,
+                isInlineExport,
+            });
+        }
+    });
+    // Handle arrow functions and anonymous default exports
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.VariableStatement)
+        .forEach((statement) => {
+        const declarations = statement.getDeclarationList().getDeclarations();
+        declarations.forEach((varDecl) => {
+            const arrowFunc = varDecl.getFirstDescendantByKind(SyntaxKind.ArrowFunction);
+            if (!arrowFunc)
+                return;
+            // Only track if it's a component (has JSX return)
+            if (isJsxFunction(arrowFunc.getText())) {
+                const name = varDecl.getName();
+                const isDefault = !!statement.getFirstAncestorByKind(SyntaxKind.ExportAssignment);
+                const isInlineExport = statement.hasModifier(SyntaxKind.ExportKeyword);
+                if (!name &&
+                    (isDefault || statement.getText().includes("export default"))) {
+                    // Handle anonymous default export
+                    const anonName = `DefaultComponent${anonymousDefaultCount++}`;
+                    components.set(anonName, {
+                        name: anonName,
+                        ssrName: anonName,
+                        isDefault: true,
+                        isInlineExport: true,
+                        isAnonymousDefault: true,
+                    });
+                }
+                else if (name) {
+                    components.set(name, {
+                        name,
+                        ssrName: `${name}SSR`,
+                        isDefault,
+                        isInlineExport,
+                    });
+                }
+            }
+        });
+    });
+    // Pass 2: handle exports
+    // Remove use client directives
+    sourceFile.getDescendantsOfKind(SyntaxKind.StringLiteral).forEach((node) => {
+        if (node.getText() === "'use client'" ||
+            node.getText() === '"use client"') {
+            const parentExpr = node.getFirstAncestorByKind(SyntaxKind.ExpressionStatement);
+            if (parentExpr) {
+                parentExpr.remove();
+            }
+        }
+    });
+    // Create lists of nodes to modify before making any changes
+    const functionsToModify = [];
+    const variableStatementsToModify = [];
+    const exportDeclarationsToModify = [];
+    const exportAssignmentsToModify = [];
+    // Collect function declarations to modify
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.FunctionDeclaration)
+        .forEach((node) => {
+        const name = node.getName();
+        if (!name || !components.has(name))
+            return;
+        const component = components.get(name);
+        if (component.isInlineExport) {
+            functionsToModify.push({
+                node,
+                nodeText: node.getText(),
+                component,
+            });
+        }
+    });
+    // Collect variable statements to modify
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.VariableStatement)
+        .forEach((statement) => {
+        if (!statement.hasModifier(SyntaxKind.ExportKeyword))
+            return;
+        const declarations = statement.getDeclarationList().getDeclarations();
+        let hasComponent = false;
+        declarations.forEach((varDecl) => {
+            const name = varDecl.getName();
+            if (name && components.has(name)) {
+                hasComponent = true;
+            }
+        });
+        if (hasComponent) {
+            variableStatementsToModify.push({
+                node: statement,
+                stmtText: statement.getText(),
+            });
+        }
+    });
+    // Collect export declarations to modify
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.ExportDeclaration)
+        .forEach((node) => {
+        const namedExports = node.getNamedExports();
+        const nonComponentExports = namedExports.filter((exp) => !components.has(exp.getName()));
+        if (nonComponentExports.length !== namedExports.length) {
+            exportDeclarationsToModify.push({
+                node,
+                nonComponentExports,
+            });
+        }
+    });
+    // Collect export assignments to modify
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.ExportAssignment)
+        .forEach((node) => {
+        const expression = node.getExpression();
+        if (Node.isArrowFunction(expression)) {
+            exportAssignmentsToModify.push({
+                node,
+                expression,
+            });
+        }
+        else {
+            exportAssignmentsToModify.push({
+                node,
+                expression: null,
+            });
+        }
+    });
+    // Now apply all modifications in sequence to avoid operating on removed nodes
+    // Modify function declarations
+    functionsToModify.forEach(({ node, nodeText, component }) => {
+        const newText = nodeText.replace(/^export\s+(default\s+)?(async\s+)?function/, "$2function");
+        node.replaceWithText(newText);
+    });
+    // Modify variable statements
+    variableStatementsToModify.forEach(({ node, stmtText }) => {
+        const newText = stmtText.replace(/^export\s+/, "");
+        node.replaceWithText(newText);
+    });
+    // Modify export declarations
+    exportDeclarationsToModify.forEach(({ node, nonComponentExports }) => {
+        if (nonComponentExports.length === 0) {
+            // If all exports were components, remove the declaration
+            node.remove();
+        }
+        else {
+            // If some exports were components, update the export declaration
+            const newExports = nonComponentExports
+                .map((exp) => exp.getText())
+                .join(", ");
+            node.replaceWithText(`export { ${newExports} };`);
+        }
+    });
+    // Handle export assignments with arrow functions
+    exportAssignmentsToModify.forEach(({ node, expression }) => {
+        if (expression && Node.isArrowFunction(expression)) {
+            const anonName = `DefaultComponent${anonymousDefaultCount++}`;
+            const ssrName = `${anonName}SSR`;
+            // First add declarations
+            sourceFile.addStatements(`const ${ssrName} = ${expression.getText()}`);
+            sourceFile.addStatements(`const ${anonName} = registerClientReference("${relativeId}", "default", ${ssrName});`);
+            // Store info for later export
+            components.set(anonName, {
+                name: anonName,
+                ssrName,
+                isDefault: true,
+                isInlineExport: true,
+                isAnonymousDefault: true,
+            });
+        }
+        // Remove the original export default node
+        node.remove();
+    });
+    // Pass 4: rename all identifiers to SSR version - collect first
+    const identifiersToRename = [];
+    components.forEach(({ name, ssrName, isAnonymousDefault }) => {
+        if (isAnonymousDefault)
+            return;
+        // Find function declarations by name
+        const funcDecls = sourceFile.getDescendantsOfKind(SyntaxKind.FunctionDeclaration);
+        const funcNode = funcDecls.find((decl) => decl.getName() === name);
+        if (funcNode) {
+            identifiersToRename.push({ node: funcNode, newName: ssrName });
+            return;
+        }
+        // Find variable declarations by name
+        const varDecls = sourceFile.getDescendantsOfKind(SyntaxKind.VariableDeclaration);
+        const varNode = varDecls.find((decl) => decl.getName() === name);
+        if (varNode) {
+            const identifier = varNode.getFirstChildByKind(SyntaxKind.Identifier);
+            if (identifier) {
+                identifiersToRename.push({ node: identifier, newName: ssrName });
+            }
+        }
+    });
+    // Now apply the renames
+    identifiersToRename.forEach(({ node, newName }) => {
+        node.rename(newName);
+    });
+    // Pass 5: Add client reference registrations
+    // Add all declarations first
+    components.forEach(({ name, ssrName, isDefault, isAnonymousDefault }) => {
+        if (!isAnonymousDefault) {
+            sourceFile.addStatements(`const ${name} = registerClientReference("${relativeId}", "${isDefault ? "default" : name}", ${ssrName});`);
+        }
+    });
+    // Pass 6: add new exports
+    // Then add all exports after declarations
+    components.forEach(({ name, ssrName, isDefault }) => {
+        if (isDefault) {
+            // Export the registerClientReference version as default
+            sourceFile.addStatements(`export { ${name} as default, ${ssrName} };`);
+        }
+        else {
+            sourceFile.addStatements(`export { ${ssrName}, ${name} };`);
+        }
+    });
+    // Clean up any remaining export assignments
+    sourceFile
+        .getDescendantsOfKind(SyntaxKind.ExportAssignment)
+        .forEach((node) => {
+        // If it's not an arrow function (which we handle separately),
+        // just remove the export assignment
+        node.remove();
+    });
+    const emitOutput = sourceFile.getEmitOutput();
+    let sourceMap;
+    for (const outputFile of emitOutput.getOutputFiles()) {
+        if (outputFile.getFilePath().endsWith(".js.map")) {
+            sourceMap = JSON.parse(outputFile.getText());
+        }
+    }
+    return {
+        code: sourceFile.getFullText(),
+        map: sourceMap,
+    };
+}
+export const useClientPlugin = () => ({
+    name: "rwsdk:use-client",
+    async transform(code, id) {
+        if (id.includes(".vite/deps") ||
+            id.includes("node_modules") ||
+            this.environment.name !== "worker") {
+            return;
+        }
+        const relativeId = `/${relative(this.environment.getTopLevelConfig().root, id)}`;
+        return transformUseClientCode(code, relativeId);
+    },
+});

package/dist/vite/useClientPlugin.test.d.mts

@@ -0,0 +1 @@
+export {};