@weapp-tailwindcss/postcss 3.1.0 → 3.1.2

package/dist/compat/web-css.d.ts

@@ -0,0 +1,7 @@
+import type { WebCssCompatFeatures, WebCssCompatUserOptions } from '../types';
+export interface NormalizedWebCssCompatOptions {
+    preset: 'off' | 'legacy-web';
+    features: Required<WebCssCompatFeatures>;
+}
+export declare function normalizeWebCssCompatOptions(options: WebCssCompatUserOptions | undefined): NormalizedWebCssCompatOptions;
+export declare function transformWebCssCompat(css: string, options: WebCssCompatUserOptions | undefined): string;

package/dist/generator-plugin/types.d.ts

@@ -1,4 +1,4 @@
-import type { IStyleHandlerOptions } from '../types';
+import type { IStyleHandlerOptions, WebCssCompatUserOptions } from '../types';
 export type WeappTailwindcssPostcssTarget = 'weapp' | 'web' | 'tailwind';
 export interface TailwindCandidateSource {
     content: string;
@@ -32,6 +32,7 @@ export interface WeappTailwindcssPostcssGeneratorUserOptions {
     target?: WeappTailwindcssPostcssTarget | undefined;
     config?: string | undefined;
     styleOptions?: Partial<IStyleHandlerOptions> | undefined;
+    webCompat?: WebCssCompatUserOptions | undefined;
     importFallback?: boolean | undefined;
     bareArbitraryValues?: unknown;
 }
@@ -39,6 +40,7 @@ export interface NormalizedWeappTailwindcssPostcssGeneratorOptions {
     target: WeappTailwindcssPostcssTarget;
     config?: string | undefined;
     styleOptions?: Partial<IStyleHandlerOptions> | undefined;
+    webCompat: WebCssCompatUserOptions | undefined;
     importFallback: boolean;
     bareArbitraryValues?: unknown;
 }

package/dist/index.d.ts

@@ -2,6 +2,7 @@ export { type DynamicColorMixAlphaProtection, type DynamicColorMixAlphaProtectio
 export { finalizeMiniProgramCss, hasMiniProgramCssSpecificityPlaceholders, hoistTailwindPreflightBase, pruneMiniProgramGeneratedCss, removeUnsupportedAtSupports, removeUnsupportedCascadeLayers, removeUnsupportedMiniProgramAtRules, stripMiniProgramCssSpecificityPlaceholders, } from './compat/mini-program-css';
 export { normalizeMiniProgramPrefixedDeclaration, removeUnsupportedMiniProgramPrefixedAtRule, } from './compat/mini-program-prefixes';
 export { convertTailwindcssRpxDeclarationsToRem, convertTailwindcssRpxDeclarationToRem, convertTailwindcssRpxValueToRem, normalizeTailwindcssRpxDeclaration, normalizeTailwindcssRpxDeclarations, normalizeTailwindcssWebRpxDeclarations, type TailwindcssRpxToRemOptions, } from './compat/tailwindcss-rpx';
+export { type NormalizedWebCssCompatOptions, normalizeWebCssCompatOptions, transformWebCssCompat, } from './compat/web-css';
 export { compileCssMacroConditionalComments, CSS_MACRO_STYLE_OPTIONS_MARKER, hasCssMacroStyleOptions, hasCssMacroTailwindV4Directive, transformCssMacroCss, withCssMacroStyleOptions, } from './css-macro/auto';
 export { CSS_MACRO_POSTCSS_PLUGIN_NAME, default as cssMacroPostcssPlugin } from './css-macro/postcss';
 export { createWeappTailwindcssPostcssPlugin } from './generator-plugin';

package/dist/index.js

@@ -12,8 +12,8 @@ node_path = require_html_transform.__toESM(node_path);
 let node_process = require("node:process");
 node_process = require_html_transform.__toESM(node_process);
 let node_fs_promises = require("node:fs/promises");
+let _tailwindcss_mangle_engine = require("@tailwindcss-mangle/engine");
 let tailwindcss_config = require("tailwindcss-config");
-let tailwindcss_patch = require("tailwindcss-patch");
 let node_fs = require("node:fs");
 let micromatch = require("micromatch");
 micromatch = require_html_transform.__toESM(micromatch);
@@ -8016,7 +8016,7 @@ function removeRootSpecificityPlaceholders(root) {
 function isEffectivelyEmptyContainer(container) {
 	return !container.nodes || container.nodes.every((node) => node.type === "comment");
 }
-function removeEmptyAtRules$1(root) {
+function removeEmptyAtRules$2(root) {
 	root.walkAtRules((atRule) => {
 		if (isEffectivelyEmptyContainer(atRule)) atRule.remove();
 	});
@@ -8185,7 +8185,7 @@ function finalizeMiniProgramCssRoot(root, options = {}) {
 	}));
 	const themeRule = collectThemeVariableRule(root, options);
 	insertHoistedRules(root, mergeEquivalentHoistedRules(themeRule ? [...preflightRules, themeRule] : preflightRules), hoistAnchor);
-	removeEmptyAtRules$1(root);
+	removeEmptyAtRules$2(root);
 }
 function hoistTailwindPreflightBase(css) {
 	try {
@@ -8437,6 +8437,110 @@ function normalizeTailwindcssWebRpxDeclarations(root, options) {
 	return normalized || converted;
 }
 //#endregion
+//#region src/compat/web-css.ts
+const disabledFeatures = {
+	theme: false,
+	layer: false,
+	property: false,
+	oklch: false,
+	colorFunctions: false,
+	supports: false
+};
+const legacyWebFeatures = {
+	theme: true,
+	layer: true,
+	property: true,
+	oklch: true,
+	colorFunctions: true,
+	supports: true
+};
+function normalizeWebCssCompatOptionsObject(options) {
+	const preset = options.preset ?? "legacy-web";
+	return {
+		preset,
+		features: {
+			...preset === "legacy-web" ? legacyWebFeatures : disabledFeatures,
+			...options.features
+		}
+	};
+}
+function normalizeWebCssCompatOptions(options) {
+	if (options === true) return normalizeWebCssCompatOptionsObject({ preset: "legacy-web" });
+	if (!options) return {
+		preset: "off",
+		features: disabledFeatures
+	};
+	return normalizeWebCssCompatOptionsObject(options);
+}
+function isWebCssCompatEnabled(options) {
+	return Object.values(options.features).some(Boolean);
+}
+function collectCustomPropertyValues(root) {
+	const values = /* @__PURE__ */ new Map();
+	root.walkDecls((decl) => {
+		if (decl.prop.startsWith("--")) values.set(decl.prop, decl.value.trim());
+	});
+	return values;
+}
+function removeRegisteredCustomProperties(root) {
+	root.walkAtRules("property", (atRule) => {
+		atRule.remove();
+	});
+}
+function unwrapThemeAtRules(root) {
+	root.walkAtRules("theme", (atRule) => {
+		if (atRule.nodes && atRule.nodes.length > 0) {
+			const rootNodes = [];
+			const hoistedNodes = [];
+			for (const node of atRule.nodes) if (node.type === "decl" || node.type === "comment") rootNodes.push(node.clone());
+			else hoistedNodes.push(node.clone());
+			const replacements = [...rootNodes.length > 0 ? [postcss.default.rule({
+				selector: ":root",
+				nodes: rootNodes
+			})] : [], ...hoistedNodes];
+			atRule.replaceWith(...replacements);
+		} else atRule.remove();
+	});
+}
+function normalizeModernColorDeclarations(root, features) {
+	if (!features.oklch && !features.colorFunctions) return;
+	const customPropertyValues = collectCustomPropertyValues(root);
+	root.walkDecls((decl) => {
+		const normalized = normalizeModernColorValue(decl.value, customPropertyValues);
+		if (!normalized.changed) return;
+		if (!features.colorFunctions && !/oklch|oklab/i.test(decl.value)) return;
+		decl.value = normalized.value;
+	});
+}
+function removeModernColorSupports(root) {
+	root.walkAtRules("supports", (atRule) => {
+		if (!/color-mix|oklch|oklab|lab|lch|display-p3/i.test(atRule.params)) return;
+		if (atRule.nodes && atRule.nodes.length > 0) atRule.replaceWith(...atRule.nodes);
+		else atRule.remove();
+	});
+}
+function removeEmptyAtRules$1(root) {
+	root.walkAtRules((atRule) => {
+		if (atRule.nodes && atRule.nodes.length === 0) atRule.remove();
+	});
+}
+function transformWebCssCompat(css, options) {
+	const normalized = normalizeWebCssCompatOptions(options);
+	if (!isWebCssCompatEnabled(normalized)) return css;
+	try {
+		const root = postcss.default.parse(css);
+		if (normalized.features.theme) unwrapThemeAtRules(root);
+		if (normalized.features.layer) removeUnsupportedCascadeLayers(root);
+		if (normalized.features.property) removeRegisteredCustomProperties(root);
+		if (normalized.features.supports) removeModernColorSupports(root);
+		normalizeModernColorDeclarations(root, normalized.features);
+		removeEmptyAtRules$1(root);
+		return root.toString();
+	} catch {
+		return css;
+	}
+}
+//#endregion
 //#region src/css-macro/auto.ts
 const CSS_MACRO_STYLE_OPTIONS_MARKER = "__weappTailwindcssCssMacroEnabled";
 const PLATFORM_ENV_KEYS$1 = [
@@ -9036,7 +9140,7 @@ async function expandTailwindSourceEntries(entries, options = {}) {
 			pattern: normalizeGlobPattern(pattern),
 			negated: true
 		}));
-		const matched = await (0, tailwindcss_patch.resolveProjectSourceFiles)({
+		const matched = await (0, _tailwindcss_mangle_engine.resolveProjectSourceFiles)({
 			cwd: base,
 			sources: group,
 			...ignoredSources === void 0 ? {} : { ignoredSources }
@@ -9095,7 +9199,7 @@ async function collectAutoTailwindCandidates(root, result, options) {
 		pattern: POSTCSS_SOURCE_PATTERN
 	});
 	sourceEntries.push(...await resolveCssSourceEntries(root, base, POSTCSS_SOURCE_PATTERN));
-	const candidates = sourceEntries.length === 0 ? [] : await (0, tailwindcss_patch.extractValidCandidates)({
+	const candidates = sourceEntries.length === 0 ? [] : await (0, _tailwindcss_mangle_engine.extractValidCandidates)({
 		base,
 		css: root.toString(),
 		cwd: projectRoot,
@@ -9192,7 +9296,8 @@ function createWeappTailwindcssPostcssPlugin(adapters) {
 					},
 					target: generatorOptions.target
 				});
-				replaceRootCss(root, isApplyOnlyTailwindV4Css ? filterApplyOnlyGeneratedCss(generated.css, rawCss) : generated.css, result);
+				const css = isApplyOnlyTailwindV4Css ? filterApplyOnlyGeneratedCss(generated.css, rawCss) : generated.css;
+				replaceRootCss(root, generated.target === "web" ? transformWebCssCompat(css, generatorOptions.webCompat) : css, result);
 				addDependencyMessages(result, generated);
 				addSourceDependencyMessages(result, collectedSources.files);
 				result.messages.push({
@@ -57092,6 +57197,7 @@ exports.normalizeModernColorValue = normalizeModernColorValue;
 exports.normalizeTailwindcssRpxDeclaration = normalizeTailwindcssRpxDeclaration;
 exports.normalizeTailwindcssRpxDeclarations = normalizeTailwindcssRpxDeclarations;
 exports.normalizeTailwindcssWebRpxDeclarations = normalizeTailwindcssWebRpxDeclarations;
+exports.normalizeWebCssCompatOptions = normalizeWebCssCompatOptions;
 Object.defineProperty(exports, "postcss", {
 	enumerable: true,
 	get: function() {
@@ -57109,6 +57215,7 @@ exports.removeUnsupportedMiniProgramPrefixedAtRule = removeUnsupportedMiniProgra
 exports.resolveFilteredPostcssConfig = resolveFilteredPostcssConfig;
 exports.stripMiniProgramCssSpecificityPlaceholders = stripMiniProgramCssSpecificityPlaceholders;
 exports.transformCssMacroCss = transformCssMacroCss;
+exports.transformWebCssCompat = transformWebCssCompat;
 Object.defineProperty(exports, "unitConversionComposeRules", {
 	enumerable: true,
 	get: function() {

package/dist/index.mjs

@@ -7,8 +7,8 @@ import valueParser from "postcss-value-parser";
 import path from "node:path";
 import process$1 from "node:process";
 import { readFile, stat } from "node:fs/promises";
+import { extractValidCandidates, resolveProjectSourceFiles } from "@tailwindcss-mangle/engine";
 import { loadConfig } from "tailwindcss-config";
-import { extractValidCandidates, resolveProjectSourceFiles } from "tailwindcss-patch";
 import { realpathSync } from "node:fs";
 import micromatch from "micromatch";
 import { defu, defuOverrideArray, regExpTest } from "@weapp-tailwindcss/shared";
@@ -8024,7 +8024,7 @@ function removeRootSpecificityPlaceholders(root) {
 function isEffectivelyEmptyContainer(container) {
 	return !container.nodes || container.nodes.every((node) => node.type === "comment");
 }
-function removeEmptyAtRules$1(root) {
+function removeEmptyAtRules$2(root) {
 	root.walkAtRules((atRule) => {
 		if (isEffectivelyEmptyContainer(atRule)) atRule.remove();
 	});
@@ -8193,7 +8193,7 @@ function finalizeMiniProgramCssRoot(root, options = {}) {
 	}));
 	const themeRule = collectThemeVariableRule(root, options);
 	insertHoistedRules(root, mergeEquivalentHoistedRules(themeRule ? [...preflightRules, themeRule] : preflightRules), hoistAnchor);
-	removeEmptyAtRules$1(root);
+	removeEmptyAtRules$2(root);
 }
 function hoistTailwindPreflightBase(css) {
 	try {
@@ -8445,6 +8445,110 @@ function normalizeTailwindcssWebRpxDeclarations(root, options) {
 	return normalized || converted;
 }
 //#endregion
+//#region src/compat/web-css.ts
+const disabledFeatures = {
+	theme: false,
+	layer: false,
+	property: false,
+	oklch: false,
+	colorFunctions: false,
+	supports: false
+};
+const legacyWebFeatures = {
+	theme: true,
+	layer: true,
+	property: true,
+	oklch: true,
+	colorFunctions: true,
+	supports: true
+};
+function normalizeWebCssCompatOptionsObject(options) {
+	const preset = options.preset ?? "legacy-web";
+	return {
+		preset,
+		features: {
+			...preset === "legacy-web" ? legacyWebFeatures : disabledFeatures,
+			...options.features
+		}
+	};
+}
+function normalizeWebCssCompatOptions(options) {
+	if (options === true) return normalizeWebCssCompatOptionsObject({ preset: "legacy-web" });
+	if (!options) return {
+		preset: "off",
+		features: disabledFeatures
+	};
+	return normalizeWebCssCompatOptionsObject(options);
+}
+function isWebCssCompatEnabled(options) {
+	return Object.values(options.features).some(Boolean);
+}
+function collectCustomPropertyValues(root) {
+	const values = /* @__PURE__ */ new Map();
+	root.walkDecls((decl) => {
+		if (decl.prop.startsWith("--")) values.set(decl.prop, decl.value.trim());
+	});
+	return values;
+}
+function removeRegisteredCustomProperties(root) {
+	root.walkAtRules("property", (atRule) => {
+		atRule.remove();
+	});
+}
+function unwrapThemeAtRules(root) {
+	root.walkAtRules("theme", (atRule) => {
+		if (atRule.nodes && atRule.nodes.length > 0) {
+			const rootNodes = [];
+			const hoistedNodes = [];
+			for (const node of atRule.nodes) if (node.type === "decl" || node.type === "comment") rootNodes.push(node.clone());
+			else hoistedNodes.push(node.clone());
+			const replacements = [...rootNodes.length > 0 ? [postcss$1.rule({
+				selector: ":root",
+				nodes: rootNodes
+			})] : [], ...hoistedNodes];
+			atRule.replaceWith(...replacements);
+		} else atRule.remove();
+	});
+}
+function normalizeModernColorDeclarations(root, features) {
+	if (!features.oklch && !features.colorFunctions) return;
+	const customPropertyValues = collectCustomPropertyValues(root);
+	root.walkDecls((decl) => {
+		const normalized = normalizeModernColorValue(decl.value, customPropertyValues);
+		if (!normalized.changed) return;
+		if (!features.colorFunctions && !/oklch|oklab/i.test(decl.value)) return;
+		decl.value = normalized.value;
+	});
+}
+function removeModernColorSupports(root) {
+	root.walkAtRules("supports", (atRule) => {
+		if (!/color-mix|oklch|oklab|lab|lch|display-p3/i.test(atRule.params)) return;
+		if (atRule.nodes && atRule.nodes.length > 0) atRule.replaceWith(...atRule.nodes);
+		else atRule.remove();
+	});
+}
+function removeEmptyAtRules$1(root) {
+	root.walkAtRules((atRule) => {
+		if (atRule.nodes && atRule.nodes.length === 0) atRule.remove();
+	});
+}
+function transformWebCssCompat(css, options) {
+	const normalized = normalizeWebCssCompatOptions(options);
+	if (!isWebCssCompatEnabled(normalized)) return css;
+	try {
+		const root = postcss$1.parse(css);
+		if (normalized.features.theme) unwrapThemeAtRules(root);
+		if (normalized.features.layer) removeUnsupportedCascadeLayers(root);
+		if (normalized.features.property) removeRegisteredCustomProperties(root);
+		if (normalized.features.supports) removeModernColorSupports(root);
+		normalizeModernColorDeclarations(root, normalized.features);
+		removeEmptyAtRules$1(root);
+		return root.toString();
+	} catch {
+		return css;
+	}
+}
+//#endregion
 //#region src/css-macro/auto.ts
 const CSS_MACRO_STYLE_OPTIONS_MARKER = "__weappTailwindcssCssMacroEnabled";
 const PLATFORM_ENV_KEYS$1 = [
@@ -9200,7 +9304,8 @@ function createWeappTailwindcssPostcssPlugin(adapters) {
 					},
 					target: generatorOptions.target
 				});
-				replaceRootCss(root, isApplyOnlyTailwindV4Css ? filterApplyOnlyGeneratedCss(generated.css, rawCss) : generated.css, result);
+				const css = isApplyOnlyTailwindV4Css ? filterApplyOnlyGeneratedCss(generated.css, rawCss) : generated.css;
+				replaceRootCss(root, generated.target === "web" ? transformWebCssCompat(css, generatorOptions.webCompat) : css, result);
 				addDependencyMessages(result, generated);
 				addSourceDependencyMessages(result, collectedSources.files);
 				result.messages.push({
@@ -57053,4 +57158,4 @@ function containsCssAfterMinify(baseCss, css) {
 	return ruleKeys.size > 0 && [...ruleKeys].every((key) => baseRuleKeys.has(key));
 }
 //#endregion
-export { CSS_MACRO_POSTCSS_PLUGIN_NAME, CSS_MACRO_STYLE_OPTIONS_MARKER, compileCssMacroConditionalComments, containsCssAfterMinify, convertTailwindcssRpxDeclarationToRem, convertTailwindcssRpxDeclarationsToRem, convertTailwindcssRpxValueToRem, createFallbackPlaceholderReplacer, createInjectPreflight, createStyleHandler, createStylePipeline, createWeappTailwindcssPostcssPlugin, creator as cssMacroPostcssPlugin, filterExistingCssRules, finalizeMiniProgramCss, getPostcssPluginName, hasCssMacroStyleOptions, hasCssMacroTailwindV4Directive, hasMiniProgramCssSpecificityPlaceholders, hoistTailwindPreflightBase, internalCssSelectorReplacer, mergeCoveredCssRuleDeclarations, mergeMiniProgramPreflightRuleDeclarations, mergeMiniProgramThemeScopeRuleDeclarations, normalizeMiniProgramPrefixedDeclaration, normalizeModernColorValue, normalizeTailwindcssRpxDeclaration, normalizeTailwindcssRpxDeclarations, normalizeTailwindcssWebRpxDeclarations, postcss, postcssHtmlTransform, protectDynamicColorMixAlpha, pruneMiniProgramGeneratedCss, removeTailwindPostcssPlugins, removeUnsupportedAtSupports, removeUnsupportedCascadeLayers, removeUnsupportedMiniProgramAtRules, removeUnsupportedMiniProgramPrefixedAtRule, resolveFilteredPostcssConfig, stripMiniProgramCssSpecificityPlaceholders, transformCssMacroCss, unitConversionComposeRules, unitConversionPresets, withCssMacroStyleOptions };
+export { CSS_MACRO_POSTCSS_PLUGIN_NAME, CSS_MACRO_STYLE_OPTIONS_MARKER, compileCssMacroConditionalComments, containsCssAfterMinify, convertTailwindcssRpxDeclarationToRem, convertTailwindcssRpxDeclarationsToRem, convertTailwindcssRpxValueToRem, createFallbackPlaceholderReplacer, createInjectPreflight, createStyleHandler, createStylePipeline, createWeappTailwindcssPostcssPlugin, creator as cssMacroPostcssPlugin, filterExistingCssRules, finalizeMiniProgramCss, getPostcssPluginName, hasCssMacroStyleOptions, hasCssMacroTailwindV4Directive, hasMiniProgramCssSpecificityPlaceholders, hoistTailwindPreflightBase, internalCssSelectorReplacer, mergeCoveredCssRuleDeclarations, mergeMiniProgramPreflightRuleDeclarations, mergeMiniProgramThemeScopeRuleDeclarations, normalizeMiniProgramPrefixedDeclaration, normalizeModernColorValue, normalizeTailwindcssRpxDeclaration, normalizeTailwindcssRpxDeclarations, normalizeTailwindcssWebRpxDeclarations, normalizeWebCssCompatOptions, postcss, postcssHtmlTransform, protectDynamicColorMixAlpha, pruneMiniProgramGeneratedCss, removeTailwindPostcssPlugins, removeUnsupportedAtSupports, removeUnsupportedCascadeLayers, removeUnsupportedMiniProgramAtRules, removeUnsupportedMiniProgramPrefixedAtRule, resolveFilteredPostcssConfig, stripMiniProgramCssSpecificityPlaceholders, transformCssMacroCss, transformWebCssCompat, unitConversionComposeRules, unitConversionPresets, withCssMacroStyleOptions };

package/dist/types.d.ts

@@ -62,6 +62,20 @@ export interface CssAtRules {
     supports?: boolean | undefined;
     media?: boolean | undefined;
 }
+export type WebCssCompatPreset = 'off' | 'legacy-web';
+export interface WebCssCompatFeatures {
+    theme?: boolean | undefined;
+    layer?: boolean | undefined;
+    property?: boolean | undefined;
+    oklch?: boolean | undefined;
+    colorFunctions?: boolean | undefined;
+    supports?: boolean | undefined;
+}
+export interface WebCssCompatOptions {
+    preset?: WebCssCompatPreset | undefined;
+    features?: WebCssCompatFeatures | undefined;
+}
+export type WebCssCompatUserOptions = boolean | WebCssCompatOptions;
 export interface CssOptions {
     cssPreflight?: CssPreflightOptions | undefined;
     cssPreflightRange?: 'all' | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weapp-tailwindcss/postcss",
-  "version": "3.1.0",
+  "version": "3.1.2",
   "description": "@weapp-tailwindcss/postcss",
   "author": "ice breaker <1324318532@qq.com>",
   "license": "MIT",
@@ -64,8 +64,9 @@
     "node": "^20.19.0 || >=22.12.0"
   },
   "dependencies": {
+    "@tailwindcss-mangle/engine": "0.1.1",
     "@weapp-core/escape": "~8.0.0",
-    "autoprefixer": "^10.5.0",
+    "autoprefixer": "^10.5.2",
     "lru-cache": "11.5.1",
     "micromatch": "^4.0.8",
     "postcss": "^8.5.15",
@@ -75,10 +76,9 @@
     "postcss-rule-unit-converter": "^0.2.2",
     "postcss-selector-parser": "~7.1.4",
     "postcss-value-parser": "^4.2.0",
-    "tailwindcss-patch": "9.5.0",
     "@weapp-tailwindcss/postcss-calc": "^1.0.2",
-    "tailwindcss-config": "2.0.0",
-    "@weapp-tailwindcss/shared": "2.0.0"
+    "@weapp-tailwindcss/shared": "2.0.0",
+    "tailwindcss-config": "2.0.0"
   },
   "devDependencies": {
     "@csstools/css-color-parser": "^4.1.8",