@typestyles/build-runner 0.2.0 → 0.5.0

package/dist/index.cjs

@@ -20,12 +20,505 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
-  runTypestylesBuild: () => runTypestylesBuild
+  DEFAULT_EXTRACT_MODULE_CANDIDATES: () => DEFAULT_EXTRACT_MODULE_CANDIDATES,
+  TYPESTYLES_IMPORT_RE: () => TYPESTYLES_IMPORT_RE,
+  VerifyTypestylesBuildError: () => VerifyTypestylesBuildError,
+  buildManifestV2: () => buildManifestV2,
+  collectAndWriteRouteCss: () => collectAndWriteRouteCss,
+  createModuleLoader: () => createModuleLoader,
+  discoverDefaultExtractModules: () => discoverDefaultExtractModules,
+  discoverNextAppRoutes: () => discoverNextAppRoutes,
+  extractNamespaces: () => extractNamespaces,
+  getRouteCss: () => getRouteCss,
+  isManifestV2: () => isManifestV2,
+  normalizeRoutePath: () => normalizeRoutePath,
+  pageRelPathToRoutePath: () => pageRelPathToRoutePath,
+  readCssFile: () => readCssFile,
+  readTypestylesManifest: () => readTypestylesManifest,
+  reportDuplicateNamespaces: () => reportDuplicateNamespaces,
+  resolveExtractMode: () => resolveExtractMode,
+  resolveExtractModules: () => resolveExtractModules,
+  runTypestylesBuild: () => runTypestylesBuild,
+  traceTypestylesModules: () => traceTypestylesModules,
+  verifyTypestylesBuild: () => verifyTypestylesBuild
 });
 module.exports = __toCommonJS(index_exports);
-var import_esbuild = require("esbuild");
+
+// src/discover.ts
 var import_node_fs = require("fs");
 var import_node_path = require("path");
