tailwind-preset-mantine 4.0.0 → 4.0.1

package/README.md

@@ -125,6 +125,20 @@ export default {
 };
 ```
 
+Next.js:
+
+```js
+// postcss.config.mjs
+export default {
+  plugins: {
+    "tailwind-preset-mantine/postcss": {
+      input: "./src/mantine-theme.ts",
+    },
+    "@tailwindcss/postcss": {},
+  },
+};
+```
+
 Vite:
 
 ```ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tailwind-preset-mantine",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "Integrate Mantine with Tailwind CSS",
   "keywords": [
     "mantine",
@@ -23,6 +23,8 @@
     "./theme.css": "./src/theme.css",
     "./postcss": {
       "types": "./src/integrations/postcss.d.ts",
+      "require": "./src/integrations/postcss.cjs",
+      "import": "./src/integrations/postcss.js",
       "default": "./src/integrations/postcss.js"
     },
     "./vite": {

package/src/integrations/postcss-shared.cjs

@@ -0,0 +1,85 @@
+const { access } = require("node:fs/promises");
+const { dirname, resolve } = require("node:path");
+
+/**
+ * @typedef {{
+ * 	input: string;
+ * 	output?: string;
+ * 	format?: "theme" | "standalone";
+ * }} MantineThemePluginOptions
+ */
+
+/**
+ * Create a PostCSS plugin factory from a theme output writer.
+ *
+ * The CJS wrapper uses this helper so the package can expose a `require()`
+ * entry without loading the ESM theme graph until PostCSS actually runs.
+ *
+ * @param {(options: MantineThemePluginOptions, runtimeOptions?: { baseDir?: string }) => Promise<{ dependencies?: string[] }>} writeThemeOutput
+ */
+function createMantineThemePostCSS(writeThemeOutput) {
+	/**
+	 * @param {MantineThemePluginOptions} options
+	 */
+	function mantineTheme(options) {
+		async function resolveBaseDir(result) {
+			const candidates = [];
+			const cwd = result.opts.cwd ?? process.cwd();
+
+			if (result.opts.from) {
+				let current = resolve(cwd, result.opts.from);
+				current = dirname(current);
+
+				while (true) {
+					candidates.push(current);
+					const parent = dirname(current);
+
+					if (parent === current) {
+						break;
+					}
+
+					current = parent;
+				}
+			}
+
+			candidates.push(cwd);
+
+			const dedupedCandidates = [...new Set(candidates)];
+
+			for (const baseDir of dedupedCandidates) {
+				try {
+					await access(resolve(baseDir, options.input));
+					return baseDir;
+				} catch {
+					// Try the next candidate directory.
+				}
+			}
+
+			return cwd;
+		}
+
+		return {
+			postcssPlugin: "tailwind-preset-mantine",
+			async Once(_, { result }) {
+				const baseDir = await resolveBaseDir(result);
+				const { dependencies = [] } = await writeThemeOutput(options, {
+					baseDir,
+				});
+
+				for (const file of dependencies) {
+					result.messages.push({
+						type: "dependency",
+						plugin: "tailwind-preset-mantine",
+						file,
+						parent: result.opts.from,
+					});
+				}
+			},
+		};
+	}
+
+	mantineTheme.postcss = true;
+	return mantineTheme;
+}
+
+module.exports = createMantineThemePostCSS;

package/src/integrations/postcss.cjs

@@ -0,0 +1,8 @@
+const createMantineThemePostCSS = require("./postcss-shared.cjs");
+
+const mantineTheme = createMantineThemePostCSS(async (...args) => {
+	const { writeThemeOutput } = await import("../core/output.js");
+	return writeThemeOutput(...args);
+});
+
+module.exports = mantineTheme;

package/src/integrations/postcss.js

@@ -1,75 +1,6 @@
-import { access } from "node:fs/promises";
-import { dirname, resolve } from "node:path";
+import createMantineThemePostCSS from "./postcss-shared.cjs";
 import { writeThemeOutput } from "../core/output.js";
 
-/**
- * @typedef {{
- * 	input: string;
- * 	output?: string;
- * 	format?: "theme" | "standalone";
- * }} MantineThemePluginOptions
- */
-
-/**
- * @param {MantineThemePluginOptions} options
- */
-function mantineTheme(options) {
-	async function resolveBaseDir(result) {
-		const candidates = [];
-		const cwd = result.opts.cwd ?? process.cwd();
-
-		if (result.opts.from) {
-			let current = resolve(cwd, result.opts.from);
-			current = dirname(current);
-
-			while (true) {
-				candidates.push(current);
-				const parent = dirname(current);
-
-				if (parent === current) {
-					break;
-				}
-
-				current = parent;
-			}
-		}
-
-		candidates.push(cwd);
-
-		const dedupedCandidates = [...new Set(candidates)];
-
-		for (const baseDir of dedupedCandidates) {
-			try {
-				await access(resolve(baseDir, options.input));
-				return baseDir;
-			} catch {
-				// Try the next candidate directory.
-			}
-		}
-
-		return cwd;
-	}
-
-	return {
-		postcssPlugin: "tailwind-preset-mantine",
-		async Once(_, { result }) {
-			const baseDir = await resolveBaseDir(result);
-			const { dependencies } = await writeThemeOutput(options, {
-				baseDir,
-			});
-
-			for (const file of dependencies) {
-				result.messages.push({
-					type: "dependency",
-					plugin: "tailwind-preset-mantine",
-					file,
-					parent: result.opts.from,
-				});
-			}
-		},
-	};
-}
-
-mantineTheme.postcss = true;
+const mantineTheme = createMantineThemePostCSS(writeThemeOutput);
 
 export default mantineTheme;