chaincss 2.1.22 → 2.1.24

package/dist/plugins/vite.js

@@ -3237,7 +3237,7 @@ function chaincssPlugin(options = {}) {
       return false;
     }
     const isUserFile = id.includes("/src/") || id.includes("/components/");
-    const isComponent = /\.(t|j)sx?$/.test(id);
+    const isComponent = /\.(t|j)sx?$/.test(id) || id.endsWith(".chain.ts") || id.endsWith(".chain.js");
     return isUserFile && isComponent;
   }
   function updateCSS() {
@@ -3435,6 +3435,23 @@ const setManifest = (manifest) => {
           }
           console.log(`  \u2514\u2500 Found ${total} chain calls (${chainMatches?.length || 0} static, ${smartMatches?.length || 0} hybrid)`);
         }
+        if (id.endsWith(".chain.ts") || id.endsWith(".chain.js")) {
+          try {
+            const results = await compiler.compileFile(id);
+            let css2 = "";
+            for (const r of Object.values(results)) {
+              if (r.css) css2 += r.css + "\n";
+            }
+            if (css2.trim()) {
+              generatedCSS += css2;
+              totalCSSBytes += css2.length;
+              if (options.verbose) {
+                console.log(`  \u2514\u2500 Extracted ${css2.length} bytes of CSS`);
+              }
+            }
+          } catch (e) {
+          }
+        }
         await compiler.compileSource(source, id);
         const css = compiler.getCombinedCSS();
         if (css && css.trim()) {
@@ -3506,7 +3523,13 @@ ${source}`,
       hybridCount = 0;
       totalCSSBytes = 0;
     },
-    buildEnd() {
+    async buildEnd() {
+      if (generatedCSS.trim() && options.cssOutput) {
+        const fs8 = await import("fs");
+        const outputPath = path6.resolve(process.cwd(), options.cssOutput);
+        fs8.writeFileSync(outputPath, generatedCSS, "utf8");
+        console.log(`  \u{1F4C1} CSS written to ${options.cssOutput} (${generatedCSS.length} bytes)`);
+      }
       const finalCSS = updateCSS();
       const stats = compiler.getStats();
       console.log("");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chaincss",
-  "version": "2.1.22",
+  "version": "2.1.24",
   "description": "ChainCSS - The first CSS-in-JS library with true auto-detection mixed mode. Zero runtime by default, dynamic when you need it.",
   "type": "module",
   "main": "./dist/index.js",

package/src/plugins/vite.ts

@@ -76,7 +76,7 @@ export default function chaincssPlugin(options: ChainCSSPluginOptions = {}): Plu
     
     // Default: process source files
     const isUserFile = id.includes('/src/') || id.includes('/components/');
-    const isComponent = /\.(t|j)sx?$/.test(id);
+    const isComponent = /\.(t|j)sx?$/.test(id) || id.endsWith(".chain.ts") || id.endsWith(".chain.js");
     
     return isUserFile && isComponent;
   }
@@ -317,7 +317,27 @@ const setManifest = (manifest) => {
           console.log(`  └─ Found ${total} chain calls (${chainMatches?.length || 0} static, ${smartMatches?.length || 0} hybrid)`);
         }
         
-        // Compile the source
+        // Compile .chain.ts files to CSS
+        if (id.endsWith('.chain.ts') || id.endsWith('.chain.js')) {
+          try {
+            const results = await compiler.compileFile(id);
+            let css = '';
+            for (const r of Object.values(results)) {
+              if (r.css) css += r.css + '\n';
+            }
+            if (css.trim()) {
+              generatedCSS += css;
+              totalCSSBytes += css.length;
+              if (options.verbose) {
+                console.log(`  └─ Extracted ${css.length} bytes of CSS`);
+              }
+            }
+          } catch (e) {
+            // Not a compilable chain file
+          }
+        }
+        
+        // Also detect chain() calls in JSX/TSX for stats
         await compiler.compileSource(source, id);
         
         // Show what was found
@@ -416,7 +436,15 @@ const setManifest = (manifest) => {
       totalCSSBytes = 0;
     },
     
-    buildEnd() {
+    async buildEnd() {
+      // Write CSS to file if we have any
+      if (generatedCSS.trim() && options.cssOutput) {
+        const fs = await import('fs');
+        const outputPath = path.resolve(process.cwd(), options.cssOutput);
+        fs.writeFileSync(outputPath, generatedCSS, 'utf8');
+        console.log(`  📁 CSS written to ${options.cssOutput} (${generatedCSS.length} bytes)`);
+      }
+      
       const finalCSS = updateCSS();
       const stats = compiler.getStats();