weapp-tailwindcss 2.4.4 → 2.6.0

package/README.md

@@ -11,14 +11,8 @@
 <h1 align="center">weapp-tailwindcss</h1>
 
 </p>
-<!-- <p align="center">
-<a href="https://weapp-tw.icebreaker.top#gh-light-mode-only">
-  <img src="./assets/logo-text-light.png#gh-light-mode-only" alt="weapp-tailwindcss-logo" width="300">
-</a>
-<a href="https://weapp-tw.icebreaker.top#gh-dark-mode-only">
-  <img src="./assets/logo-text-dark.png#gh-dark-mode-only" alt="weapp-tailwindcss-logo" width="300">
-</a>
-<br> -->
+
+> 简体中文(zh-cn) | [English](./README_en.md)
 
 ![star](https://badgen.net/github/stars/sonofmagic/weapp-tailwindcss)
 ![dm0](https://badgen.net/npm/dm/weapp-tailwindcss)

package/dist/cli.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var options = require('./options-887b74ca.js');
+var options = require('./options-487394fa.js');
 require('micromatch');
 require('@babel/types');
 require('@babel/generator');
@@ -9,7 +9,7 @@ require('@babel/traverse');
 require('./replace.js');
 require('./shared-ae7dd073.js');
 require('postcss');
-require('./postcss-33ef0bd0.js');
+require('./postcss-b53e9504.js');
 require('postcss-selector-parser');
 require('@csstools/postcss-is-pseudo-class');
 require('node:path');

package/dist/cli.mjs

@@ -1,4 +1,4 @@
-import { g as getOptions, c as createPatch } from './options-879de0a2.mjs';
+import { g as getOptions, c as createPatch } from './options-f7b71f03.mjs';
 import 'micromatch';
 import '@babel/types';
 import '@babel/generator';
@@ -7,7 +7,7 @@ import '@babel/traverse';
 import './replace.mjs';
 import './shared-7c88fb94.mjs';
 import 'postcss';
-import './postcss-ea625621.mjs';
+import './postcss-760298ba.mjs';
 import 'postcss-selector-parser';
 import '@csstools/postcss-is-pseudo-class';
 import 'node:path';

package/dist/constants.d.ts

@@ -1,4 +1,4 @@
-export declare const NS = "jsx-rename-loader";
+export declare const runtimeAopLoader = "weapp-tw-runtime-aop-loader";
 export declare const postcssPlugin = "postcss-weapp-tailwindcss-rename-plugin";
 export declare const ManglePluginHooks = "ManglePluginHooks";
 export declare const WeappTailwindcssWebpackPluginOptimizeChunkAssetsHooks = "WeappTailwindcssWebpackPluginOptimizeChunkAssetsHooks";

package/dist/gulp.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var stream = require('node:stream');
-var options = require('./options-887b74ca.js');
+var options = require('./options-487394fa.js');
 require('micromatch');
 require('@babel/types');
 require('@babel/generator');
@@ -12,7 +12,7 @@ require('@babel/traverse');
 require('./replace.js');
 require('./shared-ae7dd073.js');
 require('postcss');
-require('./postcss-33ef0bd0.js');
+require('./postcss-b53e9504.js');
 require('postcss-selector-parser');
 require('@csstools/postcss-is-pseudo-class');
 require('node:path');
@@ -32,14 +32,14 @@ function createPlugins(options$1 = {}) {
     }
     const opts = options.getOptions(options$1);
     const { templeteHandler, styleHandler, patch, jsHandler, setMangleRuntimeSet } = opts;
-    let set = new Set();
+    let runtimeSet = new Set();
     patch === null || patch === void 0 ? void 0 : patch();
     const twPatcher = options.createTailwindcssPatcher();
     function transformWxss() {
         const transformStream = new Transform({ objectMode: true });
         transformStream._transform = function (file, encoding, callback) {
-            set = twPatcher.getClassSet();
-            setMangleRuntimeSet(set);
+            runtimeSet = twPatcher.getClassSet();
+            setMangleRuntimeSet(runtimeSet);
             const error = null;
             if (file.contents) {
                 const code = styleHandler(file.contents.toString(), {
@@ -56,7 +56,7 @@ function createPlugins(options$1 = {}) {
         transformStream._transform = function (file, encoding, callback) {
             const error = null;
             if (file.contents) {
-                const { code } = jsHandler(file.contents.toString(), set);
+                const { code } = jsHandler(file.contents.toString(), runtimeSet);
                 file.contents = Buffer.from(code);
             }
             callback(error, file);
@@ -68,7 +68,9 @@ function createPlugins(options$1 = {}) {
         transformStream._transform = function (file, encoding, callback) {
             const error = null;
             if (file.contents) {
-                const code = templeteHandler(file.contents.toString());
+                const code = templeteHandler(file.contents.toString(), {
+                    runtimeSet
+                });
                 file.contents = Buffer.from(code);
             }
             callback(error, file);

package/dist/gulp.mjs

@@ -1,5 +1,5 @@
 import stream from 'node:stream';
-import { g as getOptions, a as createTailwindcssPatcher } from './options-879de0a2.mjs';
+import { g as getOptions, a as createTailwindcssPatcher } from './options-f7b71f03.mjs';
 import 'micromatch';
 import '@babel/types';
 import '@babel/generator';
@@ -8,7 +8,7 @@ import '@babel/traverse';
 import './replace.mjs';
 import './shared-7c88fb94.mjs';
 import 'postcss';
-import './postcss-ea625621.mjs';
+import './postcss-760298ba.mjs';
 import 'postcss-selector-parser';
 import '@csstools/postcss-is-pseudo-class';
 import 'node:path';
@@ -24,14 +24,14 @@ function createPlugins(options = {}) {
     }
     const opts = getOptions(options);
     const { templeteHandler, styleHandler, patch, jsHandler, setMangleRuntimeSet } = opts;
-    let set = new Set();
+    let runtimeSet = new Set();
     patch === null || patch === void 0 ? void 0 : patch();
     const twPatcher = createTailwindcssPatcher();
     function transformWxss() {
         const transformStream = new Transform({ objectMode: true });
         transformStream._transform = function (file, encoding, callback) {
-            set = twPatcher.getClassSet();
-            setMangleRuntimeSet(set);
+            runtimeSet = twPatcher.getClassSet();
+            setMangleRuntimeSet(runtimeSet);
             const error = null;
             if (file.contents) {
                 const code = styleHandler(file.contents.toString(), {
@@ -48,7 +48,7 @@ function createPlugins(options = {}) {
         transformStream._transform = function (file, encoding, callback) {
             const error = null;
             if (file.contents) {
-                const { code } = jsHandler(file.contents.toString(), set);
+                const { code } = jsHandler(file.contents.toString(), runtimeSet);
                 file.contents = Buffer.from(code);
             }
             callback(error, file);
@@ -60,7 +60,9 @@ function createPlugins(options = {}) {
         transformStream._transform = function (file, encoding, callback) {
             const error = null;
             if (file.contents) {
-                const code = templeteHandler(file.contents.toString());
+                const code = templeteHandler(file.contents.toString(), {
+                    runtimeSet
+                });
                 file.contents = Buffer.from(code);
             }
             callback(error, file);

package/dist/index.js

@@ -5,7 +5,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var webpack = require('./webpack.js');
 var vite = require('./vite.js');
 var gulp = require('./gulp.js');
-require('./options-887b74ca.js');
+require('node:path');
+require('node:fs');
+require('./options-487394fa.js');
 require('micromatch');
 require('@babel/types');
 require('@babel/generator');
@@ -14,11 +16,9 @@ require('@babel/traverse');
 require('./replace.js');
 require('./shared-ae7dd073.js');
 require('postcss');
-require('./postcss-33ef0bd0.js');
+require('./postcss-b53e9504.js');
 require('postcss-selector-parser');
 require('@csstools/postcss-is-pseudo-class');
-require('node:path');
-require('node:fs');
 require('semver');
 require('tailwindcss-patch');
 require('tailwindcss-mangle-shared');

package/dist/index.mjs

@@ -1,7 +1,9 @@
 export { UnifiedWebpackPluginV5 } from './webpack.mjs';
 export { UnifiedViteWeappTailwindcssPlugin } from './vite.mjs';
 export { createPlugins } from './gulp.mjs';
-import './options-879de0a2.mjs';
+import 'node:path';
+import 'node:fs';
+import './options-f7b71f03.mjs';
 import 'micromatch';
 import '@babel/types';
 import '@babel/generator';
@@ -10,11 +12,9 @@ import '@babel/traverse';
 import './replace.mjs';
 import './shared-7c88fb94.mjs';
 import 'postcss';
-import './postcss-ea625621.mjs';
+import './postcss-760298ba.mjs';
 import 'postcss-selector-parser';
 import '@csstools/postcss-is-pseudo-class';
-import 'node:path';
-import 'node:fs';
 import 'semver';
 import 'tailwindcss-patch';
 import 'tailwindcss-mangle-shared';

package/dist/{options-887b74ca.js → options-487394fa.js}

@@ -8,7 +8,7 @@ var traverse = require('@babel/traverse');
 var replace = require('./replace.js');
 var shared = require('./shared-ae7dd073.js');
 var postcss = require('postcss');
-var postcss$1 = require('./postcss-33ef0bd0.js');
+var postcss$1 = require('./postcss-b53e9504.js');
 var postcssIsPseudoClass = require('@csstools/postcss-is-pseudo-class');
 var path = require('node:path');
 var fs = require('node:fs');
@@ -114,7 +114,7 @@ function groupBy(arr, cb) {
     return result;
 }
 function getGroupedEntries(entries, options) {
-    const { cssMatcher, htmlMatcher, jsMatcher } = options;
+    const { cssMatcher, htmlMatcher, jsMatcher, wxsMatcher } = options;
     const groupedEntries = groupBy(entries, ([file]) => {
         if (cssMatcher(file)) {
             return 'css';
@@ -122,7 +122,7 @@ function getGroupedEntries(entries, options) {
         else if (htmlMatcher(file)) {
             return 'html';
         }
-        else if (jsMatcher(file)) {
+        else if (jsMatcher(file) || wxsMatcher(file)) {
             return 'js';
         }
         else {
@@ -210,9 +210,7 @@ function makeCustomAttributes(entries) {
     }
 }
 const variableRegExp = /{{(.*?)}}/gs;
-function variableMatch(original) {
-    return variableRegExp.exec(original);
-}
+const wxsTagRegexp = /<wxs\s*(?:[a-z][a-z-]*[a-z]*(?:\s*=\s*".*?")?)*\s*>(.*?)<\/wxs>/gs;
 
 const validateFilterRE = /[\w%-?\u00A0-\uFFFF-]/;
 function isValidSelector(selector = '') {
@@ -340,6 +338,9 @@ const defaultOptions = {
             }
         }
     },
+    wxsMatcher: (file) => {
+        return false;
+    },
     cssPreflight: {
         'box-sizing': 'border-box',
         'border-width': '0',
@@ -370,7 +371,9 @@ const defaultOptions = {
     arbitraryValues: {
         allowDoubleQuotes: false
     },
-    cssChildCombinatorReplaceValue: 'view + view'
+    cssChildCombinatorReplaceValue: 'view + view',
+    inlineWxs: false,
+    injectAdditionalCssVarScope: false
 };
 
 function generateCode(match, options = {}) {
@@ -398,23 +401,24 @@ function generateCode(match, options = {}) {
     });
     return code;
 }
-function extractSource(original) {
-    let match = variableMatch(original);
+function extract(original, reg) {
+    let match = reg.exec(original);
     const sources = [];
     while (match !== null) {
         const start = match.index;
-        const end = variableRegExp.lastIndex;
+        const end = reg.lastIndex;
         sources.push({
             start,
             end,
-            raw: match[1],
-            prevConcatenated: !/\s/.test(original[start - 1]),
-            nextConcatenated: !/\s/.test(original[end])
+            raw: match[1]
         });
-        match = variableMatch(original);
+        match = reg.exec(original);
     }
     return sources;
 }
+function extractSource(original) {
+    return extract(original, variableRegExp);
+}
 function templeteReplacer(original, options = {}) {
     const sources = extractSource(original);
     if (sources.length > 0) {
@@ -465,24 +469,27 @@ function templeteHandler(rawSource, options = {}) {
         });
     });
 }
-function customTempleteHandler(rawSource, options = {}) {
+function customTempleteHandler(rawSource, options) {
+    const { customAttributesEntities, inlineWxs, runtimeSet, jsHandler } = options;
     let source = templeteHandler(rawSource, options);
-    const regexps = makeCustomAttributes(options.customAttributesEntities);
-    if (regexps) {
-        if (Array.isArray(regexps)) {
-            for (const regexp of regexps) {
-                source = source.replace(regexp.tagRegexp, (m0) => {
-                    return m0.replace(regexp.attrRegexp, (m1, className) => {
-                        return m1.replace(className, templeteReplacer(className, options));
-                    });
+    const regexps = makeCustomAttributes(customAttributesEntities);
+    if (regexps && Array.isArray(regexps)) {
+        for (const regexp of regexps) {
+            source = source.replace(regexp.tagRegexp, (m0) => {
+                return m0.replace(regexp.attrRegexp, (m1, className) => {
+                    return m1.replace(className, templeteReplacer(className, options));
                 });
-            }
+            });
         }
-        return source;
     }
-    else {
-        return source;
+    if (inlineWxs) {
+        const wxsTags = extract(source, wxsTagRegexp);
+        for (const x of wxsTags) {
+            const code = jsHandler(x.raw, runtimeSet).code;
+            source = source.replaceAll(x.raw, code);
+        }
     }
+    return source;
 }
 function createTempleteHandler(options = {}) {
     return (rawSource, opt = {}) => {
@@ -721,11 +728,12 @@ function getOptions(options = {}) {
     normalizeMatcher(options, 'cssMatcher');
     normalizeMatcher(options, 'htmlMatcher');
     normalizeMatcher(options, 'jsMatcher');
+    normalizeMatcher(options, 'wxsMatcher');
     normalizeMatcher(options, 'mainCssChunkMatcher');
     const result = defu(options, defaultOptions, {
         minifiedJs: isProd()
     });
-    const { cssPreflight, customRuleCallback, cssPreflightRange, replaceUniversalSelectorWith, customAttributes, customReplaceDictionary, supportCustomLengthUnitsPatch, arbitraryValues, cssChildCombinatorReplaceValue } = result;
+    const { cssPreflight, customRuleCallback, cssPreflightRange, replaceUniversalSelectorWith, customAttributes, customReplaceDictionary, supportCustomLengthUnitsPatch, arbitraryValues, cssChildCombinatorReplaceValue, inlineWxs, injectAdditionalCssVarScope } = result;
     result.escapeMap = customReplaceDictionary;
     const cssInjectPreflight = createInjectPreflight(cssPreflight);
     const customAttributesEntities = isMap(options.customAttributes)
@@ -734,26 +742,32 @@ function getOptions(options = {}) {
     const { escapeMap, minifiedJs } = result;
     const { initMangle, mangleContext, setMangleRuntimeSet } = useMangleStore();
     initMangle(options.mangle);
-    result.templeteHandler = createTempleteHandler({
-        customAttributesEntities,
-        escapeMap,
-        mangleContext
-    });
-    result.styleHandler = createStyleHandler({
+    const styleHandler = createStyleHandler({
         cssInjectPreflight,
         customRuleCallback,
         cssPreflightRange,
         replaceUniversalSelectorWith,
         escapeMap,
         mangleContext,
-        cssChildCombinatorReplaceValue
+        cssChildCombinatorReplaceValue,
+        injectAdditionalCssVarScope
     });
-    result.jsHandler = createjsHandler({
+    result.styleHandler = styleHandler;
+    const jsHandler = createjsHandler({
         minifiedJs,
         escapeMap,
         mangleContext,
         arbitraryValues
     });
+    result.jsHandler = jsHandler;
+    const templeteHandler = createTempleteHandler({
+        customAttributesEntities,
+        escapeMap,
+        mangleContext,
+        inlineWxs,
+        jsHandler
+    });
+    result.templeteHandler = templeteHandler;
     result.patch = createPatch(supportCustomLengthUnitsPatch);
     result.setMangleRuntimeSet = setMangleRuntimeSet;
     return result;

package/dist/{options-879de0a2.mjs → options-f7b71f03.mjs}

@@ -6,7 +6,7 @@ import traverse from '@babel/traverse';
 import { replaceJs as replaceWxml } from './replace.mjs';
 import { S as SimpleMappingChars2String, M as MappingChars2String } from './shared-7c88fb94.mjs';
 import postcss from 'postcss';
-import { p as postcssWeappTailwindcss } from './postcss-ea625621.mjs';
+import { p as postcssWeappTailwindcss } from './postcss-760298ba.mjs';
 import postcssIsPseudoClass from '@csstools/postcss-is-pseudo-class';
 import path from 'node:path';
 import fs from 'node:fs';
@@ -84,7 +84,7 @@ function groupBy(arr, cb) {
     return result;
 }
 function getGroupedEntries(entries, options) {
-    const { cssMatcher, htmlMatcher, jsMatcher } = options;
+    const { cssMatcher, htmlMatcher, jsMatcher, wxsMatcher } = options;
     const groupedEntries = groupBy(entries, ([file]) => {
         if (cssMatcher(file)) {
             return 'css';
@@ -92,7 +92,7 @@ function getGroupedEntries(entries, options) {
         else if (htmlMatcher(file)) {
             return 'html';
         }
-        else if (jsMatcher(file)) {
+        else if (jsMatcher(file) || wxsMatcher(file)) {
             return 'js';
         }
         else {
@@ -180,9 +180,7 @@ function makeCustomAttributes(entries) {
     }
 }
 const variableRegExp = /{{(.*?)}}/gs;
-function variableMatch(original) {
-    return variableRegExp.exec(original);
-}
+const wxsTagRegexp = /<wxs\s*(?:[a-z][a-z-]*[a-z]*(?:\s*=\s*".*?")?)*\s*>(.*?)<\/wxs>/gs;
 
 const validateFilterRE = /[\w%-?\u00A0-\uFFFF-]/;
 function isValidSelector(selector = '') {
@@ -310,6 +308,9 @@ const defaultOptions = {
             }
         }
     },
+    wxsMatcher: (file) => {
+        return false;
+    },
     cssPreflight: {
         'box-sizing': 'border-box',
         'border-width': '0',
@@ -340,7 +341,9 @@ const defaultOptions = {
     arbitraryValues: {
         allowDoubleQuotes: false
     },
-    cssChildCombinatorReplaceValue: 'view + view'
+    cssChildCombinatorReplaceValue: 'view + view',
+    inlineWxs: false,
+    injectAdditionalCssVarScope: false
 };
 
 function generateCode(match, options = {}) {
@@ -368,23 +371,24 @@ function generateCode(match, options = {}) {
     });
     return code;
 }
-function extractSource(original) {
-    let match = variableMatch(original);
+function extract(original, reg) {
+    let match = reg.exec(original);
     const sources = [];
     while (match !== null) {
         const start = match.index;
-        const end = variableRegExp.lastIndex;
+        const end = reg.lastIndex;
         sources.push({
             start,
             end,
-            raw: match[1],
-            prevConcatenated: !/\s/.test(original[start - 1]),
-            nextConcatenated: !/\s/.test(original[end])
+            raw: match[1]
         });
-        match = variableMatch(original);
+        match = reg.exec(original);
     }
     return sources;
 }
+function extractSource(original) {
+    return extract(original, variableRegExp);
+}
 function templeteReplacer(original, options = {}) {
     const sources = extractSource(original);
     if (sources.length > 0) {
@@ -435,24 +439,27 @@ function templeteHandler(rawSource, options = {}) {
         });
     });
 }
-function customTempleteHandler(rawSource, options = {}) {
+function customTempleteHandler(rawSource, options) {
+    const { customAttributesEntities, inlineWxs, runtimeSet, jsHandler } = options;
     let source = templeteHandler(rawSource, options);
-    const regexps = makeCustomAttributes(options.customAttributesEntities);
-    if (regexps) {
-        if (Array.isArray(regexps)) {
-            for (const regexp of regexps) {
-                source = source.replace(regexp.tagRegexp, (m0) => {
-                    return m0.replace(regexp.attrRegexp, (m1, className) => {
-                        return m1.replace(className, templeteReplacer(className, options));
-                    });
+    const regexps = makeCustomAttributes(customAttributesEntities);
+    if (regexps && Array.isArray(regexps)) {
+        for (const regexp of regexps) {
+            source = source.replace(regexp.tagRegexp, (m0) => {
+                return m0.replace(regexp.attrRegexp, (m1, className) => {
+                    return m1.replace(className, templeteReplacer(className, options));
                 });
-            }
+            });
         }
-        return source;
     }
-    else {
-        return source;
+    if (inlineWxs) {
+        const wxsTags = extract(source, wxsTagRegexp);
+        for (const x of wxsTags) {
+            const code = jsHandler(x.raw, runtimeSet).code;
+            source = source.replaceAll(x.raw, code);
+        }
     }
+    return source;
 }
 function createTempleteHandler(options = {}) {
     return (rawSource, opt = {}) => {
@@ -691,11 +698,12 @@ function getOptions(options = {}) {
     normalizeMatcher(options, 'cssMatcher');
     normalizeMatcher(options, 'htmlMatcher');
     normalizeMatcher(options, 'jsMatcher');
+    normalizeMatcher(options, 'wxsMatcher');
     normalizeMatcher(options, 'mainCssChunkMatcher');
     const result = defu(options, defaultOptions, {
         minifiedJs: isProd()
     });
-    const { cssPreflight, customRuleCallback, cssPreflightRange, replaceUniversalSelectorWith, customAttributes, customReplaceDictionary, supportCustomLengthUnitsPatch, arbitraryValues, cssChildCombinatorReplaceValue } = result;
+    const { cssPreflight, customRuleCallback, cssPreflightRange, replaceUniversalSelectorWith, customAttributes, customReplaceDictionary, supportCustomLengthUnitsPatch, arbitraryValues, cssChildCombinatorReplaceValue, inlineWxs, injectAdditionalCssVarScope } = result;
     result.escapeMap = customReplaceDictionary;
     const cssInjectPreflight = createInjectPreflight(cssPreflight);
     const customAttributesEntities = isMap(options.customAttributes)
@@ -704,26 +712,32 @@ function getOptions(options = {}) {
     const { escapeMap, minifiedJs } = result;
     const { initMangle, mangleContext, setMangleRuntimeSet } = useMangleStore();
     initMangle(options.mangle);
-    result.templeteHandler = createTempleteHandler({
-        customAttributesEntities,
-        escapeMap,
-        mangleContext
-    });
-    result.styleHandler = createStyleHandler({
+    const styleHandler = createStyleHandler({
         cssInjectPreflight,
         customRuleCallback,
         cssPreflightRange,
         replaceUniversalSelectorWith,
         escapeMap,
         mangleContext,
-        cssChildCombinatorReplaceValue
+        cssChildCombinatorReplaceValue,
+        injectAdditionalCssVarScope
     });
-    result.jsHandler = createjsHandler({
+    result.styleHandler = styleHandler;
+    const jsHandler = createjsHandler({
         minifiedJs,
         escapeMap,
         mangleContext,
         arbitraryValues
     });
+    result.jsHandler = jsHandler;
+    const templeteHandler = createTempleteHandler({
+        customAttributesEntities,
+        escapeMap,
+        mangleContext,
+        inlineWxs,
+        jsHandler
+    });
+    result.templeteHandler = templeteHandler;
     result.patch = createPatch(supportCustomLengthUnitsPatch);
     result.setMangleRuntimeSet = setMangleRuntimeSet;
     return result;

package/dist/postcss/cssVars.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    prop: string;
+    value: string;
+}[];
+export default _default;

package/dist/postcss/mp.d.ts

@@ -1,4 +1,8 @@
 import { Rule } from 'postcss';
 import type { IStyleHandlerOptions } from "../types";
 export declare function testIfVariablesScope(node: Rule, count?: number): boolean;
+export declare function testIfTwBackdrop(node: Rule, count?: number): boolean;
+export declare function makePseudoVarRule(): Rule;
+export declare function remakeCssVarSelector(selectors: string[], cssPreflightRange: IStyleHandlerOptions['cssPreflightRange']): string[];
+export declare function remakeCombinatorSelector(selector: string, cssChildCombinatorReplaceValue: IStyleHandlerOptions['cssChildCombinatorReplaceValue']): string;
 export declare function commonChunkPreflight(node: Rule, options: IStyleHandlerOptions): void;