next-style 2.0.0 → 2.0.1

package/dist/compiler/index.d.ts

@@ -65,6 +65,16 @@ export declare class StyleCollector {
      */
     getAllStyles(): string;
     private extractMinWidth;
+    /**
+     * Writes all collected styles to a temp file so the PostCSS plugin
+     * (which runs in a separate process) can read them.
+     *
+     * Call this after all `css()` / `global()` calls have been evaluated,
+     * e.g. at the end of a build-time entry point.
+     *
+     * @param filePath - Destination file path. Defaults to `os.tmpdir()/next-style.css`.
+     */
+    flush(filePath?: string): void;
     /**
      * Returns a snapshot of the internal style map.
      * Intended for inspection and testing — not for direct mutation.

package/dist/compiler/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compiler/index.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC7B,6CAA6C;IAC7C,SAAS,EAAE,MAAM,CAAA;IACjB,0CAA0C;IAC1C,GAAG,EAAE,MAAM,CAAA;IACX,6DAA6D;IAC7D,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,iEAAiE;IACjE,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACrC,iEAAiE;IACjE,SAAS,EAAE,MAAM,CAAA;IACjB,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,6CAA6C;IAC7C,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAC9B;AAED;;;;;;;;;;GAUG;AACH,qBAAa,cAAc;IAC1B,OAAO,CAAC,MAAM,CAAmC;IAEjD;;;;;;OAMG;IACH,QAAQ,CAAC,QAAQ,EAAE,GAAG,GAAG,MAAM;IAW/B;;;;;;OAMG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,GAAG,IAAI;IAgBrD,OAAO,CAAC,YAAY;IA+DpB,OAAO,CAAC,WAAW;IAwCnB,OAAO,CAAC,iBAAiB;IAUzB;;;;;;;;;;;;OAYG;IACH,YAAY,IAAI,MAAM;IAwBtB,OAAO,CAAC,eAAe;IAKvB;;;OAGG;IACH,WAAW;CAGX;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB;;IAI/B;;;;OAIG;+BACwB,GAAG,GAAG,MAAM;EAIxC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/compiler/index.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC7B,6CAA6C;IAC7C,SAAS,EAAE,MAAM,CAAA;IACjB,0CAA0C;IAC1C,GAAG,EAAE,MAAM,CAAA;IACX,6DAA6D;IAC7D,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,iEAAiE;IACjE,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACrC,iEAAiE;IACjE,SAAS,EAAE,MAAM,CAAA;IACjB,qDAAqD;IACrD,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IAChC,6CAA6C;IAC7C,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAC9B;AAED;;;;;;;;;;GAUG;AACH,qBAAa,cAAc;IAC1B,OAAO,CAAC,MAAM,CAAmC;IAEjD;;;;;;OAMG;IACH,QAAQ,CAAC,QAAQ,EAAE,GAAG,GAAG,MAAM;IAW/B;;;;;;OAMG;IACH,cAAc,CAAC,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,GAAG,IAAI;IAgBrD,OAAO,CAAC,YAAY;IA+DpB,OAAO,CAAC,WAAW;IAwCnB,OAAO,CAAC,iBAAiB;IAUzB;;;;;;;;;;;;OAYG;IACH,YAAY,IAAI,MAAM;IAwBtB,OAAO,CAAC,eAAe;IAKvB;;;;;;;;OAQG;IACH,KAAK,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI;IAQ9B;;;OAGG;IACH,WAAW;CAGX;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB;;IAI/B;;;;OAIG;+BACwB,GAAG,GAAG,MAAM;EAIxC"}

package/dist/compiler/index.js

@@ -193,6 +193,22 @@ export class StyleCollector {
         const match = query.match(/min-width:\s*(\d+)px/);
         return match ? parseInt(match[1], 10) : 0;
     }
+    /**
+     * Writes all collected styles to a temp file so the PostCSS plugin
+     * (which runs in a separate process) can read them.
+     *
+     * Call this after all `css()` / `global()` calls have been evaluated,
+     * e.g. at the end of a build-time entry point.
+     *
+     * @param filePath - Destination file path. Defaults to `os.tmpdir()/next-style.css`.
+     */
+    flush(filePath) {
+        const fs = require('node:fs');
+        const os = require('node:os');
+        const path = require('node:path');
+        const dest = filePath ?? path.join(os.tmpdir(), 'next-style.css');
+        fs.writeFileSync(dest, this.getAllStyles(), 'utf-8');
+    }
     /**
      * Returns a snapshot of the internal style map.
      * Intended for inspection and testing — not for direct mutation.

package/dist/postcss-plugin/index.d.ts

@@ -1,23 +1,12 @@
 import postcss from 'postcss';
-import type { StyleCollector } from '../compiler';
-/**
- * PostCSS plugin for next-style.
- *
- * Replaces `@import "next-style";` (or `@import 'next-style';`) in CSS files
- * with the compiled CSS collected by the StyleCollector.
- *
- * The collector is populated by the runtime `css()` / `global()` calls that
- * run during the build-time module evaluation (SWC / tsc transform pass).
- * At that point all `css({})` calls have been executed and their styles are
- * sitting in the collector — the PostCSS plugin just needs to drain it.
- *
- * Usage in postcss.config.js:
- *   import nextStylePlugin from 'next-style/plugin'
- *   export default { plugins: { 'next-style/plugin': {} } }
- */
+/** Path to the temp file used as IPC bridge between runtime and PostCSS. */
+export declare const CACHE_FILE: string;
 interface PluginOptions {
-    /** Provide a custom collector (useful for testing / server integration). */
-    collector?: StyleCollector;
+    /**
+     * Override the cache file path.
+     * Defaults to `os.tmpdir()/next-style.css`.
+     */
+    cacheFile?: string;
 }
 declare function nextStylePlugin(opts?: PluginOptions): postcss.Plugin;
 declare namespace nextStylePlugin {

package/dist/postcss-plugin/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/postcss-plugin/index.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,SAAS,CAAA;AAC7B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAIjD;;;;;;;;;;;;;;GAcG;AAEH,UAAU,aAAa;IACtB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,cAAc,CAAA;CAC1B;AAED,iBAAS,eAAe,CAAC,IAAI,GAAE,aAAkB,kBA6ChD;kBA7CQ,eAAe;;;AAiDxB,eAAe,eAAe,CAAA;AAC9B,eAAO,MAAM,MAAM,wBAAkB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/postcss-plugin/index.ts"],"names":[],"mappings":"AAGA,OAAO,OAAO,MAAM,SAAS,CAAA;AAoB7B,4EAA4E;AAC5E,eAAO,MAAM,UAAU,QAA2C,CAAA;AAElE,UAAU,aAAa;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,iBAAS,eAAe,CAAC,IAAI,GAAE,aAAkB,kBAqChD;kBArCQ,eAAe;;;AAyCxB,eAAe,eAAe,CAAA;AAC9B,eAAO,MAAM,MAAM,wBAAkB,CAAA"}

package/dist/postcss-plugin/index.js

@@ -1,43 +1,56 @@
+import fs from 'node:fs';
+import os from 'node:os';
+import path from 'node:path';
 import postcss from 'postcss';
+/**
+ * PostCSS plugin for next-style.
+ *
+ * How it works with Turbopack:
+ * 1. `css()` / `global()` calls in component files write compiled CSS to a
+ *    temp file (`os.tmpdir()/next-style.css`) via `styleCollector.flush()`.
+ * 2. This plugin reads that temp file and replaces `@import "next-style"`
+ *    with its contents at PostCSS processing time.
+ *
+ * Because PostCSS runs in a separate process from the module graph,
+ * in-memory collectors cannot be shared. The temp file is the IPC bridge.
+ *
+ * Usage in postcss.config.js:
+ *   export default { plugins: { "next-style/plugin": {} } }
+ */
 const IMPORT_RE = /^next-style$/;
+/** Path to the temp file used as IPC bridge between runtime and PostCSS. */
+export const CACHE_FILE = path.join(os.tmpdir(), 'next-style.css');
 function nextStylePlugin(opts = {}) {
-    // Lazy-import the runtime collector so the plugin works even when
-    // the runtime module hasn't been evaluated yet (returns empty string then).
-    let collector = opts.collector ?? null;
+    const cacheFile = opts.cacheFile ?? CACHE_FILE;
     const plugin = {
         postcssPlugin: 'next-style',
         Once(root) {
-            // Resolve collector from runtime if not provided
-            if (!collector) {
-                try {
-                    // Dynamic require so the plugin can be loaded before the
-                    // runtime module is on disk (e.g. during type-check only builds).
-                    // eslint-disable-next-line @typescript-eslint/no-var-requires
-                    const runtime = require('../runtime');
-                    collector = runtime.styleCollector;
-                }
-                catch {
-                    // Runtime not available — skip injection silently
-                    return;
-                }
+            // Read compiled CSS from the temp file written by the runtime
+            let cssContent = '';
+            try {
+                cssContent = fs.readFileSync(cacheFile, 'utf-8');
             }
-            const cssContent = collector.getAllStyles();
-            if (!cssContent.trim())
-                return;
-            // Walk @import "next-style" / @import 'next-style' declarations
-            let injected = false;
+            catch {
+                // Cache file doesn't exist yet (first cold boot before any css() call)
+                // — leave the @import in place so PostCSS doesn't error, just remove it
+            }
+            // Replace @import "next-style" with compiled CSS (or remove if empty)
+            let replaced = false;
             root.walkAtRules('import', atRule => {
                 const val = atRule.params.replace(/['"]/g, '').trim();
                 if (!IMPORT_RE.test(val))
                     return;
-                const parsed = postcss.parse(cssContent);
-                atRule.replaceWith(parsed);
-                injected = true;
+                if (cssContent.trim()) {
+                    atRule.replaceWith(postcss.parse(cssContent));
+                }
+                else {
+                    atRule.remove();
+                }
+                replaced = true;
             });
-            // If there was no @import directive, prepend styles at the top
-            if (!injected) {
-                const parsed = postcss.parse(cssContent);
-                root.prepend(parsed);
+            // No @import directive — prepend at top if there's content
+            if (!replaced && cssContent.trim()) {
+                root.prepend(postcss.parse(cssContent));
             }
         }
     };

package/dist/runtime/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/runtime/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAE5C;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;AAEvD,4FAA4F;AAC5F,KAAK,YAAY,GAAG;KAAG,CAAC,IAAI,OAAO,CAAC,CAAC,EAAE,aAAa;CAAE,CAAA;AAEtD,iFAAiF;AACjF,KAAK,YAAY,GAAG;IACnB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,MAAM,CAAC,EAAE,aAAa,CAAA;IACtB,CAAC,KAAK,EAAE,UAAU,MAAM,EAAE,GAAG,aAAa,CAAA;IAC1C,CAAC,SAAS,EAAE,cAAc,MAAM,EAAE,GAAG,aAAa,CAAA;IAClD,CAAC,QAAQ,EAAE,aAAa,MAAM,EAAE,GAAG,aAAa,CAAA;IAChD,CAAC,KAAK,EAAE,UAAU,MAAM,EAAE,GAAG,aAAa,CAAA;IAC1C,CAAC,SAAS,EAAE,cAAc,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAA;CAClE,CAAA;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,SAAS,GAAG,aAAa,GACpC,YAAY,GACZ,YAAY,GAAG;IACd,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAClB,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,GAAG,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,CAE7C;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAI,CAI9D;AAED;;;;;;;GAOG;AACH,OAAO,EAAE,SAAS,IAAI,cAAc,EAAE,CAAA;AAEtC,QAAA,MAAM,SAAS,gBAAuB,CAAA;AAEtC,gDAAgD;AAChD,eAAO,MAAM,aAAa;eACd,MAAM;;CAEjB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/runtime/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAClD,OAAO,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAE5C;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG,UAAU,CAAC,MAAM,GAAG,MAAM,CAAC,CAAA;AAEvD,4FAA4F;AAC5F,KAAK,YAAY,GAAG;KAAG,CAAC,IAAI,OAAO,CAAC,CAAC,EAAE,aAAa;CAAE,CAAA;AAEtD,iFAAiF;AACjF,KAAK,YAAY,GAAG;IACnB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,MAAM,CAAC,EAAE,aAAa,CAAA;IACtB,CAAC,KAAK,EAAE,UAAU,MAAM,EAAE,GAAG,aAAa,CAAA;IAC1C,CAAC,SAAS,EAAE,cAAc,MAAM,EAAE,GAAG,aAAa,CAAA;IAClD,CAAC,QAAQ,EAAE,aAAa,MAAM,EAAE,GAAG,aAAa,CAAA;IAChD,CAAC,KAAK,EAAE,UAAU,MAAM,EAAE,GAAG,aAAa,CAAA;IAC1C,CAAC,SAAS,EAAE,cAAc,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,CAAA;CAClE,CAAA;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,SAAS,GAAG,aAAa,GACpC,YAAY,GACZ,YAAY,GAAG;IACd,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;CAClB,CAAA;AAEF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,GAAG,CAAC,MAAM,EAAE,SAAS,GAAG,MAAM,CAI7C;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAI,CAK9D;AAED;;;;;;;GAOG;AACH,OAAO,EAAE,SAAS,IAAI,cAAc,EAAE,CAAA;AAEtC,QAAA,MAAM,SAAS,gBAAuB,CAAA;AAEtC,gDAAgD;AAChD,eAAO,MAAM,aAAa;eACd,MAAM;;CAEjB,CAAA"}

package/dist/runtime/index.js

@@ -23,7 +23,9 @@ import { StyleCollector } from '../compiler';
  * }
  */
 export function css(styles) {
-    return collector.addStyle(styles);
+    const className = collector.addStyle(styles);
+    collector.flush();
+    return className;
 }
 /**
  * Registers global CSS styles applied directly to selectors (no scoped class).
@@ -44,6 +46,7 @@ export function global(styles) {
     Object.entries(styles).forEach(([selector, styleObj]) => {
         collector.addGlobalStyle(selector, styleObj);
     });
+    collector.flush();
 }
 /**
  * The shared `StyleCollector` instance.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "next-style",
-	"version": "2.0.0",
+	"version": "2.0.1",
 	"description": "Zero-Runtime CSS-in-JS for Next.js + Turbopack",
 	"type": "module",
 	"main": "./dist/index.js",
@@ -41,11 +41,10 @@
 		"@types/bun": "^1.3.14",
 		"@types/node": "^25.7.0",
 		"csstype": "^3.2.3",
-		"postcss": "^8.5.14",
 		"typescript": "^5"
 	},
 	"peerDependencies": {
-		"postcss": "^8.4.31"
+		"postcss": ">=8.4.31"
 	},
 	"keywords": ["css-in-js", "zero-runtime", "next.js", "turbopack", "postcss", "style", "next-style", "css"],
 	"author": "TiwPhiraphan",