vite-plugin-react-server 1.1.20 → 1.2.0-alpha.1

package/plugin/config/extMap.ts

@@ -1,60 +1,55 @@
-import type { ResolvedUserOptions } from "../types.js";
-import { DEFAULT_CONFIG } from "./defaults.js";
+import { DEFAULT_CONFIG, BASE_PATTERNS } from "./defaults.js";
 
-export const extMap = (
-  {
-    moduleExtension,
-    jsExtension,
-    cssExtension,
-    jsonExtension,
-    htmlExtension,
-    rscExtension,
-  }: Pick<
-    ResolvedUserOptions["autoDiscover"],
-    | "moduleExtension"
-    | "jsExtension"
-    | "cssExtension"
-    | "jsonExtension"
-    | "htmlExtension"
-    | "rscExtension"
-  > = {
-    moduleExtension: DEFAULT_CONFIG.AUTO_DISCOVER.moduleExtension,
-    jsExtension: DEFAULT_CONFIG.AUTO_DISCOVER.jsExtension,
-    cssExtension: DEFAULT_CONFIG.AUTO_DISCOVER.cssExtension,
-    jsonExtension: DEFAULT_CONFIG.AUTO_DISCOVER.jsonExtension,
-    htmlExtension: DEFAULT_CONFIG.AUTO_DISCOVER.htmlExtension,
-    rscExtension: DEFAULT_CONFIG.AUTO_DISCOVER.rscExtension,
+export const jsExtension = ".js";
+
+export const replaceExtension = (id: string, options: {
+  build: {
+    extensionMap: Record<string, string>
   }
-) => {
-  const map = {
-    // should not have just .client as extension
-    ".client": ".client" + jsExtension,
-    // should not have just .server as extension
-    ".server": ".server" + jsExtension,
-    // these transform to js
-    ".jsx": jsExtension,
-    ".ts": jsExtension,
-    ".tsx": jsExtension,
-    ".mjs": jsExtension,
-    ".cjs": jsExtension,
-    ".mts": jsExtension,
-    ".cts": jsExtension,
-    ".css": cssExtension,
-    ".json": jsonExtension,
-    ".html": htmlExtension,
-    ".rsc": rscExtension,
-    // otherwise do nothing
-  };
-  return (id: string) => {
-    const lastDotIndex = id.lastIndexOf(".");
-    if (lastDotIndex === -1) {
-      return id + jsExtension;
-    }
-    let ext = id.slice(lastDotIndex);
-    let withoutExt = id.slice(0, lastDotIndex);
-    if (ext in map) {
-      return withoutExt + map[ext as keyof typeof map];
+}) => {
+  const buildConfig = options.build || DEFAULT_CONFIG.BUILD;
+  const extensionMap = buildConfig.extensionMap || DEFAULT_CONFIG.BUILD.extensionMap;
+
+  // Handle CSS files first - they should never be changed to .js
+  if (id.endsWith('.css')) {
+    return id; // Keep CSS files as .css
+  }
+
+  // Try extension mapping first (custom mappings should take precedence)
+  if (extensionMap) {
+    for (const [pattern, ext] of Object.entries(extensionMap)) {
+      if(pattern.startsWith('.')) {
+        // Simple extension pattern like ".css"
+        const regex = new RegExp('\\' + pattern + (pattern.endsWith('$') ? '' : '$'));
+        if (regex.test(id)) {
+          return id.replace(regex, ext);
+        }
+      } else if (pattern.startsWith('\\.')) {
+        // Regex pattern that starts with \. like "\.css$"
+        const regex = new RegExp(pattern + (pattern.endsWith('$') ? '' : '$'));
+        if (regex.test(id)) {
+          return id.replace(regex, ext);
+        }
+      } else if (pattern.endsWith(":")) {
+        // Pattern with colon
+        const regex = new RegExp((id.startsWith('^') ? '' : '^') + pattern);
+        if(regex.test(id)) {
+          return id.replace(regex, ext);
+        }
+      } else {
+        // Complex regex pattern like BASE_PATTERNS.MODULE
+        const regex = new RegExp(pattern);
+        if (regex.test(id)) {
+          return id.replace(regex, ext);
+        }
+      }
     }
-    return id.replace(moduleExtension, jsExtension);
-  };
+  }
+
+  // Handle standard module extensions as fallback
+  if (new RegExp(BASE_PATTERNS.MODULE).test(id)) {
+    return id.replace(new RegExp(BASE_PATTERNS.MODULE), jsExtension);
+  }
+
+  return id;
 };

package/plugin/config/flightBindings.ts

@@ -0,0 +1,221 @@
+import type { FlightConfig, FlightTarget } from '../types.js';
+
+// Base configuration with default exports
+// most of these are probably wrong, but in the future we might be able to target 
+// other targets than -esm, for example for use in nextjs.
+const baseConfig: FlightConfig = {
+  rsc: {
+    client: {
+      browser: {
+        production: "react-server-dom-esm/client.browser",
+        development: "react-server-dom-esm/client.browser",
+        test: "react-server-dom-esm/client.browser",
+        exports: {
+          createFromFetch: "createFromFetch",
+          createFromReadableStream: "createFromReadableStream",
+          createServerReference: "createServerReference",
+          createTemporaryReferenceSet: "createTemporaryReferenceSet",
+          encodeReply: "encodeReply",
+          registerServerReference: "registerServerReference"
+        }
+      },
+      node: {
+        production: "react-server-dom-esm/client",
+        development: "react-server-dom-esm/client.node",
+        test: "react-server-dom-esm/client.node",
+        exports: {
+          createFromNodeStream: "createFromNodeStream",
+          createServerReference: "createServerReference",
+          registerServerReference: "registerServerReference"
+        }
+      }
+    },
+    server: {
+      production: "react-server-dom-esm/server",
+      development: "react-server-dom-esm/server.node",
+      test: "react-server-dom-esm/server.node",
+      exports: {
+        createTemporaryReferenceSet: "createTemporaryReferenceSet",
+        decodeAction: "decodeAction",
+        decodeFormState: "decodeFormState",
+        decodeReply: "decodeReply",
+        decodeReplyFromBusboy: "decodeReplyFromBusboy",
+        registerClientReference: "registerClientReference",
+        registerServerReference: "registerServerReference",
+        renderToPipeableStream: "renderToPipeableStream",
+        unstable_prerenderToNodeStream: "unstable_prerenderToNodeStream"
+      }
+    }
+  },
+  vendor: {
+    react: "react",
+    reactDOMServer: "react-dom/server"
+  }
+};
+
+// Target-specific configurations
+const targetConfigs: Record<FlightTarget, Partial<FlightConfig>> = {
+  default: {},
+  webpack: {
+    rsc: {
+      client: {
+        browser: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.browser.exports
+        },
+        node: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.node.exports
+        }
+      },
+      server: {
+        production: "react-server-dom-webpack/server",
+        development: "react-server-dom-webpack/server",
+        test: "react-server-dom-webpack/server",
+        exports: baseConfig.rsc.server.exports
+      }
+    }
+  },
+  nextjs: {
+    rsc: {
+      client: {
+        browser: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.browser.exports
+        },
+        node: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.node.exports
+        }
+      },
+      server: {
+        production: "react-server-dom-webpack/server.edge",
+        development: "react-server-dom-webpack/server.edge",
+        test: "react-server-dom-webpack/server.edge",
+        exports: baseConfig.rsc.server.exports
+      }
+    }
+  },
+  'react-server-dom-esm': {
+    rsc: {
+      client: {
+        browser: {
+          production: "react-server-dom-esm/client.browser",
+          development: "react-server-dom-esm/client.browser",
+          test: "react-server-dom-esm/client.browser",
+          exports: baseConfig.rsc.client.browser.exports
+        },
+        node: {
+          production: "react-server-dom-esm/client",
+          development: "react-server-dom-esm/client.node",
+          test: "react-server-dom-esm/client.node",
+          exports: baseConfig.rsc.client.node.exports
+        }
+      },
+      server: {
+        production: "react-server-dom-esm/server",
+        development: "react-server-dom-esm/server.node",
+        test: "react-server-dom-esm/server.node",
+        exports: baseConfig.rsc.server.exports
+      }
+    }
+  },
+  'react-server-dom-webpack': {
+    rsc: {
+      client: {
+        browser: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.browser.exports
+        },
+        node: {
+          production: "react-server-dom-webpack/client",
+          development: "react-server-dom-webpack/client",
+          test: "react-server-dom-webpack/client",
+          exports: baseConfig.rsc.client.node.exports
+        }
+      },
+      server: {
+        production: "react-server-dom-webpack/server",
+        development: "react-server-dom-webpack/server",
+        test: "react-server-dom-webpack/server",
+        exports: baseConfig.rsc.server.exports
+      }
+    }
+  },
+  'react-server-dom-parcel': {
+    rsc: {
+      client: {
+        browser: {
+          production: "react-server-dom-parcel/client",
+          development: "react-server-dom-parcel/client",
+          test: "react-server-dom-parcel/client",
+          exports: baseConfig.rsc.client.browser.exports
+        },
+        node: {
+          production: "react-server-dom-parcel/client",
+          development: "react-server-dom-parcel/client",
+          test: "react-server-dom-parcel/client",
+          exports: baseConfig.rsc.client.node.exports
+        }
+      },
+      server: {
+        production: "react-server-dom-parcel/server",
+        development: "react-server-dom-parcel/server",
+        test: "react-server-dom-parcel/server",
+        exports: baseConfig.rsc.server.exports
+      }
+    }
+  }
+};
+
+export function createFlightBindings(
+  target: FlightTarget = 'default',
+  overrides?: Partial<FlightConfig>
+): FlightConfig {
+  // Merge configurations in order: base -> target -> overrides
+  return {
+    ...baseConfig,
+    ...targetConfigs[target],
+    ...overrides,
+    rsc: {
+      ...baseConfig.rsc,
+      ...targetConfigs[target].rsc,
+      ...overrides?.rsc,
+      client: {
+        browser: {
+          ...baseConfig.rsc.client.browser,
+          ...targetConfigs[target].rsc?.client?.browser,
+          ...overrides?.rsc?.client?.browser
+        },
+        node: {
+          ...baseConfig.rsc.client.node,
+          ...targetConfigs[target].rsc?.client?.node,
+          ...overrides?.rsc?.client?.node
+        }
+      },
+      server: {
+        ...baseConfig.rsc.server,
+        ...targetConfigs[target].rsc?.server,
+        ...overrides?.rsc?.server
+      }
+    },
+    vendor: {
+      ...baseConfig.vendor,
+      ...targetConfigs[target].vendor,
+      ...overrides?.vendor
+    }
+  };
+}
+
+// For backward compatibility
+export const defaultFlightBindings = createFlightBindings('default'); 

