@flairjs/webpack-loader 0.0.1-beta.1

package/dist/cjs/index.js

@@ -0,0 +1,223 @@
+//#region rolldown:runtime
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+	if (from && typeof from === "object" || typeof from === "function") for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+		key = keys[i];
+		if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+			get: ((k) => from[k]).bind(null, key),
+			enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+		});
+	}
+	return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+	value: mod,
+	enumerable: true
+}) : target, mod));
+
+//#endregion
+let node_module = require("node:module");
+node_module = __toESM(node_module);
+let node_fs = require("node:fs");
+node_fs = __toESM(node_fs);
+let node_fs_promises = require("node:fs/promises");
+node_fs_promises = __toESM(node_fs_promises);
+let node_path = require("node:path");
+node_path = __toESM(node_path);
+let esbuild = require("esbuild");
+esbuild = __toESM(esbuild);
+let fs = require("fs");
+fs = __toESM(fs);
+let node_url = require("node:url");
+node_url = __toESM(node_url);
+let path = require("path");
+path = __toESM(path);
+let url = require("url");
+url = __toESM(url);
+let picomatch = require("picomatch");
+picomatch = __toESM(picomatch);
+let __flairjs_core = require("@flairjs/core");
+__flairjs_core = __toESM(__flairjs_core);
+
+//#region ../shared/dist/esm/index.js
+String.raw;
+const buildThemeTokens = (theme, themeName) => {
+	let css$1 = "";
+	const { tokens, selector } = theme;
+	if (typeof selector === "string") css$1 += `${selector} {\n`;
+	css$1 += tokensToCSSVars(tokens, theme.prefix ? [theme.prefix] : []);
+	if (typeof selector === "string") css$1 += `}\n`;
+	else css$1 = selector(css$1, themeName);
+	Object.entries(theme.themes ?? {}).forEach(([name, themeConfig]) => {
+		css$1 += buildThemeTokens({
+			prefix: theme.prefix,
+			selector: theme.selector,
+			...themeConfig
+		}, name);
+	});
+	return css$1;
+};
+function tokensToCSSVars(tokens, prefix = []) {
+	let css$1 = "";
+	for (const [key, value] of Object.entries(tokens)) {
+		const newPrefix = [...prefix, key];
+		if (typeof value === "string" || typeof value === "number") css$1 += `--${newPrefix.join("-")}: ${value};\n`;
+		else if (typeof value === "object" && value !== null) css$1 += tokensToCSSVars(value, newPrefix);
+	}
+	return css$1;
+}
+const __dirname$1 = (0, node_path.dirname)((0, node_url.fileURLToPath)(require("url").pathToFileURL(__filename).href));
+const getUserTheme = async () => {
+	try {
+		let userThemeFilePath = path.default.resolve(process.cwd(), "flair.theme.ts");
+		if (!(0, fs.existsSync)(userThemeFilePath)) userThemeFilePath = path.default.resolve(process.cwd(), "flair.theme.js");
+		if (!(0, fs.existsSync)(userThemeFilePath)) return null;
+		const outFile = path.default.resolve(__dirname$1, `flair.theme.js`);
+		await esbuild.build({
+			entryPoints: [userThemeFilePath],
+			outfile: outFile,
+			platform: "node",
+			bundle: true,
+			format: "esm",
+			external: ["*"]
+		});
+		const cacheBuster = Date.now();
+		const userTheme = await import(`${(0, url.pathToFileURL)(outFile).href}?update=${cacheBuster}`);
+		if (userTheme.default) return {
+			theme: userTheme.default,
+			originalPath: userThemeFilePath
+		};
+		return null;
+	} catch (error) {
+		console.error("Error loading user theme:", error);
+		return null;
+	}
+};
+const require$1 = node_module.default.createRequire(require("url").pathToFileURL(__filename).href);
+/**
+* Initialize the shared plugin context
+*/
+async function initializeSharedContext(options = {}) {
+	const { buildThemeFile } = options;
+	const fileNameToGeneratedCssNameMap = /* @__PURE__ */ new Map();
+	const flairThemeFile = require$1.resolve("@flairjs/client/theme.css");
+	const flairGeneratedCssDir = node_path.default.resolve(flairThemeFile, "../generated-css");
+	if (!(0, node_fs.existsSync)(flairGeneratedCssDir)) await (0, node_fs_promises.mkdir)(flairGeneratedCssDir);
+	else {
+		await (0, node_fs_promises.rm)(flairGeneratedCssDir, {
+			recursive: true,
+			force: true
+		});
+		await (0, node_fs_promises.mkdir)(flairGeneratedCssDir);
+	}
+	let userTheme = await getUserTheme();
+	const buildThemeCSS = buildThemeFile ?? buildThemeTokens;
+	if (userTheme) {
+		const themeCSS = buildThemeCSS(userTheme.theme);
+		await (0, node_fs_promises.writeFile)(flairThemeFile, themeCSS, "utf-8");
+		(0, node_fs.watch)(userTheme.originalPath, async () => {
+			userTheme = await getUserTheme();
+			if (!userTheme) return;
+			const themeCSS$1 = buildThemeCSS(userTheme.theme);
+			await (0, node_fs_promises.writeFile)(flairThemeFile, themeCSS$1, "utf-8");
+		});
+	}
+	const refreshCssFile = (filePath) => {
+		if (fileNameToGeneratedCssNameMap.has(filePath)) {
+			const previousGeneratedCssName = fileNameToGeneratedCssNameMap.get(filePath);
+			setTimeout(() => {
+				(0, node_fs_promises.rm)(node_path.default.join(flairGeneratedCssDir, previousGeneratedCssName));
+			}, 2e3);
+		}
+	};
+	return {
+		flairThemeFile,
+		flairGeneratedCssDir,
+		userTheme,
+		buildThemeCSS,
+		refreshCssFile
+	};
+}
+function shouldProcessFile(id, include, exclude) {
+	const isIncluded = (0, picomatch.default)(include || ["**/*.{js,ts,jsx,tsx}"]);
+	const isExcluded = (0, picomatch.default)(exclude || ["node_modules/**"]);
+	if (!isIncluded(id)) return false;
+	if (isExcluded(id)) return false;
+	return true;
+}
+const colors = {
+	reset: "\x1B[0m",
+	fg: {
+		red: "\x1B[31m",
+		yellow: "\x1B[33m",
+		blue: "\x1B[34m",
+		white: "\x1B[37m"
+	},
+	bg: {
+		red: "\x1B[41m",
+		yellow: "\x1B[43m",
+		blue: "\x1B[44m"
+	}
+};
+const logger = {
+	error: (msg) => {
+		console.log(`${colors.bg.red}${colors.fg.white}[flairjs/Error]${colors.reset} ${colors.fg.red}${msg}${colors.reset}`);
+	},
+	warn: (msg) => {
+		console.log(`${colors.bg.yellow}${colors.fg.white}[flairjs/Warning]${colors.reset} ${msg}${colors.reset}`);
+	},
+	info: (msg) => {
+		console.log(`${colors.bg.blue}${colors.fg.white}[flairjs/Info]${colors.reset} ${msg}${colors.reset}`);
+	}
+};
+const transformCode = (code, filePath, options) => {
+	const result = (0, __flairjs_core.transformCode)(code, filePath, {
+		cssOutDir: options.cssOutDir,
+		classNameList: options.classNameList,
+		useTheme: options.useTheme,
+		theme: options.theme,
+		appendTimestampToCssFile: options.appendTimestampToCssFile
+	}, options.cssPreprocessor);
+	(result?.logs ?? []).forEach((log) => {
+		if (logger[log.level]) logger[log.level](log.message);
+	});
+	return result;
+};
+
+//#endregion
+//#region src/index.ts
+async function flairJsLoader(source, sourceMap) {
+	const callback = this.async();
+	if (!callback) {
+		console.error("@flairjs/webpack-loader requires async support");
+		return;
+	}
+	const options = this.getOptions() || {};
+	const context = await initializeSharedContext(options);
+	const fileName = this.resourcePath;
+	if (!shouldProcessFile(fileName, options?.include, options?.exclude)) return callback(null, source, sourceMap);
+	try {
+		const result = transformCode(source, fileName, {
+			appendTimestampToCssFile: true,
+			classNameList: options?.classNameList,
+			cssPreprocessor: options?.cssPreprocessor ? (css) => options.cssPreprocessor(css, fileName) : void 0,
+			theme: context.userTheme?.theme,
+			useTheme: !!context.userTheme,
+			cssOutDir: context.flairGeneratedCssDir
+		});
+		if (!result) return callback(null, source, sourceMap);
+		if (result.generatedCssName) context.refreshCssFile(result.generatedCssName);
+		callback(null, result.code, result.sourcemap ? JSON.parse(result.sourcemap ?? "{}") : sourceMap);
+	} catch (error) {
+		console.error("[@flairjs/webpack-loader]", error);
+		callback(error, source, sourceMap);
+	}
+}
+
+//#endregion
+module.exports = flairJsLoader;

