chaincss 2.1.21 → 2.1.23

package/dist/index.js

@@ -3353,16 +3353,8 @@ var compileRuntime = (s, moduleId) => styleInjector.injectMultiple(s, moduleId);
 // src/runtime/index.ts
 function injectChainStyles(styles) {
   let css = "";
-  let staticCount = 0, dynamicCount = 0, hybridCount = 0;
   for (const [key, obj] of Object.entries(styles)) {
     if (!obj || !obj.selectors) continue;
-    if (obj.__isHybrid) {
-      hybridCount++;
-    } else if (obj.__runtimeClasses && Object.keys(obj.__runtimeClasses).length > 0) {
-      dynamicCount++;
-    } else {
-      staticCount++;
-    }
     const sel = "." + obj.selectors[0];
     css += sel + "{";
     for (const [k, v] of Object.entries(obj)) {
@@ -3387,7 +3379,7 @@ function injectChainStyles(styles) {
   el.setAttribute("data-chaincss", "runtime");
   el.textContent = css;
   document.head.appendChild(el);
-  console.log("\u26D3\uFE0F ChainCSS Split: \u{1F4E6} Static=" + staticCount + " \u26A1 Dynamic=" + dynamicCount + " \u{1F500} Hybrid=" + hybridCount + " | CSS: " + css.length + " bytes");
+  console.log("\u26D3\uFE0F ChainCSS \u2014 " + Object.keys(styles).length + " styles injected | CSS: " + css.length + " bytes | smartChain auto-detect active");
   return el;
 }
 

package/dist/plugins/vite.js

@@ -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/dist/runtime/index.js

@@ -3909,16 +3909,8 @@ var injectStyleContextSvelte = (...args) => getSvelteExports().injectStyleContex
 var chainStyles2 = (...args) => getSvelteExports().chainStyles?.(...args);
 function injectChainStyles(styles3) {
   let css = "";
-  let staticCount = 0, dynamicCount = 0, hybridCount = 0;
   for (const [key, obj] of Object.entries(styles3)) {
     if (!obj || !obj.selectors) continue;
-    if (obj.__isHybrid) {
-      hybridCount++;
-    } else if (obj.__runtimeClasses && Object.keys(obj.__runtimeClasses).length > 0) {
-      dynamicCount++;
-    } else {
-      staticCount++;
-    }
     const sel = "." + obj.selectors[0];
     css += sel + "{";
     for (const [k, v] of Object.entries(obj)) {
@@ -3943,7 +3935,7 @@ function injectChainStyles(styles3) {
   el.setAttribute("data-chaincss", "runtime");
   el.textContent = css;
   document.head.appendChild(el);
-  console.log("\u26D3\uFE0F ChainCSS Split: \u{1F4E6} Static=" + staticCount + " \u26A1 Dynamic=" + dynamicCount + " \u{1F500} Hybrid=" + hybridCount + " | CSS: " + css.length + " bytes");
+  console.log("\u26D3\uFE0F ChainCSS \u2014 " + Object.keys(styles3).length + " styles injected | CSS: " + css.length + " bytes | smartChain auto-detect active");
   return el;
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "chaincss",
-  "version": "2.1.21",
+  "version": "2.1.23",
   "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

@@ -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();
       

package/src/runtime/index.ts

@@ -92,20 +92,10 @@ export type {
 // Auto-inject styles into DOM
 export function injectChainStyles(styles: Record<string, any>) {
   let css = '';
-  let staticCount = 0, dynamicCount = 0, hybridCount = 0;
-  
+
   for (const [key, obj] of Object.entries(styles)) {
     if (!obj || !obj.selectors) continue;
     
-    // Use smartChain's built-in detection
-    if (obj.__isHybrid) {
-      hybridCount++;
-    } else if (obj.__runtimeClasses && Object.keys(obj.__runtimeClasses).length > 0) {
-      dynamicCount++;
-    } else {
-      staticCount++;
-    }
-    
     const sel = '.' + obj.selectors[0];
     css += sel + '{';
     for (const [k, v] of Object.entries(obj)) {
@@ -132,7 +122,7 @@ export function injectChainStyles(styles: Record<string, any>) {
   document.head.appendChild(el);
   
   // Show split stats in console
-  console.log('⛓️ ChainCSS Split: 📦 Static=' + staticCount + ' ⚡ Dynamic=' + dynamicCount + ' 🔀 Hybrid=' + hybridCount + ' | CSS: ' + css.length + ' bytes');
+  console.log('⛓️ ChainCSS — ' + Object.keys(styles).length + ' styles injected | CSS: ' + css.length + ' bytes | smartChain auto-detect active');
   
   return el;
 }