package/plugin/config/getCondition.ts

@@ -5,3 +5,9 @@ export const getCondition = <Prefix extends string = "react-">(
     ? (`${prefix}server` as `${Prefix}server`)
     : (`${prefix}client` as `${Prefix}client`);
 };
+
+export const isReactServerCondition = (condition: string = getCondition()) =>
+  condition === "react-server";
+
+export const isReactClientCondition = (condition: string = getCondition()) =>
+  condition === "react-client";

package/plugin/config/index.ts

@@ -1,7 +1,20 @@
+export * from './autoDiscover/index.js';
+export * from './flightBindings.js';
+export * from './interpolatePattern.js';
+export * from './resolveDevServerConfig.js';
+export * from './resolvePages.js';
+export * from './resolveUserConfig.js';
+export * from './createModuleID.js';
 export * from './getCondition.js';
-export * from './getPaths.js';
+export * from './mimeTypes.js';
+export * from './resolveDirectiveMatcher.js';
+export * from './resolvePatternWithValues.js';
 export * from './defaults.js';
-export * from './resolveUserConfig.js';
+export * from './getPaths.js';
+export * from './parsePattern.js';
+export * from './resolveEnv.js';
+export * from './resolveRegExp.js';
+export * from './extMap.js';
+export * from './resolveAllowedDirectives.js';
 export * from './resolveOptions.js';