package/dist/esm/index.js

@@ -0,0 +1,189 @@
+import module from "node:module";
+import { existsSync, watch } from "node:fs";
+import { mkdir, rm, writeFile } from "node:fs/promises";
+import path, { dirname } from "node:path";
+import * as esbuild from "esbuild";
+import { existsSync as existsSync$1 } from "fs";
+import { fileURLToPath } from "node:url";
+import path$1 from "path";
+import { pathToFileURL } from "url";
+import picomatch from "picomatch";
+import { transformCode } from "@flairjs/core";
+
+//#region ../shared/dist/esm/index.js
+String.raw;
+const buildThemeTokens = (theme, themeName) => {
+	let css$1 = "";
+	const { tokens, selector } = theme;
+	if (typeof selector === "string") css$1 += `${selector} {\n`;
+	css$1 += tokensToCSSVars(tokens, theme.prefix ? [theme.prefix] : []);
+	if (typeof selector === "string") css$1 += `}\n`;
+	else css$1 = selector(css$1, themeName);
+	Object.entries(theme.themes ?? {}).forEach(([name, themeConfig]) => {
+		css$1 += buildThemeTokens({
+			prefix: theme.prefix,
+			selector: theme.selector,
+			...themeConfig
+		}, name);
+	});
+	return css$1;
+};
+function tokensToCSSVars(tokens, prefix = []) {
+	let css$1 = "";
+	for (const [key, value] of Object.entries(tokens)) {
+		const newPrefix = [...prefix, key];
+		if (typeof value === "string" || typeof value === "number") css$1 += `--${newPrefix.join("-")}: ${value};\n`;
+		else if (typeof value === "object" && value !== null) css$1 += tokensToCSSVars(value, newPrefix);
+	}
+	return css$1;
+}
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const getUserTheme = async () => {
+	try {
+		let userThemeFilePath = path$1.resolve(process.cwd(), "flair.theme.ts");
+		if (!existsSync$1(userThemeFilePath)) userThemeFilePath = path$1.resolve(process.cwd(), "flair.theme.js");
+		if (!existsSync$1(userThemeFilePath)) return null;
+		const outFile = path$1.resolve(__dirname, `flair.theme.js`);
+		await esbuild.build({
+			entryPoints: [userThemeFilePath],
+			outfile: outFile,
+			platform: "node",
+			bundle: true,
+			format: "esm",
+			external: ["*"]
+		});
+		const cacheBuster = Date.now();
+		const userTheme = await import(`${pathToFileURL(outFile).href}?update=${cacheBuster}`);
+		if (userTheme.default) return {
+			theme: userTheme.default,
+			originalPath: userThemeFilePath
+		};
+		return null;
+	} catch (error) {
+		console.error("Error loading user theme:", error);
+		return null;
+	}
+};
+const require = module.createRequire(import.meta.url);
+/**
+* Initialize the shared plugin context
+*/
+async function initializeSharedContext(options = {}) {
+	const { buildThemeFile } = options;
+	const fileNameToGeneratedCssNameMap = /* @__PURE__ */ new Map();
+	const flairThemeFile = require.resolve("@flairjs/client/theme.css");
+	const flairGeneratedCssDir = path.resolve(flairThemeFile, "../generated-css");
+	if (!existsSync(flairGeneratedCssDir)) await mkdir(flairGeneratedCssDir);
+	else {
+		await rm(flairGeneratedCssDir, {
+			recursive: true,
+			force: true
+		});
+		await mkdir(flairGeneratedCssDir);
+	}
+	let userTheme = await getUserTheme();
+	const buildThemeCSS = buildThemeFile ?? buildThemeTokens;
+	if (userTheme) {
+		const themeCSS = buildThemeCSS(userTheme.theme);
+		await writeFile(flairThemeFile, themeCSS, "utf-8");
+		watch(userTheme.originalPath, async () => {
+			userTheme = await getUserTheme();
+			if (!userTheme) return;
+			const themeCSS$1 = buildThemeCSS(userTheme.theme);
+			await writeFile(flairThemeFile, themeCSS$1, "utf-8");
+		});
+	}
+	const refreshCssFile = (filePath) => {
+		if (fileNameToGeneratedCssNameMap.has(filePath)) {
+			const previousGeneratedCssName = fileNameToGeneratedCssNameMap.get(filePath);
+			setTimeout(() => {
+				rm(path.join(flairGeneratedCssDir, previousGeneratedCssName));
+			}, 2e3);
+		}
+	};
+	return {
+		flairThemeFile,
+		flairGeneratedCssDir,
+		userTheme,
+		buildThemeCSS,
+		refreshCssFile
+	};
+}
+function shouldProcessFile(id, include, exclude) {
+	const isIncluded = picomatch(include || ["**/*.{js,ts,jsx,tsx}"]);
+	const isExcluded = picomatch(exclude || ["node_modules/**"]);
+	if (!isIncluded(id)) return false;
+	if (isExcluded(id)) return false;
+	return true;
+}
+const colors = {
+	reset: "\x1B[0m",
+	fg: {
+		red: "\x1B[31m",
+		yellow: "\x1B[33m",
+		blue: "\x1B[34m",
+		white: "\x1B[37m"
+	},
+	bg: {
+		red: "\x1B[41m",
+		yellow: "\x1B[43m",
+		blue: "\x1B[44m"
+	}
+};
+const logger = {
+	error: (msg) => {
+		console.log(`${colors.bg.red}${colors.fg.white}[flairjs/Error]${colors.reset} ${colors.fg.red}${msg}${colors.reset}`);
+	},
+	warn: (msg) => {
+		console.log(`${colors.bg.yellow}${colors.fg.white}[flairjs/Warning]${colors.reset} ${msg}${colors.reset}`);
+	},
+	info: (msg) => {
+		console.log(`${colors.bg.blue}${colors.fg.white}[flairjs/Info]${colors.reset} ${msg}${colors.reset}`);
+	}
+};
+const transformCode$1 = (code, filePath, options) => {
+	const result = transformCode(code, filePath, {
+		cssOutDir: options.cssOutDir,
+		classNameList: options.classNameList,
+		useTheme: options.useTheme,
+		theme: options.theme,
+		appendTimestampToCssFile: options.appendTimestampToCssFile
+	}, options.cssPreprocessor);
+	(result?.logs ?? []).forEach((log) => {
+		if (logger[log.level]) logger[log.level](log.message);
+	});
+	return result;
+};
+
+//#endregion
+//#region src/index.ts
+async function flairJsLoader(source, sourceMap) {
+	const callback = this.async();
+	if (!callback) {
+		console.error("@flairjs/webpack-loader requires async support");
+		return;
+	}
+	const options = this.getOptions() || {};
+	const context = await initializeSharedContext(options);
+	const fileName = this.resourcePath;
+	if (!shouldProcessFile(fileName, options?.include, options?.exclude)) return callback(null, source, sourceMap);
+	try {
+		const result = transformCode$1(source, fileName, {
+			appendTimestampToCssFile: true,
+			classNameList: options?.classNameList,
+			cssPreprocessor: options?.cssPreprocessor ? (css) => options.cssPreprocessor(css, fileName) : void 0,
+			theme: context.userTheme?.theme,
+			useTheme: !!context.userTheme,
+			cssOutDir: context.flairGeneratedCssDir
+		});
+		if (!result) return callback(null, source, sourceMap);
+		if (result.generatedCssName) context.refreshCssFile(result.generatedCssName);
+		callback(null, result.code, result.sourcemap ? JSON.parse(result.sourcemap ?? "{}") : sourceMap);
+	} catch (error) {
+		console.error("[@flairjs/webpack-loader]", error);
+		callback(error, source, sourceMap);
+	}
+}
+
+//#endregion
+export { flairJsLoader as default };

package/dist/types/index.d.ts

@@ -0,0 +1,6 @@
+import { SharedPluginOptions } from "@flairjs/bundler-shared";
+import { LoaderContext } from "webpack";
+interface FlairJsWebpackLoaderOptions extends SharedPluginOptions {
+}
+export default function flairJsLoader(this: LoaderContext<FlairJsWebpackLoaderOptions>, source: string, sourceMap: string): Promise<void>;
+export {};