@weapp-tailwindcss/postcss 3.3.4 → 3.3.6

package/dist/native.cjs

@@ -0,0 +1,425 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_rolldown_runtime = require("./rolldown-runtime-VH7oDXx4.cjs");
+let postcss = require("postcss");
+postcss = require_rolldown_runtime.__toESM(postcss, 1);
+//#region src/compat/native/properties.ts
+const COLOR_PROPERTIES = /* @__PURE__ */ new Set([
+	"color",
+	"backgroundColor",
+	"borderColor",
+	"borderTopColor",
+	"borderRightColor",
+	"borderBottomColor",
+	"borderLeftColor",
+	"shadowColor",
+	"textDecorationColor"
+]);
+const NUMERIC_PROPERTIES = /* @__PURE__ */ new Set([
+	"aspectRatio",
+	"borderBottomWidth",
+	"borderLeftWidth",
+	"borderRadius",
+	"borderRightWidth",
+	"borderTopLeftRadius",
+	"borderTopRightRadius",
+	"borderTopWidth",
+	"borderWidth",
+	"bottom",
+	"elevation",
+	"flex",
+	"flexBasis",
+	"flexGrow",
+	"flexShrink",
+	"fontSize",
+	"gap",
+	"height",
+	"left",
+	"letterSpacing",
+	"lineHeight",
+	"margin",
+	"marginBottom",
+	"marginHorizontal",
+	"marginLeft",
+	"marginRight",
+	"marginTop",
+	"marginVertical",
+	"maxHeight",
+	"maxWidth",
+	"minHeight",
+	"minWidth",
+	"opacity",
+	"padding",
+	"paddingBottom",
+	"paddingHorizontal",
+	"paddingLeft",
+	"paddingRight",
+	"paddingTop",
+	"paddingVertical",
+	"right",
+	"top",
+	"width",
+	"zIndex"
+]);
+const STRING_PROPERTIES = /* @__PURE__ */ new Set([
+	"alignContent",
+	"alignItems",
+	"alignSelf",
+	"borderStyle",
+	"direction",
+	"display",
+	"flexDirection",
+	"flexWrap",
+	"fontFamily",
+	"fontStyle",
+	"fontWeight",
+	"justifyContent",
+	"overflow",
+	"position",
+	"textAlign",
+	"textDecorationLine",
+	"textDecorationStyle",
+	"textTransform",
+	"writingDirection"
+]);
+const SHORTHANDS = {
+	margin: [
+		"marginTop",
+		"marginRight",
+		"marginBottom",
+		"marginLeft"
+	],
+	padding: [
+		"paddingTop",
+		"paddingRight",
+		"paddingBottom",
+		"paddingLeft"
+	]
+};
+const UNSUPPORTED_PROPERTIES = /* @__PURE__ */ new Set([
+	"filter",
+	"backdropFilter",
+	"animation",
+	"transition",
+	"textShadow",
+	"backgroundImage",
+	"appearance",
+	"content",
+	"cursor",
+	"userSelect",
+	"whiteSpace",
+	"objectFit",
+	"listStyleType",
+	"outline"
+]);
+function propertyName(property) {
+	return {
+		"padding-inline": "paddingHorizontal",
+		"padding-inline-start": "paddingLeft",
+		"padding-inline-end": "paddingRight",
+		"padding-block": "paddingVertical",
+		"padding-block-start": "paddingTop",
+		"padding-block-end": "paddingBottom",
+		"margin-inline": "marginHorizontal",
+		"margin-inline-start": "marginLeft",
+		"margin-inline-end": "marginRight",
+		"margin-block": "marginVertical",
+		"margin-block-start": "marginTop",
+		"margin-block-end": "marginBottom"
+	}[property] ?? property.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
+}
+function splitValue(value) {
+	return value.trim().split(/\s+/).filter(Boolean);
+}
+function parseNumber(value, variables) {
+	const resolved = resolveVariables(value, variables);
+	const fraction = resolved.match(/^(-?(?:\d+\.\d+|\d+|\.\d+))\s*\/\s*(-?(?:\d+\.\d+|\d+|\.\d+))$/);
+	if (fraction && Number(fraction[2]) !== 0) return Number(fraction[1]) / Number(fraction[2]);
+	const calculated = resolved.match(/^calc\(\s*(-?(?:\d+\.\d+|\d+|\.\d+))(px|rem|em|%)?\s*\*\s*(-?(?:\d+\.\d+|\d+|\.\d+))\s*\)$/);
+	if (calculated) {
+		const base = parseNumber(`${calculated[1]}${calculated[2] ?? ""}`, variables);
+		return typeof base === "number" ? base * Number(calculated[3]) : void 0;
+	}
+	const match = resolved.match(/^(-?(?:\d+\.\d+|\d+|\.\d+))(px|rem|em|%)?$/);
+	if (!match) return;
+	const number = Number(match[1]);
+	if (match[2] === "%") return `${number}%`;
+	if (match[2] === "rem" || match[2] === "em") return number * 16;
+	return number;
+}
+function resolveVariables(value, variables) {
+	return value.replace(/var\((--[\w-]+)(?:,\s*([^)]*))?\)/g, (_, key, fallback) => variables[key] ?? fallback ?? `var(${key})`);
+}
+function isColor(value) {
+	return /^(?:#[\da-f]{3,8}|(?:rgb|rgba|hsl|hsla|oklch|oklab)\([^)]*\)|[a-z]+)$/i.test(value);
+}
+function oklchToHex(value) {
+	const match = value.match(/^oklch\(\s*([\d.]+)%?\s+([\d.]+)\s+([\d.]+)(?:\s+\/\s*([\d.]+))?\s*\)$/i);
+	if (!match) return;
+	const lightness = Number(match[1]) > 1 ? Number(match[1]) / 100 : Number(match[1]);
+	const chroma = Number(match[2]);
+	const hue = Number(match[3]) * Math.PI / 180;
+	const alpha = match[4] === void 0 ? 1 : Number(match[4]);
+	const a = chroma * Math.cos(hue);
+	const b = chroma * Math.sin(hue);
+	const l = lightness + .3963377774 * a + .2158037573 * b;
+	const m = lightness - .1055613458 * a - .0638541728 * b;
+	const s = lightness - .0894841775 * a - 1.291485548 * b;
+	const linear = (channel) => channel ** 3;
+	const red = 4.0767416621 * linear(l) - 3.3077115913 * linear(m) + .2309699292 * linear(s);
+	const green = -1.2684380046 * linear(l) + 2.6097574011 * linear(m) - .3413193965 * linear(s);
+	const blue = -.0041960863 * linear(l) - .7034186147 * linear(m) + 1.707614701 * linear(s);
+	const toByte = (channel) => Math.round(Math.max(0, Math.min(1, channel <= .0031308 ? 12.92 * channel : 1.055 * channel ** (1 / 2.4) - .055)) * 255);
+	const hex = [
+		red,
+		green,
+		blue
+	].map((channel) => toByte(channel).toString(16).padStart(2, "0")).join("");
+	return alpha < 1 ? `#${hex}${Math.round(alpha * 255).toString(16).padStart(2, "0")}` : `#${hex}`;
+}
+function normalizeColor(value) {
+	return /^oklch\(/i.test(value) ? oklchToHex(value) : value;
+}
+function parseTransform(value, variables) {
+	const transform = [];
+	for (const match of value.matchAll(/(translateX|translateY|translate|scaleX|scaleY|scale|rotate|skewX|skewY)\(([^)]*)\)/g)) {
+		const name = match[1];
+		const values = splitValue(resolveVariables(match[2] ?? "", variables).replace(",", " "));
+		if (!name || !values.length) continue;
+		if (name.startsWith("scale")) {
+			const number = Number(values[0] ?? "");
+			if (Number.isFinite(number)) transform.push({ [name]: number });
+			continue;
+		}
+		if (name === "translate") {
+			const x = parseNumber(values[0] ?? "", variables);
+			const y = parseNumber(values[1] ?? "0", variables);
+			if (x !== void 0 && y !== void 0) transform.push({ translateX: x }, { translateY: y });
+			continue;
+		}
+		const property = name.replace(/^translate$/, "translateX");
+		const parsed = name.startsWith("rotate") || name.startsWith("skew") ? values[0] : parseNumber(values[0] ?? "", variables);
+		if (parsed !== void 0) transform.push({ [property]: parsed });
+	}
+	return transform.length ? transform : void 0;
+}
+function parseShadow(value, variables) {
+	const resolved = resolveVariables(value, variables);
+	const color = resolved.match(/(?:rgba?|hsla?)\([^)]*\)|#[\da-f]{3,8}/i)?.[0];
+	const parts = splitValue(color ? resolved.replace(color, "") : resolved);
+	const lengths = parts.filter((part) => parseNumber(part, variables) !== void 0).slice(0, 3);
+	if (lengths.length < 2) return;
+	const [x = "0", y = "0", blur = "0"] = lengths;
+	const shadowColor = normalizeColor(color ?? parts.find((part) => isColor(part)) ?? "#000000") ?? "#000000";
+	const opacity = /rgba\([^,]+,[^,]+,[^,]+,\s*([\d.]+)\)/i.exec(shadowColor)?.[1];
+	return {
+		shadowOffset: {
+			width: parseNumber(x, variables),
+			height: parseNumber(y, variables)
+		},
+		shadowRadius: parseNumber(blur, variables),
+		shadowColor,
+		...opacity ? { shadowOpacity: Number(opacity) } : {}
+	};
+}
+function parseValue(property, value, variables) {
+	const trimmed = value.trim();
+	if (UNSUPPORTED_PROPERTIES.has(property)) return;
+	if (trimmed.includes("linear-gradient(") || trimmed.includes("url(")) return;
+	if (COLOR_PROPERTIES.has(property)) {
+		const color = resolveVariables(trimmed, variables);
+		return isColor(color) ? normalizeColor(color) : void 0;
+	}
+	if (NUMERIC_PROPERTIES.has(property)) {
+		const number = parseNumber(trimmed, variables);
+		if (property === "opacity" && typeof number === "string" && number.endsWith("%")) return Number.parseFloat(number) / 100;
+		return number;
+	}
+	if (property === "transform") return parseTransform(trimmed, variables);
+	if (property === "boxShadow") return parseShadow(trimmed, variables);
+	if (property === "display" && !["flex", "none"].includes(trimmed)) return;
+	return STRING_PROPERTIES.has(property) ? trimmed : void 0;
+}
+function expandDeclaration(property, value, variables) {
+	if (property === "margin" || property === "padding") {
+		const parts = splitValue(value).map((item) => parseNumber(item, variables));
+		if (parts.includes(void 0)) return;
+		const [top, right = top, bottom = top, left = right] = parts;
+		return Object.fromEntries(SHORTHANDS[property].map((key, index) => [key, [
+			top,
+			right,
+			bottom,
+			left
+		][index]]));
+	}
+	if (property === "border") {
+		const width = splitValue(value).find((item) => /^\d/.test(item));
+		const color = splitValue(value).find((item) => isColor(item));
+		return {
+			...width ? { borderWidth: parseNumber(width, variables) } : {},
+			...color ? { borderColor: color } : {}
+		};
+	}
+	if (property === "boxShadow") return parseShadow(value, variables);
+	const parsed = parseValue(property, value, variables);
+	return parsed === void 0 ? void 0 : { [property]: parsed };
+}
+//#endregion
+//#region src/compat/native/selectors.ts
+const CLASS_SELECTOR_RE = /\.((?:\\.|[^\s.#:[>+~])+)/g;
+function decodeCssIdentifier(value) {
+	return value.replace(/\\([0-9a-f]{1,6})\s?/gi, (_, code) => String.fromCodePoint(Number.parseInt(code, 16))).replace(/\\(.)/g, "$1");
+}
+function splitClassName(className) {
+	const parts = [];
+	let current = "";
+	let bracketDepth = 0;
+	let escaped = false;
+	for (const character of className) {
+		if (escaped) {
+			current += character;
+			escaped = false;
+			continue;
+		}
+		if (character === "\\") {
+			current += character;
+			escaped = true;
+			continue;
+		}
+		if (character === "[") bracketDepth += 1;
+		if (character === "]") bracketDepth = Math.max(0, bracketDepth - 1);
+		if (character === ":" && bracketDepth === 0) {
+			parts.push(current);
+			current = "";
+			continue;
+		}
+		current += character;
+	}
+	parts.push(current);
+	return parts;
+}
+function baseClassName(className) {
+	return splitClassName(className).at(-1);
+}
+function unsupportedVariant(className) {
+	return splitClassName(className).slice(0, -1).find((variant) => ![
+		"dark",
+		"ios",
+		"android",
+		"native"
+	].includes(variant));
+}
+function walkClasses(selector) {
+	const classes = [];
+	for (const match of selector.matchAll(CLASS_SELECTOR_RE)) {
+		const token = decodeCssIdentifier(match[1]);
+		if (token && !classes.includes(token)) classes.push(token);
+	}
+	return classes;
+}
+function variantForClass(className) {
+	const result = {};
+	for (const variant of splitClassName(className).slice(0, -1)) {
+		if (variant === "dark") result.colorScheme = "dark";
+		if (variant === "ios" || variant === "android" || variant === "native") result.platform = variant;
+	}
+	return result;
+}
+function atRuleVariant(node) {
+	if (!node) return {};
+	const params = node.params.toLowerCase();
+	if (params.includes("prefers-color-scheme") && params.includes("dark")) return { colorScheme: "dark" };
+	if (params.includes("platform") && params.includes("ios")) return { platform: "ios" };
+	if (params.includes("platform") && params.includes("android")) return { platform: "android" };
+	return {};
+}
+//#endregion
+//#region src/compat/native/compile.ts
+function ancestors(node) {
+	const result = [];
+	let current = node.parent;
+	while (current && current.type !== "root") {
+		if (current.type === "atrule") result.unshift(current);
+		current = current.parent;
+	}
+	return result;
+}
+function collectVariables(root) {
+	const variables = {};
+	root.walkDecls((decl) => {
+		if (decl.prop.startsWith("--")) variables[decl.prop] = decl.value.trim();
+	});
+	return variables;
+}
+function addWarning(warnings, warning) {
+	if (!warnings.some((item) => item.message === warning.message && item.property === warning.property && item.className === warning.className)) warnings.push(warning);
+}
+function compileRule(rule, className, variables, warnings, order) {
+	const unsupported = unsupportedVariant(className);
+	if (unsupported) {
+		addWarning(warnings, {
+			className,
+			property: "variant",
+			message: `不支持将 ${unsupported}: 变体编译为 React Native 条件样式`
+		});
+		return [];
+	}
+	const styles = {
+		normal: {},
+		important: {}
+	};
+	rule.walkDecls((decl) => {
+		if (decl.prop.startsWith("--")) return;
+		const property = propertyName(decl.prop);
+		const important = decl.important || /!important\s*$/i.test(decl.value);
+		const value = decl.value.replace(/\s*!important\s*$/i, "");
+		const expanded = expandDeclaration(property, value, variables);
+		if (!expanded || Object.values(expanded).includes(void 0)) {
+			addWarning(warnings, {
+				className,
+				property,
+				message: `不支持将 ${decl.prop}: ${value} 编译为 React Native style`
+			});
+			return;
+		}
+		Object.assign(styles[important ? "important" : "normal"], expanded);
+	});
+	const variant = {
+		...variantForClass(className),
+		...ancestors(rule).reduce((result, node) => ({
+			...result,
+			...atRuleVariant(node)
+		}), {})
+	};
+	return ["normal", "important"].filter((kind) => Object.keys(styles[kind]).length > 0).map((kind) => ({
+		style: styles[kind],
+		...variant,
+		important: kind === "important" || void 0,
+		order
+	}));
+}
+function compileNativeCss(css, options = {}) {
+	const root = postcss.default.parse(css);
+	const variables = collectVariables(root);
+	const allowed = options.classSet ? new Set(options.classSet) : void 0;
+	const rules = {};
+	const warnings = [];
+	let order = 0;
+	root.walkRules((rule) => {
+		if (options.ignorePreflight !== false && (rule.selector.includes(":root") || rule.selector.includes("*") || rule.selector.includes("::"))) return;
+		for (const selector of rule.selectors) for (const className of walkClasses(selector)) {
+			if (allowed && !allowed.has(className)) continue;
+			const compiled = compileRule(rule, className, variables, warnings, order++);
+			if (compiled.length) (rules[className] ??= []).push(...compiled);
+		}
+	});
+	return {
+		rules,
+		variables,
+		warnings
+	};
+}
+//#endregion
+exports.baseClassName = baseClassName;
+exports.compileNativeCss = compileNativeCss;
+exports.splitClassName = splitClassName;
+exports.variantForClass = variantForClass;

package/dist/native.d.ts

@@ -0,0 +1,3 @@
+export { compileNativeCss } from './compat/native/compile.js';
+export { baseClassName, splitClassName, variantForClass } from './compat/native/selectors.js';
+export type { CompileNativeStylesheetOptions, NativeCompilerWarning, NativeCssStylesheet, NativePlatform, NativeStyleRule } from './compat/native/types.js';