-export * from './resolvePages.js';
-export * from './autoDiscover/index.js';
+export * from './resolveUrlOption.js';

package/plugin/config/interpolatePattern.ts

@@ -0,0 +1,19 @@
+/**
+ * Interpolates values into a string pattern.
+ * Only replaces exact matches of {key} with their values.
+ *
+ * @example
+ * ```ts
+ * interpolatePattern("*.{ext}", { ext: "js" })     // "*.js"
+ * interpolatePattern("src/*.{ext}", { ext: "js" }) // "src/*.js"
+ * interpolatePattern("*.{ext}", { ext: "js|ts" })  // "*.js|ts"
+ * ```
+ */
+export function interpolatePattern(
+  pattern: string,
+  values: Record<string, string>
+): string {
+  return pattern.replace(/\{(\w+)\}/g, (match, key) => {
+    return values[key] ?? match;
+  });
+}

package/plugin/config/parsePattern.ts

@@ -0,0 +1,81 @@
+/**
+ * Converts a user-friendly pattern string to a RegExp.
+ * Supports:
+ * - Simple patterns like "*.js" -> /\.js$/
+ * - Basic wildcards like "*.{js,ts}" -> /\.(js|ts)$/
+ * - Escaped characters with backslash
+ * - Optional flags at the end like "*.js/i" -> /\.js$/i
+ *
+ * @example
+ * ```ts
+ * // File extensions
+ * parsePattern("*.js").test("file.js")     // true
+ * parsePattern("*.{js,ts}").test("file.ts") // true
+ *
+ * // Directory patterns
+ * parsePattern("src/*.js").test("src/file.js")     // true
+ * parsePattern("src/*.js").test("file.js")         // false
+ *
+ * // Case sensitivity
+ * parsePattern("*.js").test("file.JS")     // false
+ * parsePattern("*.js/i").test("file.JS")   // true
+ * ```
+ */
+export function parsePattern(pattern: string): RegExp {
+  // STEP 1: Extract regex flags from the end of the pattern
+  // 
+  // We need to check if the pattern ends with "/flags" where flags are valid regex flags.
+  // Valid regex flags are: g (global), i (case-insensitive), m (multiline), s (dotAll), u (unicode), y (sticky)
+  //
+  // Examples:
+  // - "*.js/i"    -> patternStr = "*.js", flags = "i"
+  // - "src/*.js"  -> patternStr = "src/*.js", flags = undefined (no flags)
+  // - "*.js/gi"   -> patternStr = "*.js", flags = "gi"
+  //
+  // The regex /^(.+)\/([gimsuy]+)$/ breaks down as:
+  // - ^(.+)       -> Capture everything from start, but at least one character
+  // - \/          -> Match a literal forward slash
+  // - ([gimsuy]+) -> Capture one or more valid regex flags
+  // - $           -> Must be at the end of the string
+  const flagMatch = pattern.match(/^(.+)\/([gimsuy]+)$/);
+  let patternStr: string;
+  let flags: string | undefined;
+  
+  if (flagMatch) {
+    // Pattern has flags: "*.js/i" -> flagMatch[1] = "*.js", flagMatch[2] = "i"
+    patternStr = flagMatch[1];
+    flags = flagMatch[2];
+  } else {
+    // Pattern has no flags: "*.js" -> use the whole pattern
+    patternStr = pattern;
+  }
+
+  // STEP 2: Convert glob-like patterns to regex patterns
+  //
+  // We need to convert user-friendly glob patterns into proper regex patterns:
+  // - "*.js"      -> ".*\.js$"     (any characters, then .js at the end)
+  // - "*.{js,ts}" -> ".*\.(js|ts)$" (any characters, then .js OR .ts at the end)
+  // - "src/*.js"  -> "^src\/.*\.js$" (starts with src/, then any characters, then .js at the end)
+  let regexStr = patternStr
+    // Convert glob brace expansion {a,b} to regex alternation (a|b) FIRST
+    .replace(/\{([^}]+)\}/g, (_match, contents) => {
+      const alternatives = contents.split(',').map((s: string) => s.trim());
+      return `(${alternatives.join('|')})`;
+    })
+    // Escape special regex characters except for ( ) | and /
+    .replace(/[.+?^${}[\]\\]/g, "\\$&")
+    // Convert glob wildcards (*) to regex wildcards (.*)
+    .replace(/\*/g, ".*");
+
+  // STEP 3: Ensure the pattern matches the entire string from start to end
+  // Add ^ at the beginning and $ at the end if not already present
+  if (!regexStr.startsWith('^')) {
+    regexStr = '^' + regexStr;
+  }
+  if (!regexStr.endsWith('$')) {
+    regexStr = regexStr + '$';
+  }
+
+  // STEP 4: Create and return the RegExp object
+  return new RegExp(regexStr, flags);
+} 