+var DEFAULT_EXTRACT_MODULE_BASES = [
+  "src/typestyles-entry",
+  "src/typestyles",
+  "src/styles/index",
+  "src/styles",
+  "styles/typestyles-entry",
+  "styles/typestyles"
+];
+var DISCOVERY_EXTENSIONS = [".ts", ".tsx", ".js", ".mjs"];
+var DEFAULT_EXTRACT_MODULE_CANDIDATES = DEFAULT_EXTRACT_MODULE_BASES.map(
+  (base) => `${base}.ts`
+);
+function discoverDefaultExtractModules(root) {
+  const absRoot = (0, import_node_path.resolve)(root);
+  for (const base of DEFAULT_EXTRACT_MODULE_BASES) {
+    for (const ext of DISCOVERY_EXTENSIONS) {
+      const rel = `${base}${ext}`;
+      if ((0, import_node_fs.existsSync)((0, import_node_path.resolve)(absRoot, rel))) {
+        return [rel.replace(/\\/g, "/")];
+      }
+    }
+  }
+  return [];
+}
+
+// src/namespaces.ts
+var STYLES_COMPONENT_RE = /styles\.component\(\s*['"]([^'"]+)['"]/g;
+var STYLES_CLASS_RE = /styles\.class\(\s*['"]([^'"]+)['"]/g;
+var TOKENS_CREATE_RE = /tokens\.create\(\s*['"]([^'"]+)['"]/g;
+var CREATE_THEME_RE = /(?:tokens\.)?createTheme\(\s*['"]([^'"]+)['"]/g;
+var KEYFRAMES_CREATE_RE = /keyframes\.create\(\s*['"]([^'"]+)['"]/g;
+var GLOBAL_STYLE_RE = /global\.style\(\s*['"]([^'"]+)['"]/g;
+var GLOBAL_FONT_FACE_RE = /global\.fontFace\(\s*['"]([^'"]+)['"]/g;
+var TYPESTYLES_IMPORT_RE = /(?:from\s+|import\s+|require\s*\(\s*)['"]typestyles['"]/;
+function extractNamespaces(code) {
+  const keys = [];
+  const prefixes = [];
+  for (const match of code.matchAll(STYLES_COMPONENT_RE)) {
+    prefixes.push(`.${match[1]}-`);
+  }
+  for (const match of code.matchAll(STYLES_CLASS_RE)) {
+    prefixes.push(`.${match[1]}-`);
+  }
+  for (const match of code.matchAll(TOKENS_CREATE_RE)) {
+    keys.push(`tokens:${match[1]}`);
+  }
+  for (const match of code.matchAll(CREATE_THEME_RE)) {
+    keys.push(`theme:${match[1]}`);
+  }
+  for (const match of code.matchAll(KEYFRAMES_CREATE_RE)) {
+    keys.push(`keyframes:${match[1]}`);
+  }
+  for (const match of code.matchAll(GLOBAL_STYLE_RE)) {
+    prefixes.push(match[1]);
+  }
+  for (const match of code.matchAll(GLOBAL_FONT_FACE_RE)) {
+    prefixes.push(`font-face:${match[1]}`);
+  }
+  return { keys, prefixes };
+}
+function reportDuplicateNamespaces(moduleNamespaces, id, prefixes, reporter) {
+  for (const [otherId, other] of moduleNamespaces) {
+    if (otherId === id) continue;
+    for (const prefix of prefixes) {
+      if (other.prefixes.includes(prefix)) {
+        const ns = prefix.slice(1, -1);
+        reporter.error(
+          `[typestyles] Style namespace "${ns}" is also used in ${otherId}. Duplicate namespaces cause class name collisions. Use a distinct name or isolate with createStyles({ scopeId: fileScopeId(import.meta) }).`
+        );
+      }
+    }
+  }
+}
+
+// src/resolve-extract.ts
+function resolveExtractModules(root, extract) {
+  if (extract?.modules !== void 0) {
+    return extract.modules;
+  }
+  return discoverDefaultExtractModules(root);
+}
+function resolveExtractMode(explicitMode, resolvedModules) {
+  return explicitMode ?? (resolvedModules.length > 0 ? "build" : "runtime");
+}
+
+// src/verify.ts
+var import_node_fs2 = require("fs");
+var import_node_path2 = require("path");
+
+// src/manifest.ts
+function isManifestV2(manifest) {
+  return manifest.version === 2;
+}
+function normalizeRoutePath(routePath) {
+  if (!routePath || routePath === "/") return "/";
+  const trimmed = routePath.replace(/\/+$/, "");
+  return trimmed.startsWith("/") ? trimmed : `/${trimmed}`;
+}
+
+// src/verify.ts
+var VerifyTypestylesBuildError = class extends Error {
+  constructor(message, code) {
+    super(`[typestyles:verify] ${message}`);
+    this.name = "VerifyTypestylesBuildError";
+    this.code = code;
+  }
+};
+function fail(message, code) {
+  throw new VerifyTypestylesBuildError(message, code);
+}
+function readManifest(path) {
+  let parsed;
+  try {
+    parsed = JSON.parse((0, import_node_fs2.readFileSync)(path, "utf8"));
+  } catch {
+    fail(`Invalid JSON in ${path}.`, "manifest-invalid-json");
+  }
+  if (typeof parsed !== "object" || parsed === null || !("version" in parsed) || !("css" in parsed)) {
+    fail(`Manifest at ${path} is missing required fields.`, "manifest-invalid-shape");
+  }
+  const version = parsed.version;
+  if (version !== 1 && version !== 2) {
+    fail(`Unsupported manifest version ${String(version)}.`, "manifest-version-unsupported");
+  }
+  const manifest = parsed;
+  if (isManifestV2(manifest) && typeof manifest.routes !== "object") {
+    fail(`Manifest v2 at ${path} is missing routes.`, "manifest-invalid-shape");
+  }
+  return manifest;
+}
+function verifyTypestylesBuild(options) {
+  const {
+    root,
+    cssFile,
+    manifestFile,
+    manifestCssPath,
+    manifestVersion = 1,
+    minBytes,
+    requiredCssSubstrings = [],
+    minRouteEntries
+  } = options;
+  const cssPath = (0, import_node_path2.resolve)(root, cssFile);
+  if (!(0, import_node_fs2.existsSync)(cssPath)) {
+    fail(`Missing ${cssPath} \u2014 run your TypeStyles build step first.`, "css-missing");
+  }
+  const css = (0, import_node_fs2.readFileSync)(cssPath, "utf8");
+  const cssBytes = Buffer.byteLength(css, "utf8");
+  const min = minBytes ?? 1;
+  if (cssBytes < min) {
+    fail(
+      `CSS file unexpectedly small (${cssBytes} bytes, expected at least ${min}).`,
+      "css-too-small"
+    );
+  }
+  for (const substring of requiredCssSubstrings) {
+    if (!css.includes(substring)) {
+      fail(`Expected CSS to contain ${JSON.stringify(substring)}.`, "css-missing-substring");
+    }
+  }
+  const manifestRel = manifestFile === false ? void 0 : manifestFile;
+  if (!manifestRel) {
+    return { cssPath, cssBytes };
+  }
+  const manifestPath = (0, import_node_path2.resolve)(root, manifestRel);
+  if (!(0, import_node_fs2.existsSync)(manifestPath)) {
+    fail(`Missing ${manifestPath}.`, "manifest-missing");
+  }
+  const manifest = readManifest(manifestPath);
+  if (manifest.version !== manifestVersion) {
+    fail(
+      `Expected manifest version ${manifestVersion}, got ${manifest.version}.`,
+      "manifest-version-mismatch"
+    );
+  }
+  const expectedCssPath = manifestCssPath ?? cssFile;
+  if (manifest.css !== expectedCssPath) {
+    fail(
+      `Expected manifest.css ${JSON.stringify(expectedCssPath)}, got ${JSON.stringify(manifest.css)}.`,
+      "manifest-css-mismatch"
+    );
+  }
+  if (isManifestV2(manifest)) {
+    const routeCount = Object.keys(manifest.routes).length;
+    if (minRouteEntries !== void 0 && routeCount < minRouteEntries) {
+      fail(
+        `Expected at least ${minRouteEntries} route CSS entries, got ${routeCount}.`,
+        "manifest-routes-too-few"
+      );
+    }
+    for (const [routePath, entry] of Object.entries(manifest.routes)) {
+      const routeCssPath = (0, import_node_path2.resolve)(root, entry.css);
+      if (!(0, import_node_fs2.existsSync)(routeCssPath)) {
+        fail(`Missing route CSS for ${routePath} at ${routeCssPath}.`, "route-css-missing");
+      }
+      if (Buffer.byteLength((0, import_node_fs2.readFileSync)(routeCssPath, "utf8"), "utf8") < 1) {
+        fail(`Route CSS for ${routePath} is empty.`, "route-css-empty");
+      }
+    }
+  }
+  return {
+    cssPath,
+    cssBytes,
+    manifestPath,
+    manifestVersion: manifest.version
+  };
+}
+
+// src/next-routes.ts
+var import_node_fs3 = require("fs");
+var import_node_path3 = require("path");
+var PAGE_BASENAMES = /* @__PURE__ */ new Set(["page.tsx", "page.ts", "page.jsx", "page.js"]);
+var LAYOUT_BASENAMES = /* @__PURE__ */ new Set(["layout.tsx", "layout.ts", "layout.jsx", "layout.js"]);
+function normalizeRelPath(root, absPath) {
+  return (0, import_node_path3.relative)(root, absPath).replace(/\\/g, "/");
+}
+function isRouteGroupSegment(segment) {
+  return segment.startsWith("(") && segment.endsWith(")");
+}
+function pageRelPathToRoutePath(pageRelPath) {
+  const dir = (0, import_node_path3.dirname)(pageRelPath).replace(/\\/g, "/");
+  if (dir === "." || dir === "") return "/";
+  const segments = dir.split("/").filter((segment) => segment.length > 0 && !isRouteGroupSegment(segment));
+  return segments.length === 0 ? "/" : `/${segments.join("/")}`;
+}
+function walkForPages(appAbs, currentRel, pages) {
+  const currentAbs = (0, import_node_path3.join)(appAbs, currentRel);
+  let entries;
+  try {
+    entries = (0, import_node_fs3.readdirSync)(currentAbs);
+  } catch {
+    return;
+  }
+  for (const entry of entries) {
+    const entryRel = currentRel ? (0, import_node_path3.join)(currentRel, entry) : entry;
+    const entryAbs = (0, import_node_path3.join)(appAbs, entryRel);
+    let stat;
+    try {
+      stat = (0, import_node_fs3.statSync)(entryAbs);
+    } catch {
+      continue;
+    }
+    if (stat.isDirectory()) {
+      walkForPages(appAbs, entryRel, pages);
+      continue;
+    }
+    if (PAGE_BASENAMES.has(entry)) {
+      pages.push(entryRel.replace(/\\/g, "/"));
+    }
+  }
+}
+function collectLayoutChain(appAbs, pageRelPath) {
+  const layouts = [];
+  const segments = (0, import_node_path3.dirname)(pageRelPath).replace(/\\/g, "/").split("/");
+  const chainDirs = [""];
+  for (const segment of segments) {
+    if (!segment || segment === ".") continue;
+    const parent = chainDirs[chainDirs.length - 1];
+    chainDirs.push(parent ? `${parent}/${segment}` : segment);
+  }
+  for (const dir of chainDirs) {
+    const dirAbs = dir ? (0, import_node_path3.join)(appAbs, dir) : appAbs;
+    for (const layoutName of LAYOUT_BASENAMES) {
+      const layoutAbs = (0, import_node_path3.join)(dirAbs, layoutName);
+      if ((0, import_node_fs3.existsSync)(layoutAbs)) {
+        layouts.push((0, import_node_path3.join)(dir, layoutName).replace(/\\/g, "/"));
+        break;
+      }
+    }
+  }
+  return layouts;
+}
+function discoverNextAppRoutes(root, appDir = "app") {
+  const appAbs = (0, import_node_path3.resolve)(root, appDir);
+  if (!(0, import_node_fs3.existsSync)(appAbs)) return [];
+  const pageRelPaths = [];
+  walkForPages(appAbs, "", pageRelPaths);
+  return pageRelPaths.map((pageRelPath) => {
+    const pageFile = normalizeRelPath(root, (0, import_node_path3.join)(appAbs, pageRelPath));
+    const layoutFiles = collectLayoutChain(appAbs, pageRelPath).map(
+      (layoutRel) => normalizeRelPath(root, (0, import_node_path3.join)(appAbs, layoutRel))
+    );
+    return {
+      routePath: pageRelPathToRoutePath(pageRelPath),
+      pageFile,
+      layoutFiles
+    };
+  }).sort((a, b) => a.routePath.localeCompare(b.routePath));
+}
+
+// src/trace-imports.ts
+var import_esbuild = require("esbuild");
+var import_node_fs4 = require("fs");
+var import_node_path4 = require("path");
+var import_node_url = require("url");
+var EXTERNAL_PREFIXES = [
+  "react",
+  "react-dom",
+  "react/",
+  "react-dom/",
+  "next",
+  "next/",
+  "server-only",
+  "client-only",
+  "typestyles",
+  "typestyles/"
+];
+function isExternalBareImport(specifier) {
+  if (specifier.startsWith("node:")) return true;
+  return EXTERNAL_PREFIXES.some(
+    (prefix) => specifier === prefix || specifier.startsWith(`${prefix}/`)
+  );
+}
+function isExternalAssetPath(path, importer, namespace) {
+  if (path.endsWith(".css")) return true;
+  const fromCss = namespace === "css" || importer.endsWith(".css");
+  if (fromCss && path.startsWith("/") && !path.startsWith("//")) {
+    return true;
+  }
+  return false;
+}
+function fileImportsTypestyles(absPath) {
+  if (!(0, import_node_fs4.existsSync)(absPath)) return false;
+  try {
+    return TYPESTYLES_IMPORT_RE.test((0, import_node_fs4.readFileSync)(absPath, "utf8"));
+  } catch {
+    return false;
+  }
+}
+async function traceTypestylesModules(root, entryFiles) {
+  const absEntries = entryFiles.map((file) => (0, import_node_path4.resolve)(root, file));
+  const missing = absEntries.filter((file) => !(0, import_node_fs4.existsSync)(file));
+  if (missing.length > 0) {
+    throw new Error(
+      `[typestyles] Cannot trace imports; missing entry file(s): ${missing.join(", ")}`
+    );
+  }
+  const tsconfigPath = (0, import_node_path4.join)(root, "tsconfig.json");
+  const result = await (0, import_esbuild.build)({
+    entryPoints: absEntries,
+    bundle: true,
+    write: false,
+    outdir: root,
+    metafile: true,
+    platform: "neutral",
+    format: "esm",
+    logLevel: "silent",
+    absWorkingDir: root,
+    ...(0, import_node_fs4.existsSync)(tsconfigPath) ? { tsconfig: tsconfigPath } : {},
+    plugins: [
+      {
+        name: "typestyles-trace-imports",
+        setup(build) {
+          build.onResolve({ filter: /.*/ }, (args) => {
+            if (isExternalAssetPath(args.path, args.importer, args.namespace)) {
+              return { path: args.path, external: true };
+            }
+            if (args.path.startsWith(".")) {
+              return null;
+            }
+            if (isExternalBareImport(args.path)) {
+              return { path: args.path, external: true };
+            }
+            return null;
+          });
+        }
+      }
+    ]
+  });
+  const inputs = result.metafile?.inputs ?? {};
+  const traced = /* @__PURE__ */ new Set();
+  for (const inputPath of Object.keys(inputs)) {
+    const absPath = (0, import_node_path4.resolve)(root, inputPath);
+    if (!fileImportsTypestyles(absPath)) continue;
+    traced.add(inputPath.replace(/\\/g, "/"));
+  }
+  return [...traced].sort();
+}
+function createModuleLoader(root, modulePath) {
+  const abs = (0, import_node_path4.resolve)(root, modulePath);
+  const href = (0, import_node_url.pathToFileURL)(abs).href;
+  return () => import(href);
+}
+
+// src/route-css.ts
+var import_promises = require("fs/promises");
+var import_node_path5 = require("path");
+function routePathToCssFile(routePath) {
+  if (routePath === "/") return "index.css";
+  const slug = routePath.slice(1).replace(/^\[|\]$/g, "").replace(/[^\w.-]+/g, "-");
+  return `${slug || "route"}.css`;
+}
+function uniqueModules(...groups) {
+  return [...new Set(groups.flat())].sort();
+}
+async function collectAndWriteRouteCss(options) {
+  const {
+    root,
+    sharedModules,
+    appDir = "app",
+    routeCssOutDir = "app/_typestyles/routes",
+    collectCss
+  } = options;
+  const routes = discoverNextAppRoutes(root, appDir);
+  if (routes.length === 0) {
+    return { routes: {} };
+  }
+  const manifestRoutes = {};
+  for (const route of routes) {
+    const entryFiles = uniqueModules(route.layoutFiles, [route.pageFile]);
+    const routeModules = await traceTypestylesModules(root, entryFiles);
+    const modules = uniqueModules(sharedModules, routeModules);
+    const loaders = modules.map((mod) => createModuleLoader(root, mod));
+    const css = await collectCss(loaders);
+    const cssFileName = routePathToCssFile(route.routePath);
+    const cssRel = `${routeCssOutDir.replace(/\\/g, "/")}/${cssFileName}`;
+    const cssAbs = (0, import_node_path5.resolve)(root, cssRel);
+    await (0, import_promises.mkdir)((0, import_node_path5.dirname)(cssAbs), { recursive: true });
+    await (0, import_promises.writeFile)(cssAbs, css, "utf8");
+    manifestRoutes[route.routePath] = { css: cssRel };
+  }
+  return { routes: manifestRoutes };
+}
+function buildManifestV2(cssOutFile, routeEntries) {
+  return {
+    version: 2,
+    css: cssOutFile,
+    routes: routeEntries
+  };
+}
+
+// src/route-css-read.ts
+var import_node_fs5 = require("fs");
+var import_node_path6 = require("path");
+function readTypestylesManifest(root, manifestFile = "app/typestyles.manifest.json") {
+  const manifestPath = (0, import_node_path6.resolve)(root, manifestFile);
+  if (!(0, import_node_fs5.existsSync)(manifestPath)) {
+    throw new Error(`[typestyles] Missing manifest at ${manifestPath}.`);
+  }
+  let parsed;
+  try {
+    parsed = JSON.parse((0, import_node_fs5.readFileSync)(manifestPath, "utf8"));
+  } catch {
+    throw new Error(`[typestyles] Invalid JSON in ${manifestPath}.`);
+  }
+  if (typeof parsed !== "object" || parsed === null || !("version" in parsed) || !("css" in parsed)) {
+    throw new Error(`[typestyles] Manifest at ${manifestPath} is missing required fields.`);
+  }
+  return parsed;
+}
+function readCssFile(root, cssRelPath) {
+  const cssPath = (0, import_node_path6.resolve)(root, cssRelPath);
+  if (!(0, import_node_fs5.existsSync)(cssPath)) {
+    throw new Error(`[typestyles] Missing CSS file at ${cssPath}.`);
+  }
+  return (0, import_node_fs5.readFileSync)(cssPath, "utf8");
+}
+function getRouteCss(routePath, options) {
+  const manifest = readTypestylesManifest(options.root, options.manifestFile);
+  const normalized = normalizeRoutePath(routePath);
+  if (isManifestV2(manifest)) {
+    const routeEntry = manifest.routes[normalized];
+    if (routeEntry) {
+      return readCssFile(options.root, routeEntry.css);
+    }
+  }
+  return readCssFile(options.root, manifest.css);
+}
+
+// src/index.ts
+var import_esbuild2 = require("esbuild");
+var import_node_fs6 = require("fs");
+var import_node_path7 = require("path");
 var import_node_child_process = require("child_process");
 function toImportPath(modulePath) {
   const normalized = modulePath.replace(/\\/g, "/");
@@ -40,7 +533,7 @@ async function runTypestylesBuild({
 }) {
   if (!modules.length) return "";
   const importLines = modules.map((mod) => `import ${JSON.stringify(toImportPath(mod))};`).join("\n");
-  const bundleResult = await (0, import_esbuild.build)({
+  const bundleResult = await (0, import_esbuild2.build)({
     write: false,
     bundle: true,
     platform: "node",
@@ -58,12 +551,12 @@ async function runTypestylesBuild({
   if (!bundledCode) {
     throw new Error("[typestyles] Failed to produce extraction bundle.");
   }
-  const scriptPath = (0, import_node_path.resolve)(root, `.typestyles-extract-${process.pid}.cjs`);
+  const scriptPath = (0, import_node_path7.resolve)(root, `.typestyles-extract-${process.pid}.cjs`);
   const script = `${bundledCode}
 process.stdout.write(require('typestyles').getRegisteredCss());
 `;
   try {
-    (0, import_node_fs.writeFileSync)(scriptPath, script, "utf8");
+    (0, import_node_fs6.writeFileSync)(scriptPath, script, "utf8");
     const result = (0, import_node_child_process.spawnSync)(process.execPath, [scriptPath], {
       cwd: root,
       encoding: "utf8",
@@ -80,9 +573,9 @@ ${result.stderr || result.stdout || "unknown error"}`
     }
     return result.stdout ?? "";
   } finally {
-    if ((0, import_node_fs.existsSync)(scriptPath)) {
+    if ((0, import_node_fs6.existsSync)(scriptPath)) {
       try {
-        (0, import_node_fs.unlinkSync)(scriptPath);
+        (0, import_node_fs6.unlinkSync)(scriptPath);
       } catch {
       }
     }
@@ -90,5 +583,25 @@ ${result.stderr || result.stdout || "unknown error"}`
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  runTypestylesBuild
+  DEFAULT_EXTRACT_MODULE_CANDIDATES,
+  TYPESTYLES_IMPORT_RE,
+  VerifyTypestylesBuildError,
+  buildManifestV2,
+  collectAndWriteRouteCss,
+  createModuleLoader,
+  discoverDefaultExtractModules,
+  discoverNextAppRoutes,
+  extractNamespaces,
+  getRouteCss,
+  isManifestV2,
+  normalizeRoutePath,
+  pageRelPathToRoutePath,
+  readCssFile,
+  readTypestylesManifest,
+  reportDuplicateNamespaces,
+  resolveExtractMode,
+  resolveExtractModules,
+  runTypestylesBuild,
+  traceTypestylesModules,
+  verifyTypestylesBuild
 });