@weapp-tailwindcss/postcss 2.0.1 → 2.0.3

package/dist/index.js

@@ -7,7 +7,7 @@ var _postcss = require('postcss'); var _postcss2 = _interopRequireDefault(_postc
 // src/defaults.ts
 function getDefaultOptions(options) {
   return {
-    // https://github.com/postcss/postcss-calc
+    // 参考：https://github.com/postcss/postcss-calc
     cssPresetEnv: {
       features: {
         "cascade-layers": true,
@@ -16,8 +16,9 @@ function getDefaultOptions(options) {
         },
         "oklab-function": true,
         "color-mix": true,
+        "color-functional-notation": _nullishCoalesce(_optionalChain([options, 'optionalAccess', _ => _.cssPresetEnv, 'optionalAccess', _2 => _2.features, 'optionalAccess', _3 => _3["color-functional-notation"]]), () => ( { preserve: false })),
         // 在 calc 下，这个需要开启
-        "custom-properties": _nullishCoalesce(_optionalChain([options, 'optionalAccess', _ => _.cssPresetEnv, 'optionalAccess', _2 => _2.features, 'optionalAccess', _3 => _3["custom-properties"]]), () => ( _optionalChain([options, 'optionalAccess', _4 => _4.cssCalc]))) ? { preserve: true } : false
+        "custom-properties": _nullishCoalesce(_optionalChain([options, 'optionalAccess', _4 => _4.cssPresetEnv, 'optionalAccess', _5 => _5.features, 'optionalAccess', _6 => _6["custom-properties"]]), () => ( _optionalChain([options, 'optionalAccess', _7 => _7.cssCalc]))) ? { preserve: true } : false
       },
       autoprefixer: {
         add: false
@@ -37,6 +38,103 @@ function getDefaultOptions(options) {
 // src/pipeline.ts
 var _postcsspresetenv = require('postcss-preset-env'); var _postcsspresetenv2 = _interopRequireDefault(_postcsspresetenv);
 
+// src/plugins/colorFunctionalFallback.ts
+var _postcssvalueparser = require('postcss-value-parser'); var _postcssvalueparser2 = _interopRequireDefault(_postcssvalueparser);
+var RGB_FUNCTION_NAME = "rgb";
+var isSlashDiv = (node) => node.type === "div" && node.value === "/";
+function trimNodes(nodes2) {
+  let start = 0;
+  let end = nodes2.length;
+  while (start < end && _optionalChain([nodes2, 'access', _8 => _8[start], 'optionalAccess', _9 => _9.type]) === "space") {
+    start += 1;
+  }
+  while (end > start && _optionalChain([nodes2, 'access', _10 => _10[end - 1], 'optionalAccess', _11 => _11.type]) === "space") {
+    end -= 1;
+  }
+  return nodes2.slice(start, end);
+}
+function splitColorComponents(nodes2) {
+  const parts = [];
+  let current = [];
+  nodes2.forEach((node) => {
+    if (node.type === "div" && node.value === ",") {
+      if (current.length) {
+        parts.push(current);
+        current = [];
+      }
+      return;
+    }
+    if (node.type === "space") {
+      if (current.length) {
+        parts.push(current);
+        current = [];
+      }
+      return;
+    }
+    current.push(node);
+  });
+  if (current.length) {
+    parts.push(current);
+  }
+  return parts;
+}
+var buildFunctionNodes = (content) => _postcssvalueparser2.default.call(void 0, content).nodes;
+function convertRgbFunction(fnNode) {
+  const slashIndex = fnNode.nodes.findIndex(isSlashDiv);
+  if (slashIndex === -1) {
+    return false;
+  }
+  const colorNodes = trimNodes(fnNode.nodes.slice(0, slashIndex));
+  const alphaNodes = trimNodes(fnNode.nodes.slice(slashIndex + 1));
+  if (!colorNodes.length || !alphaNodes.length) {
+    return false;
+  }
+  const colorParts = splitColorComponents(colorNodes);
+  if (colorParts.length !== 3) {
+    return false;
+  }
+  const normalizedColors = colorParts.map((part) => _postcssvalueparser2.default.stringify(part).trim()).filter(Boolean);
+  if (normalizedColors.length !== 3) {
+    return false;
+  }
+  const alphaText = _postcssvalueparser2.default.stringify(alphaNodes).trim();
+  if (!alphaText) {
+    return false;
+  }
+  fnNode.value = "rgba";
+  const nextValue = `${normalizedColors.join(", ")}, ${alphaText}`;
+  fnNode.nodes = buildFunctionNodes(nextValue);
+  return true;
+}
+function transformDeclaration(decl) {
+  if (!decl.value || !decl.value.toLowerCase().includes(RGB_FUNCTION_NAME)) {
+    return;
+  }
+  const parsed = _postcssvalueparser2.default.call(void 0, decl.value);
+  let mutated = false;
+  parsed.walk((node) => {
+    if (node.type !== "function") {
+      return;
+    }
+    if (node.value.toLowerCase() !== RGB_FUNCTION_NAME) {
+      return;
+    }
+    if (convertRgbFunction(node)) {
+      mutated = true;
+    }
+  });
+  if (mutated) {
+    decl.value = parsed.toString();
+  }
+}
+function createColorFunctionalFallback() {
+  return {
+    postcssPlugin: "weapp-tailwindcss-color-functional-fallback",
+    Declaration: transformDeclaration
+  };
+}
+createColorFunctionalFallback.postcss = true;
+
 // src/plugins/ctx.ts
 function createContext() {
   const variablesScopeWeakMap = /* @__PURE__ */ new WeakMap();
@@ -77,7 +175,7 @@ function getCalcPlugin(options) {
 
 // src/plugins/getCustomPropertyCleaner.ts
 
-var _postcssvalueparser = require('postcss-value-parser'); var _postcssvalueparser2 = _interopRequireDefault(_postcssvalueparser);
+
 function getCustomPropertyCleaner(options) {
   const includeCustomProperties = Array.isArray(options.cssCalc) ? options.cssCalc : typeof options.cssCalc === "object" ? options.cssCalc.includeCustomProperties : [];
   const shouldMatchCustomProperties = Array.isArray(includeCustomProperties) && includeCustomProperties.length > 0;
@@ -190,7 +288,7 @@ var beforeAfterParser = _postcssselectorparser2.default.call(void 0, (selectors)
     return;
   }
   selectors.walkPseudos((s) => {
-    if (_optionalChain([s, 'access', _5 => _5.parent, 'optionalAccess', _6 => _6.length]) === 1) {
+    if (_optionalChain([s, 'access', _12 => _12.parent, 'optionalAccess', _13 => _13.length]) === 1) {
       if (/^:?:before$/.test(s.value)) {
         state.before = true;
       }
@@ -268,7 +366,7 @@ function getFallbackRemove(_rule, options) {
   const cacheKey = _nullishCoalesce(options, () => ( fallbackDefaultKey));
   let entry = fallbackRemoveCache.get(cacheKey);
   if (!entry) {
-    const uniAppX = Boolean(_optionalChain([options, 'optionalAccess', _7 => _7.uniAppX]));
+    const uniAppX = Boolean(_optionalChain([options, 'optionalAccess', _14 => _14.uniAppX]));
     let currentRule;
     const parser = _postcssselectorparser2.default.call(void 0, (selectors) => {
       const activeRule = currentRule;
@@ -278,13 +376,13 @@ function getFallbackRemove(_rule, options) {
           maybeImportantId = true;
         }
         if (selector.type === "universal") {
-          _optionalChain([selector, 'access', _8 => _8.parent, 'optionalAccess', _9 => _9.remove, 'call', _10 => _10()]);
+          _optionalChain([selector, 'access', _15 => _15.parent, 'optionalAccess', _16 => _16.remove, 'call', _17 => _17()]);
         } else if (selector.type === "pseudo") {
           if (selector.value === ":is") {
-            if (maybeImportantId && _optionalChain([selector, 'access', _11 => _11.nodes, 'access', _12 => _12[0], 'optionalAccess', _13 => _13.type]) === "selector") {
+            if (maybeImportantId && _optionalChain([selector, 'access', _18 => _18.nodes, 'access', _19 => _19[0], 'optionalAccess', _20 => _20.type]) === "selector") {
               selector.replaceWith(selector.nodes[0]);
             } else {
-              _optionalChain([selector, 'access', _14 => _14.parent, 'optionalAccess', _15 => _15.remove, 'call', _16 => _16()]);
+              _optionalChain([selector, 'access', _21 => _21.parent, 'optionalAccess', _22 => _22.remove, 'call', _23 => _23()]);
             }
           } else if (selector.value === ":not") {
             for (const x of selector.nodes) {
@@ -307,7 +405,7 @@ function getFallbackRemove(_rule, options) {
           }
         } else if (selector.type === "attribute") {
           if (selector.attribute === "hidden") {
-            _optionalChain([activeRule, 'optionalAccess', _17 => _17.remove, 'call', _18 => _18()]);
+            _optionalChain([activeRule, 'optionalAccess', _24 => _24.remove, 'call', _25 => _25()]);
           }
         }
       });
@@ -455,7 +553,7 @@ function dedupeSpacingProps(rule) {
     if (alreadyOrdered) {
       continue;
     }
-    const anchor = _nullishCoalesce(_optionalChain([unique, 'access', _19 => _19[unique.length - 1], 'optionalAccess', _20 => _20.next, 'call', _21 => _21()]), () => ( void 0));
+    const anchor = _nullishCoalesce(_optionalChain([unique, 'access', _26 => _26[unique.length - 1], 'optionalAccess', _27 => _27.next, 'call', _28 => _28()]), () => ( void 0));
     for (const decl of unique) {
       decl.remove();
     }
@@ -480,7 +578,7 @@ function isNotLastChildPseudo(node) {
   if (firstSelector.type !== "selector") {
     return false;
   }
-  const target = _optionalChain([firstSelector, 'access', _22 => _22.nodes, 'optionalAccess', _23 => _23[0]]);
+  const target = _optionalChain([firstSelector, 'access', _29 => _29.nodes, 'optionalAccess', _30 => _30[0]]);
   return Boolean(target && target.type === "pseudo" && target.value === ":last-child");
 }
 function transformSpacingSelector(nodes2, options) {
@@ -527,7 +625,7 @@ function flattenWherePseudo(node, context, index, parent) {
     node.value = ":is";
   }
   if (index === 0 && node.length === 1) {
-    const targetSelector = _optionalChain([node, 'access', _24 => _24.nodes, 'optionalAccess', _25 => _25[0]]);
+    const targetSelector = _optionalChain([node, 'access', _31 => _31.nodes, 'optionalAccess', _32 => _32[0]]);
     if (targetSelector && targetSelector.type === "selector" && transformSpacingSelector(targetSelector.nodes, context.options)) {
       context.requiresSpacingNormalization = true;
     }
@@ -547,7 +645,7 @@ function handleUniversalNode(node, context) {
   if (node.type !== "universal") {
     return;
   }
-  const replacement = _optionalChain([context, 'access', _26 => _26.options, 'access', _27 => _27.cssSelectorReplacement, 'optionalAccess', _28 => _28.universal]);
+  const replacement = _optionalChain([context, 'access', _33 => _33.options, 'access', _34 => _34.cssSelectorReplacement, 'optionalAccess', _35 => _35.universal]);
   if (replacement) {
     node.value = composeIsPseudo(replacement);
   }
@@ -582,7 +680,7 @@ function handleCombinatorNode(node, index, context) {
   if (node.type !== "combinator" || node.value !== ">") {
     return;
   }
-  const nodes2 = _optionalChain([node, 'access', _29 => _29.parent, 'optionalAccess', _30 => _30.nodes]);
+  const nodes2 = _optionalChain([node, 'access', _36 => _36.parent, 'optionalAccess', _37 => _37.nodes]);
   if (!nodes2) {
     return;
   }
@@ -598,7 +696,7 @@ function handlePseudoNode(node, index, context, parent) {
   if (node.type !== "pseudo") {
     return;
   }
-  if (node.value === ":root" && _optionalChain([context, 'access', _31 => _31.options, 'access', _32 => _32.cssSelectorReplacement, 'optionalAccess', _33 => _33.root])) {
+  if (node.value === ":root" && _optionalChain([context, 'access', _38 => _38.options, 'access', _39 => _39.cssSelectorReplacement, 'optionalAccess', _40 => _40.root])) {
     node.value = composeIsPseudo(context.options.cssSelectorReplacement.root);
     return;
   }
@@ -625,7 +723,7 @@ function handleSelectorNode(selector, context) {
 }
 function transformSelectors(selectors, context) {
   selectors.walk((node, index) => {
-    const parent = _optionalChain([node, 'access', _34 => _34.parent, 'optionalAccess', _35 => _35.type]) === "selector" ? node.parent : void 0;
+    const parent = _optionalChain([node, 'access', _41 => _41.parent, 'optionalAccess', _42 => _42.type]) === "selector" ? node.parent : void 0;
     switch (node.type) {
       case "class":
         handleClassNode(node, context);
@@ -703,7 +801,7 @@ function normalizeSelectorList(value) {
   return Array.isArray(value) ? value.filter(Boolean) : [value];
 }
 function getSpecificityMatchingName(options) {
-  const feature = _optionalChain([options, 'access', _36 => _36.cssPresetEnv, 'optionalAccess', _37 => _37.features, 'optionalAccess', _38 => _38["is-pseudo-class"]]);
+  const feature = _optionalChain([options, 'access', _43 => _43.cssPresetEnv, 'optionalAccess', _44 => _44.features, 'optionalAccess', _45 => _45["is-pseudo-class"]]);
   if (feature && typeof feature === "object" && "specificityMatchingName" in feature) {
     const specificityName = feature.specificityMatchingName;
     return typeof specificityName === "string" && specificityName.length > 0 ? specificityName : void 0;
@@ -712,12 +810,12 @@ function getSpecificityMatchingName(options) {
 }
 function createRootSpecificityCleaner(options) {
   const specificityMatchingName = getSpecificityMatchingName(options);
-  const selectors = normalizeSelectorList(_optionalChain([options, 'access', _39 => _39.cssSelectorReplacement, 'optionalAccess', _40 => _40.root]));
+  const selectors = normalizeSelectorList(_optionalChain([options, 'access', _46 => _46.cssSelectorReplacement, 'optionalAccess', _47 => _47.root]));
   if (!specificityMatchingName || selectors.length === 0) {
     return void 0;
   }
   const suffix = `:not(.${specificityMatchingName})`;
-  const targets = selectors.map((selector) => _optionalChain([selector, 'optionalAccess', _41 => _41.trim, 'call', _42 => _42()])).filter((selector) => Boolean(_optionalChain([selector, 'optionalAccess', _43 => _43.length]))).map((selector) => ({
+  const targets = selectors.map((selector) => _optionalChain([selector, 'optionalAccess', _48 => _48.trim, 'call', _49 => _49()])).filter((selector) => Boolean(_optionalChain([selector, 'optionalAccess', _50 => _50.length]))).map((selector) => ({
     match: `${selector}${suffix}`,
     spacedMatch: `${selector} ${suffix}`,
     replacement: selector
@@ -746,17 +844,17 @@ function createRootSpecificityCleaner(options) {
 }
 var OklabSuffix = "in oklab";
 var logicalPropMap = /* @__PURE__ */ new Map([
-  // margin
+  // margin 方向映射
   ["margin-inline-start", "margin-left"],
   ["margin-inline-end", "margin-right"],
   ["margin-block-start", "margin-top"],
   ["margin-block-end", "margin-bottom"],
-  // padding
+  // padding 方向映射
   ["padding-inline-start", "padding-left"],
   ["padding-inline-end", "padding-right"],
   ["padding-block-start", "padding-top"],
   ["padding-block-end", "padding-bottom"],
-  // border
+  // border 方向映射
   ["border-inline-start", "border-left"],
   ["border-inline-end", "border-right"],
   ["border-block-start", "border-top"],
@@ -863,7 +961,7 @@ function dedupeDeclarations(rule) {
     if (!needReorder) {
       continue;
     }
-    const anchor = _nullishCoalesce(_optionalChain([declarations, 'access', _44 => _44[declarations.length - 1], 'optionalAccess', _45 => _45.next, 'call', _46 => _46()]), () => ( void 0));
+    const anchor = _nullishCoalesce(_optionalChain([declarations, 'access', _51 => _51[declarations.length - 1], 'optionalAccess', _52 => _52.next, 'call', _53 => _53()]), () => ( void 0));
     for (const decl of declarations) {
       decl.remove();
     }
@@ -908,9 +1006,9 @@ var postcssWeappTailwindcssPostPlugin = (options) => {
     const fallbackRemove = enableMainChunkTransforms ? getFallbackRemove(void 0, opts) : void 0;
     p.RuleExit = (rule) => {
       if (enableMainChunkTransforms) {
-        _optionalChain([fallbackRemove, 'optionalAccess', _47 => _47.transformSync, 'call', _48 => _48(rule)]);
+        _optionalChain([fallbackRemove, 'optionalAccess', _54 => _54.transformSync, 'call', _55 => _55(rule)]);
       }
-      _optionalChain([cleanRootSpecificity, 'optionalCall', _49 => _49(rule)]);
+      _optionalChain([cleanRootSpecificity, 'optionalCall', _56 => _56(rule)]);
       if (enableMainChunkTransforms) {
         dedupeDeclarations(rule);
         if (rule.selectors.length === 0 || rule.selectors.length === 1 && rule.selector.trim() === "") {
@@ -928,13 +1026,32 @@ var postcssWeappTailwindcssPostPlugin = (options) => {
         decl.value = decl.value.slice(0, decl.value.length - OklabSuffix.length);
       } else if (/calc\(\s*infinity\s*\*\s*(?:\d+(?:\.\d*)?|\.\d+)r?px/.test(decl.value)) {
         decl.value = "9999px";
+      } else if (decl.prop.includes("radius")) {
+        const CLAMP_PX = 9999;
+        const THRESHOLD = 1e5;
+        const next = decl.value.replace(
+          /\b([+-]?(?:\d+(?:\.\d+)?|\.\d+)(?:e[+-]?\d+)?)\s*(r?px)\b/gi,
+          (m, num) => {
+            const n = Number(num);
+            if (!Number.isFinite(n)) {
+              return `${CLAMP_PX}px`;
+            }
+            if (/e/i.test(String(num)) || n > THRESHOLD) {
+              return `${CLAMP_PX}px`;
+            }
+            return m;
+          }
+        );
+        if (next !== decl.value) {
+          decl.value = next;
+        }
       }
     };
     p.AtRuleExit = (atRule) => {
       if (opts.cssRemoveProperty && atRule.name === "property") {
         atRule.remove();
       }
-      _optionalChain([atRule, 'access', _50 => _50.nodes, 'optionalAccess', _51 => _51.length]) === 0 && atRule.remove();
+      _optionalChain([atRule, 'access', _57 => _57.nodes, 'optionalAccess', _58 => _58.length]) === 0 && atRule.remove();
     };
   }
   return p;
@@ -1164,33 +1281,33 @@ function property(ident, initialValue, _syntax) {
 }
 var nullShadow = "0 0 #0000";
 var nodes = [
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1137
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1137
   property("--tw-border-spacing-x", "0", "<length>"),
   property("--tw-border-spacing-y", "0", "<length>"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1205
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1205
   property("--tw-translate-x", "0"),
   property("--tw-translate-y", "0"),
   property("--tw-translate-z", "0"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1285
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1285
   property("--tw-scale-x", "1"),
   property("--tw-scale-y", "1"),
   property("--tw-scale-z", "1"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1424
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1424
   property("--tw-rotate-x"),
   property("--tw-rotate-y"),
   property("--tw-rotate-z"),
   property("--tw-skew-x"),
   property("--tw-skew-y"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1641C13-L1641C88
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1641C13-L1641C88
   property("--tw-pan-x"),
   property("--tw-pan-y"),
   property("--tw-pinch-zoom"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
   property("--tw-scroll-snap-strictness", "proximity", "*"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
   property("--tw-space-x-reverse", "0"),
   property("--tw-space-y-reverse", "0"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L2169C22-L2169C60
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L2169C22-L2169C60
   property("--tw-border-style", "solid"),
   property("--tw-divide-x-reverse", "0"),
   property("--tw-divide-y-reverse", "0"),
@@ -1277,7 +1394,7 @@ var nodes = [
   property("--tw-ring-shadow", nullShadow),
   property("--tw-inset-ring-color"),
   property("--tw-inset-ring-shadow", nullShadow),
-  // Legacy
+  // Legacy 旧版变量兼容
   property("--tw-ring-inset"),
   property("--tw-ring-offset-width", "0px", "<length>"),
   property("--tw-ring-offset-color", "#fff"),
@@ -1375,7 +1492,7 @@ function remakeCssVarSelector(selectors, options) {
 function commonChunkPreflight(node, options) {
   const { ctx, cssInjectPreflight, injectAdditionalCssVarScope } = options;
   if (testIfVariablesScope(node)) {
-    _optionalChain([ctx, 'optionalAccess', _52 => _52.markVariablesScope, 'call', _53 => _53(node)]);
+    _optionalChain([ctx, 'optionalAccess', _59 => _59.markVariablesScope, 'call', _60 => _60(node)]);
     node.selectors = remakeCssVarSelector(node.selectors, options);
     node.before(makePseudoVarRule());
     if (typeof cssInjectPreflight === "function") {
@@ -1440,9 +1557,9 @@ var postcssWeappTailwindcssPrePlugin = (options) => {
       root.walkAtRules((atRule) => {
         if (atRule.name === "layer") {
           if (atRule.params === "properties") {
-            if (atRule.nodes === void 0 || _optionalChain([atRule, 'access', _54 => _54.nodes, 'optionalAccess', _55 => _55.length]) === 0) {
+            if (atRule.nodes === void 0 || _optionalChain([atRule, 'access', _61 => _61.nodes, 'optionalAccess', _62 => _62.length]) === 0) {
               layerProperties = atRule;
-            } else if (_optionalChain([atRule, 'access', _56 => _56.first, 'optionalAccess', _57 => _57.type]) === "atrule" && isTailwindcssV4ModernCheck(atRule.first)) {
+            } else if (_optionalChain([atRule, 'access', _63 => _63.first, 'optionalAccess', _64 => _64.type]) === "atrule" && isTailwindcssV4ModernCheck(atRule.first)) {
               if (layerProperties) {
                 layerProperties.replaceWith(atRule.first.nodes);
                 atRule.remove();
@@ -1454,7 +1571,7 @@ var postcssWeappTailwindcssPrePlugin = (options) => {
             atRule.replaceWith(atRule.nodes);
           }
         } else if (isTailwindcssV4ModernCheck(atRule)) {
-          if (_optionalChain([atRule, 'access', _58 => _58.first, 'optionalAccess', _59 => _59.type]) === "atrule" && atRule.first.name === "layer") {
+          if (_optionalChain([atRule, 'access', _65 => _65.first, 'optionalAccess', _66 => _66.type]) === "atrule" && atRule.first.name === "layer") {
             atRule.replaceWith(atRule.first.nodes);
           }
         }
@@ -1499,7 +1616,7 @@ function createPipelineDefinitions(options) {
     normal: [],
     post: []
   };
-  const userPlugins = normalizeUserPlugins(_optionalChain([options, 'access', _60 => _60.postcssOptions, 'optionalAccess', _61 => _61.plugins]));
+  const userPlugins = normalizeUserPlugins(_optionalChain([options, 'access', _67 => _67.postcssOptions, 'optionalAccess', _68 => _68.plugins]));
   userPlugins.forEach((plugin, index) => {
     stages.pre.push(createStaticDefinition(`pre:user-${index}`, "pre", plugin));
   });
@@ -1521,6 +1638,15 @@ function createPipelineDefinitions(options) {
       createPlugin: () => _postcsspresetenv2.default.call(void 0, options.cssPresetEnv)
     })
   });
+  stages.normal.push({
+    id: "normal:color-functional-fallback",
+    stage: "normal",
+    prepare: () => ({
+      id: "normal:color-functional-fallback",
+      stage: "normal",
+      createPlugin: () => createColorFunctionalFallback()
+    })
+  });
   stages.normal.push({
     id: "normal:px-transform",
     stage: "normal",
@@ -1650,7 +1776,7 @@ function createInjectPreflight(options) {
 function createProcessOptions(options) {
   return {
     from: void 0,
-    ..._nullishCoalesce(_optionalChain([options, 'access', _62 => _62.postcssOptions, 'optionalAccess', _63 => _63.options]), () => ( {}))
+    ..._nullishCoalesce(_optionalChain([options, 'access', _69 => _69.postcssOptions, 'optionalAccess', _70 => _70.options]), () => ( {}))
   };
 }
 var pipelineCache = /* @__PURE__ */ new WeakMap();
@@ -1665,7 +1791,7 @@ function getCachedPipeline(options) {
   return pipeline;
 }
 function getCachedProcessOptions(options) {
-  const source = _optionalChain([options, 'access', _64 => _64.postcssOptions, 'optionalAccess', _65 => _65.options]);
+  const source = _optionalChain([options, 'access', _71 => _71.postcssOptions, 'optionalAccess', _72 => _72.options]);
   let cached = processOptionsCache.get(options);
   const cachedSource = processOptionsSourceCache.get(options);
   if (!cached || cachedSource !== source) {

package/dist/index.mjs

@@ -7,7 +7,7 @@ import postcss from "postcss";
 // src/defaults.ts
 function getDefaultOptions(options) {
   return {
-    // https://github.com/postcss/postcss-calc
+    // 参考：https://github.com/postcss/postcss-calc
     cssPresetEnv: {
       features: {
         "cascade-layers": true,
@@ -16,6 +16,7 @@ function getDefaultOptions(options) {
         },
         "oklab-function": true,
         "color-mix": true,
+        "color-functional-notation": options?.cssPresetEnv?.features?.["color-functional-notation"] ?? { preserve: false },
         // 在 calc 下，这个需要开启
         "custom-properties": options?.cssPresetEnv?.features?.["custom-properties"] ?? options?.cssCalc ? { preserve: true } : false
       },
@@ -37,6 +38,103 @@ function getDefaultOptions(options) {
 // src/pipeline.ts
 import postcssPresetEnv from "postcss-preset-env";
 
+// src/plugins/colorFunctionalFallback.ts
+import valueParser from "postcss-value-parser";
+var RGB_FUNCTION_NAME = "rgb";
+var isSlashDiv = (node) => node.type === "div" && node.value === "/";
+function trimNodes(nodes2) {
+  let start = 0;
+  let end = nodes2.length;
+  while (start < end && nodes2[start]?.type === "space") {
+    start += 1;
+  }
+  while (end > start && nodes2[end - 1]?.type === "space") {
+    end -= 1;
+  }
+  return nodes2.slice(start, end);
+}
+function splitColorComponents(nodes2) {
+  const parts = [];
+  let current = [];
+  nodes2.forEach((node) => {
+    if (node.type === "div" && node.value === ",") {
+      if (current.length) {
+        parts.push(current);
+        current = [];
+      }
+      return;
+    }
+    if (node.type === "space") {
+      if (current.length) {
+        parts.push(current);
+        current = [];
+      }
+      return;
+    }
+    current.push(node);
+  });
+  if (current.length) {
+    parts.push(current);
+  }
+  return parts;
+}
+var buildFunctionNodes = (content) => valueParser(content).nodes;
+function convertRgbFunction(fnNode) {
+  const slashIndex = fnNode.nodes.findIndex(isSlashDiv);
+  if (slashIndex === -1) {
+    return false;
+  }
+  const colorNodes = trimNodes(fnNode.nodes.slice(0, slashIndex));
+  const alphaNodes = trimNodes(fnNode.nodes.slice(slashIndex + 1));
+  if (!colorNodes.length || !alphaNodes.length) {
+    return false;
+  }
+  const colorParts = splitColorComponents(colorNodes);
+  if (colorParts.length !== 3) {
+    return false;
+  }
+  const normalizedColors = colorParts.map((part) => valueParser.stringify(part).trim()).filter(Boolean);
+  if (normalizedColors.length !== 3) {
+    return false;
+  }
+  const alphaText = valueParser.stringify(alphaNodes).trim();
+  if (!alphaText) {
+    return false;
+  }
+  fnNode.value = "rgba";
+  const nextValue = `${normalizedColors.join(", ")}, ${alphaText}`;
+  fnNode.nodes = buildFunctionNodes(nextValue);
+  return true;
+}
+function transformDeclaration(decl) {
+  if (!decl.value || !decl.value.toLowerCase().includes(RGB_FUNCTION_NAME)) {
+    return;
+  }
+  const parsed = valueParser(decl.value);
+  let mutated = false;
+  parsed.walk((node) => {
+    if (node.type !== "function") {
+      return;
+    }
+    if (node.value.toLowerCase() !== RGB_FUNCTION_NAME) {
+      return;
+    }
+    if (convertRgbFunction(node)) {
+      mutated = true;
+    }
+  });
+  if (mutated) {
+    decl.value = parsed.toString();
+  }
+}
+function createColorFunctionalFallback() {
+  return {
+    postcssPlugin: "weapp-tailwindcss-color-functional-fallback",
+    Declaration: transformDeclaration
+  };
+}
+createColorFunctionalFallback.postcss = true;
+
 // src/plugins/ctx.ts
 function createContext() {
   const variablesScopeWeakMap = /* @__PURE__ */ new WeakMap();
@@ -77,7 +175,7 @@ function getCalcPlugin(options) {
 
 // src/plugins/getCustomPropertyCleaner.ts
 import { regExpTest } from "@weapp-tailwindcss/shared";
-import valueParser from "postcss-value-parser";
+import valueParser2 from "postcss-value-parser";
 function getCustomPropertyCleaner(options) {
   const includeCustomProperties = Array.isArray(options.cssCalc) ? options.cssCalc : typeof options.cssCalc === "object" ? options.cssCalc.includeCustomProperties : [];
   const shouldMatchCustomProperties = Array.isArray(includeCustomProperties) && includeCustomProperties.length > 0;
@@ -99,7 +197,7 @@ function getCustomPropertyCleaner(options) {
         if (!shouldMatchCustomProperties || !/--/.test(decl.value)) {
           return;
         }
-        const parsed = valueParser(decl.value);
+        const parsed = valueParser2(decl.value);
         let containsIncludedCustomProperty = false;
         parsed.walk((node) => {
           if (node.type !== "function" || node.value !== "var" || containsIncludedCustomProperty) {
@@ -746,17 +844,17 @@ function createRootSpecificityCleaner(options) {
 }
 var OklabSuffix = "in oklab";
 var logicalPropMap = /* @__PURE__ */ new Map([
-  // margin
+  // margin 方向映射
   ["margin-inline-start", "margin-left"],
   ["margin-inline-end", "margin-right"],
   ["margin-block-start", "margin-top"],
   ["margin-block-end", "margin-bottom"],
-  // padding
+  // padding 方向映射
   ["padding-inline-start", "padding-left"],
   ["padding-inline-end", "padding-right"],
   ["padding-block-start", "padding-top"],
   ["padding-block-end", "padding-bottom"],
-  // border
+  // border 方向映射
   ["border-inline-start", "border-left"],
   ["border-inline-end", "border-right"],
   ["border-block-start", "border-top"],
@@ -928,6 +1026,25 @@ var postcssWeappTailwindcssPostPlugin = (options) => {
         decl.value = decl.value.slice(0, decl.value.length - OklabSuffix.length);
       } else if (/calc\(\s*infinity\s*\*\s*(?:\d+(?:\.\d*)?|\.\d+)r?px/.test(decl.value)) {
         decl.value = "9999px";
+      } else if (decl.prop.includes("radius")) {
+        const CLAMP_PX = 9999;
+        const THRESHOLD = 1e5;
+        const next = decl.value.replace(
+          /\b([+-]?(?:\d+(?:\.\d+)?|\.\d+)(?:e[+-]?\d+)?)\s*(r?px)\b/gi,
+          (m, num) => {
+            const n = Number(num);
+            if (!Number.isFinite(n)) {
+              return `${CLAMP_PX}px`;
+            }
+            if (/e/i.test(String(num)) || n > THRESHOLD) {
+              return `${CLAMP_PX}px`;
+            }
+            return m;
+          }
+        );
+        if (next !== decl.value) {
+          decl.value = next;
+        }
       }
     };
     p.AtRuleExit = (atRule) => {
@@ -1164,33 +1281,33 @@ function property(ident, initialValue, _syntax) {
 }
 var nullShadow = "0 0 #0000";
 var nodes = [
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1137
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1137
   property("--tw-border-spacing-x", "0", "<length>"),
   property("--tw-border-spacing-y", "0", "<length>"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1205
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1205
   property("--tw-translate-x", "0"),
   property("--tw-translate-y", "0"),
   property("--tw-translate-z", "0"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1285
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1285
   property("--tw-scale-x", "1"),
   property("--tw-scale-y", "1"),
   property("--tw-scale-z", "1"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1424
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1424
   property("--tw-rotate-x"),
   property("--tw-rotate-y"),
   property("--tw-rotate-z"),
   property("--tw-skew-x"),
   property("--tw-skew-y"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1641C13-L1641C88
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1641C13-L1641C88
   property("--tw-pan-x"),
   property("--tw-pan-y"),
   property("--tw-pinch-zoom"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
   property("--tw-scroll-snap-strictness", "proximity", "*"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L1688C38-L1688C95
   property("--tw-space-x-reverse", "0"),
   property("--tw-space-y-reverse", "0"),
-  // https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L2169C22-L2169C60
+  // 参考：https://github.com/tailwindlabs/tailwindcss/blob/main/packages/tailwindcss/src/utilities.ts#L2169C22-L2169C60
   property("--tw-border-style", "solid"),
   property("--tw-divide-x-reverse", "0"),
   property("--tw-divide-y-reverse", "0"),
@@ -1277,7 +1394,7 @@ var nodes = [
   property("--tw-ring-shadow", nullShadow),
   property("--tw-inset-ring-color"),
   property("--tw-inset-ring-shadow", nullShadow),
-  // Legacy
+  // Legacy 旧版变量兼容
   property("--tw-ring-inset"),
   property("--tw-ring-offset-width", "0px", "<length>"),
   property("--tw-ring-offset-color", "#fff"),
@@ -1521,6 +1638,15 @@ function createPipelineDefinitions(options) {
       createPlugin: () => postcssPresetEnv(options.cssPresetEnv)
     })
   });
+  stages.normal.push({
+    id: "normal:color-functional-fallback",
+    stage: "normal",
+    prepare: () => ({
+      id: "normal:color-functional-fallback",
+      stage: "normal",
+      createPlugin: () => createColorFunctionalFallback()
+    })
+  });
   stages.normal.push({
     id: "normal:px-transform",
     stage: "normal",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weapp-tailwindcss/postcss",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "@weapp-tailwindcss/postcss",
   "author": "ice breaker <1324318532@qq.com>",
   "license": "MIT",
@@ -43,7 +43,7 @@
     "@weapp-tailwindcss/postcss-calc": "^1.0.0",
     "postcss": "~8.5.6",
     "postcss-preset-env": "^10.4.0",
-    "postcss-pxtransform": "^4.1.7",
+    "postcss-pxtransform": "^4.1.8",
     "postcss-rem-to-responsive-pixel": "^6.1.0",
     "postcss-selector-parser": "~7.1.0",
     "postcss-value-parser": "^4.2.0",