package/plugin/config/resolveAllowedDirectives.ts

@@ -0,0 +1,59 @@
+
+
+import type { AllowedDirectiveInput, AllowedDirectives, DirectiveConfig } from "../loader/directives/types.js";
+
+
+/**
+ * Normalizes allowedDirectives to an object map.
+ *
+ * - "server" targets are always functionLevel: true
+ * - "client" targets are always functionLevel: false
+ * - Accepts:
+ *   - Array of strings: ["client", "server", "foo"]
+ *   - Array of tuples: [["myDirective", "client"], ["foo", "server"]]
+ *   - AllowedDirectives object
+ *
+ * Example:
+ *   resolveAllowedDirectives([
+ *     "client",
+ *     ["myDirective", "server"],
+ *     "server"
+ *   ])
+ *   // =>
+ *   {
+ *     client: { functionLevel: false, target: "client" },
+ *     myDirective: { functionLevel: true, target: "server" },
+ *     server: { functionLevel: true, target: "server" }
+ *   }
+ */
+export function resolveAllowedDirectives(
+  input: AllowedDirectiveInput[] | AllowedDirectives | undefined
+): AllowedDirectives {
+  if (!input) return {};
+  if (Array.isArray(input)) {
+    return Object.fromEntries(
+      input.map((entry) => {
+        if (typeof entry === "string") {
+          // Default: known client directives, else server
+          if (entry === "client" || entry === "no-memo") {
+            return [entry, { functionLevel: false, target: "client" } as DirectiveConfig];
+          }
+          return [entry, { functionLevel: true, target: "server" } as DirectiveConfig];
+        }
+        if (Array.isArray(entry) && entry.length === 2) {
+          const [key, target] = entry;
+          return [
+            key,
+            {
+              functionLevel: target === "server",
+              target,
+            } as DirectiveConfig,
+          ];
+        }
+        // fallback for any other object (shouldn't happen)
+        return [String(entry), { functionLevel: true, target: "server" } as DirectiveConfig];
+      })
+    );
+  }
+  return input;
+}

