@csszyx/unplugin 0.6.0 → 0.7.0

package/dist/webpack.cjs

@@ -35,8 +35,8 @@ __export(webpack_exports, {
 module.exports = __toCommonJS(webpack_exports);
 
 // src/unplugin.ts
-var fs = __toESM(require("fs"), 1);
-var path = __toESM(require("path"), 1);
+var fs2 = __toESM(require("fs"), 1);
+var path2 = __toESM(require("path"), 1);
 var import_compiler = require("@csszyx/compiler");
 var import_core = require("@csszyx/core");
 var import_svelte_adapter = require("@csszyx/svelte-adapter");
@@ -200,7 +200,7 @@ function injectHydrationData(html, mangleMap, checksum, options = {}) {
 function transformIndexHtml(html, mangleMap, checksum, options = {}) {
   return injectHydrationData(html, mangleMap, checksum, options);
 }
-function buildRecoveryManifest(tokens, options = {}) {
+function buildRecoveryManifest(tokens, options) {
   const stripped = options.production === true;
   const strippedDevOnlyPaths = [];
   const sorted = {};
@@ -214,14 +214,14 @@ function buildRecoveryManifest(tokens, options = {}) {
       strippedDevOnlyPaths.push(data.path);
       continue;
     }
-    sorted[key] = data;
+    sorted[key] = stripped ? { mode: data.mode, component: data.component, path: "" } : data;
   }
   const serialised = JSON.stringify(sorted);
   const fullChecksum = (0, import_node_crypto.createHash)("sha256").update(serialised).digest("hex");
   const checksum = fullChecksum.substring(0, 16);
   const buildId = `${Date.now().toString(36)}-${fullChecksum.substring(0, 6)}`;
   return {
-    manifest: { buildId, checksum, tokens: sorted },
+    manifest: { buildId, checksum, mangleChecksum: options.mangleChecksum, tokens: sorted },
     strippedDevOnlyPaths
   };
 }
@@ -241,6 +241,303 @@ function injectRecoveryManifest(html, manifest) {
   return html + scriptTag;
 }
 
+// src/rsc-boundary.ts
+var fs = __toESM(require("fs"), 1);
+var path = __toESM(require("path"), 1);
+var SERVER_DIRECTIVE_RE = /^['"]use server['"];?$/;
+var CLIENT_DIRECTIVE_RE = /^['"]use client['"];?$/;
+var RUNTIME_MODULES = /* @__PURE__ */ new Set([
+  "@csszyx/runtime",
+  "@csszyx/runtime/lite",
+  "csszyx",
+  "csszyx/lite"
+]);
+var FORBIDDEN_SYMBOLS = /* @__PURE__ */ new Set([
+  "_sz",
+  "_sz2",
+  "_sz3",
+  "_szIf",
+  "_szMerge",
+  "_szSwitch",
+  "__csszyx_runtime__"
+]);
+function hasUseServerDirective(code) {
+  for (const statement of readDirectivePrologue(code)) {
+    if (SERVER_DIRECTIVE_RE.test(statement)) {
+      return true;
+    }
+    if (CLIENT_DIRECTIVE_RE.test(statement)) {
+      return false;
+    }
+  }
+  return false;
+}
+function hasUseClientDirective(code) {
+  for (const statement of readDirectivePrologue(code)) {
+    if (CLIENT_DIRECTIVE_RE.test(statement)) {
+      return true;
+    }
+    if (SERVER_DIRECTIVE_RE.test(statement)) {
+      return false;
+    }
+  }
+  return false;
+}
+function isRSCServerModule(code, id) {
+  if (hasUseServerDirective(code)) {
+    return true;
+  }
+  if (hasUseClientDirective(code)) {
+    return false;
+  }
+  return isNextAppRouterEntry(id);
+}
+function findRSCBoundaryViolation(code, id) {
+  if (!isRSCServerModule(code, id)) {
+    return null;
+  }
+  for (const imported of findRuntimeImports(code)) {
+    for (const symbol of imported.symbols) {
+      if (FORBIDDEN_SYMBOLS.has(symbol)) {
+        return {
+          symbol,
+          path: id,
+          importChain: [id, imported.source]
+        };
+      }
+    }
+  }
+  return null;
+}
+function createRSCModuleRecord(code, id) {
+  const normalized = normalizeModuleId(id);
+  return {
+    id: normalized,
+    isServer: isRSCServerModule(code, normalized),
+    isClient: hasUseClientDirective(code),
+    imports: findLocalImportSources(code).map((source) => resolveLocalModule(normalized, source)).filter((resolved) => resolved !== null),
+    runtimeImports: findRuntimeImports(code).filter((imported) => imported.symbols.some((symbol) => FORBIDDEN_SYMBOLS.has(symbol)))
+  };
+}
+function findRSCGraphViolation(records) {
+  for (const root of records.values()) {
+    if (!root.isServer) {
+      continue;
+    }
+    const violation = walkRSCGraph(root, records, [root.id], /* @__PURE__ */ new Set([root.id]));
+    if (violation) {
+      return {
+        symbol: violation.symbol,
+        path: root.id,
+        importChain: violation.importChain
+      };
+    }
+  }
+  return null;
+}
+function assertNoRSCGraphViolation(records) {
+  const violation = findRSCGraphViolation(records);
+  if (!violation) {
+    return;
+  }
+  throw new Error(formatRSCViolation(violation));
+}
+function isNextAppRouterEntry(id) {
+  const clean = id.split("?")[0]?.replace(/\\/g, "/") ?? id;
+  return /(^|\/)app\/.*\/?(?:page|layout|template|loading|error|not-found|global-error|default|route)\.[cm]?[tj]sx?$/.test(clean);
+}
+function assertNoRSCBoundaryViolation(code, id) {
+  const violation = findRSCBoundaryViolation(code, id);
+  if (!violation) {
+    return;
+  }
+  throw new Error(formatRSCViolation(violation));
+}
+function formatRSCViolation(violation) {
+  return `csszyxRSCViolation: ${violation.symbol} imported in Server Component ${violation.path}
+  Import chain: ${violation.importChain.join(" -> ")}`;
+}
+function walkRSCGraph(current, records, chain, seen) {
+  if (current.isClient) {
+    return null;
+  }
+  const runtime = current.runtimeImports[0];
+  const symbol = runtime?.symbols.find((s) => FORBIDDEN_SYMBOLS.has(s));
+  if (runtime && symbol) {
+    return {
+      symbol,
+      path: chain[0] ?? current.id,
+      importChain: [...chain, runtime.source]
+    };
+  }
+  for (const importedId of current.imports) {
+    if (seen.has(importedId)) {
+      continue;
+    }
+    const next = records.get(importedId);
+    if (!next) {
+      continue;
+    }
+    seen.add(importedId);
+    const violation = walkRSCGraph(next, records, [...chain, importedId], seen);
+    if (violation) {
+      return violation;
+    }
+  }
+  return null;
+}
+function readDirectivePrologue(code) {
+  const out = [];
+  let i = code.charCodeAt(0) === 65279 ? 1 : 0;
+  while (i < code.length) {
+    i = skipWhitespaceAndComments(code, i);
+    const quote = code[i];
+    if (quote !== '"' && quote !== "'") {
+      break;
+    }
+    let j = i + 1;
+    let escaped = false;
+    while (j < code.length) {
+      const ch = code[j];
+      if (escaped) {
+        escaped = false;
+      } else if (ch === "\\") {
+        escaped = true;
+      } else if (ch === quote) {
+        break;
+      }
+      j++;
+    }
+    if (j >= code.length) {
+      break;
+    }
+    let end = j + 1;
+    while (end < code.length && /[ \t\r\n]/.test(code[end])) {
+      end++;
+    }
+    if (code[end] === ";") {
+      end++;
+    }
+    out.push(code.slice(i, end).trim());
+    i = end;
+  }
+  return out;
+}
+function skipWhitespaceAndComments(code, start) {
+  let i = start;
+  while (i < code.length) {
+    while (i < code.length && /\s/.test(code[i])) {
+      i++;
+    }
+    if (code.startsWith("//", i)) {
+      const next = code.indexOf("\n", i + 2);
+      i = next === -1 ? code.length : next + 1;
+      continue;
+    }
+    if (code.startsWith("/*", i)) {
+      const next = code.indexOf("*/", i + 2);
+      i = next === -1 ? code.length : next + 2;
+      continue;
+    }
+    break;
+  }
+  return i;
+}
+function findRuntimeImports(code) {
+  const imports = [];
+  const staticImportRe = /import\s+(?!type\b)([\s\S]*?)\s+from\s+['"]([^'"]+)['"]/g;
+  const sideEffectImportRe = /import\s+['"]([^'"]+)['"]/g;
+  const dynamicImportRe = /import\s*\(\s*['"]([^'"]+)['"]\s*\)/g;
+  let match;
+  while ((match = staticImportRe.exec(code)) !== null) {
+    const clause = match[1];
+    const source = match[2];
+    if (!RUNTIME_MODULES.has(source)) {
+      continue;
+    }
+    imports.push({ source, symbols: readImportedSymbols(clause) });
+  }
+  while ((match = sideEffectImportRe.exec(code)) !== null) {
+    const source = match[1];
+    if (RUNTIME_MODULES.has(source)) {
+      imports.push({ source, symbols: [] });
+    }
+  }
+  while ((match = dynamicImportRe.exec(code)) !== null) {
+    const source = match[1];
+    if (RUNTIME_MODULES.has(source)) {
+      imports.push({ source, symbols: Array.from(FORBIDDEN_SYMBOLS) });
+    }
+  }
+  return imports;
+}
+function findLocalImportSources(code) {
+  const out = [];
+  const staticImportRe = /import\s+(?!type\b)(?:[\s\S]*?\s+from\s+)?['"]([^'"]+)['"]/g;
+  const exportFromRe = /export\s+(?!type\b)(?:[\s\S]*?)\s+from\s+['"]([^'"]+)['"]/g;
+  const dynamicImportRe = /import\s*\(\s*['"]([^'"]+)['"]\s*\)/g;
+  let match;
+  for (const re of [staticImportRe, exportFromRe, dynamicImportRe]) {
+    while ((match = re.exec(code)) !== null) {
+      const source = match[1];
+      if (source.startsWith(".") || source.startsWith("/")) {
+        out.push(source);
+      }
+    }
+  }
+  return out;
+}
+function normalizeModuleId(id) {
+  const clean = id.split("?")[0] ?? id;
+  try {
+    return fs.realpathSync.native(clean).replace(/\\/g, "/");
+  } catch {
+    return path.resolve(clean).replace(/\\/g, "/");
+  }
+}
+function resolveLocalModule(importer, source) {
+  const base = source.startsWith("/") ? source : path.resolve(path.dirname(importer), source);
+  const candidates = [
+    base,
+    `${base}.tsx`,
+    `${base}.ts`,
+    `${base}.jsx`,
+    `${base}.js`,
+    `${base}.mjs`,
+    `${base}.cjs`,
+    path.join(base, "index.tsx"),
+    path.join(base, "index.ts"),
+    path.join(base, "index.jsx"),
+    path.join(base, "index.js")
+  ];
+  for (const candidate of candidates) {
+    if (fs.existsSync(candidate) && fs.statSync(candidate).isFile()) {
+      return normalizeModuleId(candidate);
+    }
+  }
+  return null;
+}
+function readImportedSymbols(clause) {
+  const symbols = [];
+  const named = clause.match(/\{([\s\S]*?)\}/);
+  if (named) {
+    for (const part of named[1].split(",")) {
+      const trimmed = part.trim();
+      if (!trimmed || trimmed.startsWith("type ")) {
+        continue;
+      }
+      const sourceName = trimmed.replace(/^type\s+/, "").split(/\s+as\s+/)[0]?.trim();
+      if (sourceName) {
+        symbols.push(sourceName);
+      }
+    }
+  }
+  if (/\*\s+as\s+\w+/.test(clause)) {
+    symbols.push(...FORBIDDEN_SYMBOLS);
+  }
+  return symbols;
+}
+
 // src/theme-scanner.ts
 var EMPTY_THEME = { colors: [], spacings: [], fonts: [], radii: [], shadows: [] };
 function stripLayerWrappers(css) {
@@ -489,8 +786,8 @@ function runThemeScan(rootDir, scanCss) {
   const patterns = Array.isArray(scanCss) ? scanCss : [scanCss];
   const sourceFiles = [];
   for (const pattern of patterns) {
-    const resolved = path.isAbsolute(pattern) ? pattern : path.join(rootDir, pattern);
-    if (fs.existsSync(resolved)) {
+    const resolved = path2.isAbsolute(pattern) ? pattern : path2.join(rootDir, pattern);
+    if (fs2.existsSync(resolved)) {
       sourceFiles.push(resolved);
     }
   }
@@ -499,20 +796,20 @@ function runThemeScan(rootDir, scanCss) {
   }
   const themes = sourceFiles.map((f) => {
     try {
-      return parseThemeBlocks(fs.readFileSync(f, "utf-8"));
+      return parseThemeBlocks(fs2.readFileSync(f, "utf-8"));
     } catch {
       return null;
     }
   }).filter((t) => t !== null);
   const merged = mergeThemes(themes);
-  const outputPath = path.join(rootDir, ".csszyx", "theme.d.ts");
+  const outputPath = path2.join(rootDir, ".csszyx", "theme.d.ts");
   writeThemeDts({ outputPath, theme: merged, sourceFiles });
   if (!_hasWarnedTsConfig) {
     _hasWarnedTsConfig = true;
     try {
       const checkFile = (cfgPath) => {
-        if (fs.existsSync(cfgPath)) {
-          const content = fs.readFileSync(cfgPath, "utf-8");
+        if (fs2.existsSync(cfgPath)) {
+          const content = fs2.readFileSync(cfgPath, "utf-8");
           if (!content.includes(".csszyx")) {
             console.warn(`
 \x1B[33m\u26A0\uFE0F CSSzyx: Theme Auto-Scan enabled, but TypeScript isn't configured. Run "npx @csszyx/cli init" to fix.\x1B[0m
@@ -522,8 +819,8 @@ function runThemeScan(rootDir, scanCss) {
         }
         return false;
       };
-      if (!checkFile(path.join(rootDir, "tsconfig.json"))) {
-        checkFile(path.join(rootDir, "tsconfig.app.json"));
+      if (!checkFile(path2.join(rootDir, "tsconfig.json"))) {
+        checkFile(path2.join(rootDir, "tsconfig.app.json"));
       }
     } catch {
     }
@@ -703,13 +1000,15 @@ function mangleCodeClassesSync(code, mangleMap) {
 }
 function createCsszyxPlugins(options = {}) {
   const manglingEnabled = options.production?.mangle !== false;
+  const astBudgetOverride = options.build?.astBudgetLimit;
   const state = {
     classes: /* @__PURE__ */ new Set(),
     mangleMap: {},
     checksum: "",
     finalized: false,
     rootDir: process.cwd(),
-    recoveryTokens: /* @__PURE__ */ new Map()
+    recoveryTokens: /* @__PURE__ */ new Map(),
+    rscModules: /* @__PURE__ */ new Map()
   };
   const SAFELIST_FILENAME = "csszyx-classes.html";
   const SOURCE_EXTENSIONS = /* @__PURE__ */ new Set([".tsx", ".jsx", ".ts", ".js"]);
@@ -718,16 +1017,16 @@ function createCsszyxPlugins(options = {}) {
     if (classes.size === 0) {
       return;
     }
-    const safelistPath = path.join(state.rootDir, SAFELIST_FILENAME);
+    const safelistPath = path2.join(state.rootDir, SAFELIST_FILENAME);
     const classList = Array.from(classes).join(" ");
     const content = `<!-- Auto-generated by csszyx \u2014 DO NOT EDIT -->
 <!-- Tailwind CSS scans this file for class name detection -->
 <div class="${classList}"><div class="${classList}">x</div><div class="${classList}">x</div></div>
 `;
     try {
-      const existing = fs.existsSync(safelistPath) ? fs.readFileSync(safelistPath, "utf-8") : "";
+      const existing = fs2.existsSync(safelistPath) ? fs2.readFileSync(safelistPath, "utf-8") : "";
       if (existing !== content) {
-        fs.writeFileSync(safelistPath, content);
+        fs2.writeFileSync(safelistPath, content);
       }
     } catch {
     }
@@ -738,23 +1037,23 @@ function createCsszyxPlugins(options = {}) {
     function scanDir(dir) {
       let entries;
       try {
-        entries = fs.readdirSync(dir, { withFileTypes: true });
+        entries = fs2.readdirSync(dir, { withFileTypes: true });
       } catch {
         return;
       }
       for (const entry of entries) {
         if (entry.isDirectory()) {
           if (!IGNORE_DIRS.has(entry.name) && !entry.name.startsWith(".")) {
-            scanDir(path.join(dir, entry.name));
+            scanDir(path2.join(dir, entry.name));
           }
-        } else if (SOURCE_EXTENSIONS.has(path.extname(entry.name))) {
-          const filePath = path.join(dir, entry.name);
+        } else if (SOURCE_EXTENSIONS.has(path2.extname(entry.name))) {
+          const filePath = path2.join(dir, entry.name);
           try {
-            const content = fs.readFileSync(filePath, "utf-8");
+            const content = fs2.readFileSync(filePath, "utf-8");
             if (!content.includes("sz=") && !content.includes("sz:")) {
               continue;
             }
-            const result = (0, import_compiler.transformSourceCode)(content, filePath);
+            const result = (0, import_compiler.transformSourceCode)(content, filePath, { astBudget: astBudgetOverride });
             if (!result.transformed) {
               continue;
             }
@@ -942,14 +1241,17 @@ function createCsszyxPlugins(options = {}) {
      * @returns transformed code with source map, or null if no changes were made
      */
     transform(code, id) {
+      if (/\.[tj]sx?(\?.*)?$/.test(id)) {
+        assertNoRSCBoundaryViolation(code, id);
+      }
       if (/\.css(\?.*)?$/.test(id)) {
         const hasTailwindImport = code.includes('@import "tailwindcss') || code.includes("@import 'tailwindcss");
         if (hasTailwindImport && state.classes.size > 0) {
           const candidates = Array.from(state.classes).filter((c) => c.length >= 2 && /^[a-z]/.test(c)).join(" ");
           if (candidates) {
-            const safelistPath = path.join(state.rootDir, SAFELIST_FILENAME).replace(/\\/g, "/");
-            const cssDir = path.dirname(id).replace(/\\/g, "/");
-            let relPath = path.posix.relative(cssDir, safelistPath);
+            const safelistPath = path2.join(state.rootDir, SAFELIST_FILENAME).replace(/\\/g, "/");
+            const cssDir = path2.dirname(id).replace(/\\/g, "/");
+            let relPath = path2.posix.relative(cssDir, safelistPath);
             if (!relPath.startsWith(".")) {
               relPath = "./" + relPath;
             }
@@ -988,7 +1290,7 @@ ${sourceDirective}`
             transformed = true;
           }
         } else {
-          const result = (0, import_compiler.transformSourceCode)(code, id);
+          const result = (0, import_compiler.transformSourceCode)(code, id, { astBudget: astBudgetOverride });
           transformedCode = result.code;
           usesRuntime = result.usesRuntime;
           usesMerge = result.usesMerge;
@@ -1053,6 +1355,11 @@ ${sourceDirective}`
           transformed = true;
         }
       }
+      if (/\.[tj]sx?(\?.*)?$/.test(id)) {
+        assertNoRSCBoundaryViolation(transformedCode, id);
+        const record = createRSCModuleRecord(transformedCode, id);
+        state.rscModules.set(record.id, record);
+      }
       if (transformed || transformedCode.includes("class=") || transformedCode.includes("className=")) {
         if (szClasses !== void 0) {
           for (const cls of szClasses) {
@@ -1068,6 +1375,7 @@ ${sourceDirective}`
     /** Finalizes the mangle map after all source modules have been processed. */
     buildEnd() {
       finalizeMangleMap();
+      assertNoRSCGraphViolation(state.rscModules);
       if (manglingEnabled && Object.keys(state.mangleMap).length > 0) {
         globalThis.__csszyx_ssr_mangle_map = state.mangleMap;
       }
@@ -1090,8 +1398,8 @@ ${sourceDirective}`
         compiler.hooks.thisCompilation.tap("csszyx:theme-deps", (compilation) => {
           const root = compiler.context || process.cwd();
           for (const pattern of patterns) {
-            const resolved = path.isAbsolute(pattern) ? pattern : path.join(root, pattern);
-            if (fs.existsSync(resolved)) {
+            const resolved = path2.isAbsolute(pattern) ? pattern : path2.join(root, pattern);
+            if (fs2.existsSync(resolved)) {
               compilation.fileDependencies.add(resolved);
             }
           }
@@ -1121,14 +1429,14 @@ ${sourceDirective}`
           const patterns = Array.isArray(scanCss) ? scanCss : [scanCss];
           const root = ctx.server.config.root || process.cwd();
           const isWatched = patterns.some((p) => {
-            const resolved = path.isAbsolute(p) ? p : path.join(root, p);
+            const resolved = path2.isAbsolute(p) ? p : path2.join(root, p);
             return ctx.file === resolved;
           });
           if (isWatched) {
             runThemeScan(root, scanCss);
           }
         }
-        if (!SOURCE_EXTENSIONS.has(path.extname(ctx.file))) {
+        if (!SOURCE_EXTENSIONS.has(path2.extname(ctx.file))) {
           return;
         }
         if (ctx.file.includes("node_modules")) {
@@ -1136,7 +1444,7 @@ ${sourceDirective}`
         }
         let fileContent, result;
         try {
-          fileContent = fs.readFileSync(ctx.file, "utf-8");
+          fileContent = fs2.readFileSync(ctx.file, "utf-8");
         } catch {
           return;
         }
@@ -1144,7 +1452,7 @@ ${sourceDirective}`
           return;
         }
         try {
-          result = (0, import_compiler.transformSourceCode)(fileContent, ctx.file);
+          result = (0, import_compiler.transformSourceCode)(fileContent, ctx.file, { astBudget: astBudgetOverride });
         } catch {
           return;
         }
@@ -1160,7 +1468,7 @@ ${sourceDirective}`
         }
         if (state.classes.size > sizeBefore) {
           writeSafelistFile(state.classes);
-          const safelistPath = path.join(state.rootDir, SAFELIST_FILENAME);
+          const safelistPath = path2.join(state.rootDir, SAFELIST_FILENAME);
           ctx.server.watcher.emit("change", safelistPath);
         }
       },
@@ -1182,7 +1490,10 @@ ${sourceDirective}`
             const isProduction = process.env.NODE_ENV === "production";
             const { manifest, strippedDevOnlyPaths } = buildRecoveryManifest(
               state.recoveryTokens,
-              { production: isProduction }
+              {
+                production: isProduction,
+                mangleChecksum: state.checksum
+              }
             );
             if (strippedDevOnlyPaths.length > 0) {
               console.warn(

package/dist/webpack.js

@@ -1,6 +1,6 @@
 import {
   webpackPlugin
-} from "./chunk-HOQTC45W.js";
+} from "./chunk-GXGGTRUA.js";
 import "./chunk-4M7CPGP7.js";
 
 // src/webpack.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@csszyx/unplugin",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "description": "Vite and Webpack integration for csszyx",
   "keywords": [
     "csszyx",
@@ -55,11 +55,11 @@
     "postcss": "^8.4.35",
     "postcss-selector-parser": "^6.0.15",
     "unplugin": "^1.10.1",
-    "@csszyx/compiler": "0.6.0",
-    "@csszyx/svelte-adapter": "0.6.0",
-    "@csszyx/core": "0.6.0",
-    "@csszyx/types": "0.6.0",
-    "@csszyx/vue-adapter": "0.6.0"
+    "@csszyx/compiler": "0.7.0",
+    "@csszyx/core": "0.7.0",
+    "@csszyx/svelte-adapter": "0.7.0",
+    "@csszyx/vue-adapter": "0.7.0",
+    "@csszyx/types": "0.7.0"
   },
   "devDependencies": {
     "@types/node": "^20.11.0",