package/plugin/config/resolveDirectiveMatcher.ts

@@ -0,0 +1,57 @@
+import type { RegExpOpt, DeserializedRegExp } from "../types.js";
+import { parsePattern } from "./parsePattern.js";
+
+
+/**
+ * Resolves a pattern to a RegExp or function, handling string, RegExp, and function inputs.
+ * For strings, it creates a new RegExp using user-friendly syntax.
+ * For RegExp objects, it returns them as-is.
+ * For functions, it returns them as-is. Functions are only supported
+ * when this function is called programmatically, not through plugin options.
+ *
+ * @example
+ * ```ts
+ * // String patterns
+ * resolveDirectiveMatcher("*.js").test("file.js")     // true
+ * resolveDirectiveMatcher("*.{js,ts}").test("file.ts") // true
+ *
+ * // RegExp patterns
+ * resolveDirectiveMatcher(/\.js$/).test("file.js")    // true
+ * resolveDirectiveMatcher(/\.js$/i).test("file.JS")   // true
+ *
+ * // Default patterns
+ * resolveDirectiveMatcher(undefined, "*.js").test("file.js")     // true
+ * resolveDirectiveMatcher(undefined, /\.js$/).test("file.js")    // true
+ * ```
+ */
+export function resolveDirectiveMatcher(
+  pattern?: RegExpOpt,
+  defaultPattern: RegExpOpt | ((source: string, moduleId?: string) => boolean) = () => false
+): (source: string, moduleId?: string) => boolean {
+  if (typeof pattern === "function") {
+    return pattern;
+  } else if (pattern instanceof RegExp) {
+    return (source: string, _moduleId?: string) => pattern.test(source);
+  } else if (typeof pattern === "string") {
+    const regex = parsePattern(pattern);
+    return (source: string, _moduleId?: string) => regex.test(source);
+  } else if (
+    typeof pattern === "object" &&
+    pattern != null &&
+    "__isRegExp" in pattern
+  ) {
+    const deserialized = pattern as DeserializedRegExp;
+    const regex = new RegExp(deserialized.source, deserialized.flags);
+    return (source: string, _moduleId?: string) => regex.test(source);
+  } else if (typeof defaultPattern === "function") {
+    return defaultPattern;
+  } else if (defaultPattern instanceof RegExp) {
+    return (source: string, _moduleId?: string) => defaultPattern.test(source);
+  } else if (typeof defaultPattern === "string") {
+    const regex = parsePattern(defaultPattern);
+    return (source: string, _moduleId?: string) => regex.test(source);
+  } else {
+    return () => false;
+  }
+}
+