@tailwindcss-mangle/core 2.1.0 → 2.2.0

package/dist/index.mjs

@@ -1,12 +1,19 @@
+import fs from 'node:fs';
+import { resolve, isAbsolute } from 'node:path';
+import { ClassGenerator, defaultMangleClassFilter, splitCode, makeRegex } from '@tailwindcss-mangle/shared';
+export { ClassGenerator } from '@tailwindcss-mangle/shared';
+import { getConfig } from '@tailwindcss-mangle/config';
+import { sort } from 'fast-sort';
+import micromatch from 'micromatch';
 import postcss from 'postcss';
 import parser from 'postcss-selector-parser';
 import { html, defaultTreeAdapter, parse, serialize } from 'parse5';
-import { splitCode, makeRegex } from '@tailwindcss-mangle/shared';
-export { ClassGenerator } from '@tailwindcss-mangle/shared';
-import babel, { transformSync } from '@babel/core';
+import babel, { transformSync as transformSync$1 } from '@babel/core';
 import { declare } from '@babel/helper-plugin-utils';
 import MagicString from 'magic-string';
 import { jsStringEscape } from '@ast-core/escape';
+import { parse as parse$1 } from '@babel/parser';
+import traverse$1 from '@babel/traverse';
 
 
 
@@ -59,7 +66,126 @@ function createDefu(merger) {
 }
 const defu = createDefu();
 
+const { isMatch } = micromatch;
+function escapeStringRegexp(str) {
+  if (typeof str !== "string") {
+    throw new TypeError("Expected a string");
+  }
+  return str.replaceAll(/[$()*+.?[\\\]^{|}]/g, "\\$&").replaceAll("-", "\\x2d");
+}
+function createGlobMatcher(pattern, fallbackValue = false) {
+  if (pattern === void 0) {
+    return function() {
+      return fallbackValue;
+    };
+  }
+  return function(file) {
+    return isMatch(file, pattern);
+  };
+}
+
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class Context {
+  constructor() {
+    __publicField(this, "options");
+    __publicField(this, "includeMatcher");
+    __publicField(this, "excludeMatcher");
+    __publicField(this, "replaceMap");
+    __publicField(this, "classSet");
+    __publicField(this, "classGenerator");
+    __publicField(this, "preserveFunctionSet");
+    __publicField(this, "preserveClassNamesSet");
+    __publicField(this, "preserveFunctionRegexs");
+    this.options = {};
+    this.classSet = /* @__PURE__ */ new Set();
+    this.replaceMap = /* @__PURE__ */ new Map();
+    this.includeMatcher = () => true;
+    this.excludeMatcher = () => false;
+    this.classGenerator = new ClassGenerator();
+    this.preserveFunctionSet = /* @__PURE__ */ new Set();
+    this.preserveClassNamesSet = /* @__PURE__ */ new Set();
+    this.preserveFunctionRegexs = [];
+  }
+  isPreserveClass(className) {
+    return this.preserveClassNamesSet.has(className);
+  }
+  addPreserveClass(className) {
+    return this.preserveClassNamesSet.add(className);
+  }
+  isPreserveFunction(calleeName) {
+    return this.preserveFunctionSet.has(calleeName);
+  }
+  mergeOptions(...opts) {
+    this.options = defu(this.options, ...opts);
+    this.includeMatcher = createGlobMatcher(this.options.include, true);
+    this.excludeMatcher = createGlobMatcher(this.options.exclude, false);
+    this.classGenerator = new ClassGenerator(this.options.classGenerator);
+    this.preserveFunctionSet = new Set(this.options?.preserveFunction ?? []);
+    this.preserveFunctionRegexs = [...this.preserveFunctionSet.values()].map((x) => {
+      return new RegExp(escapeStringRegexp(x) + "\\(([^)]*)\\)", "g");
+    });
+  }
+  isInclude(file) {
+    return this.includeMatcher(file) && !this.excludeMatcher(file);
+  }
+  currentMangleClassFilter(className) {
+    return (this.options.mangleClassFilter ?? defaultMangleClassFilter)(className);
+  }
+  getClassSet() {
+    return this.classSet;
+  }
+  getReplaceMap() {
+    return this.replaceMap;
+  }
+  addToUsedBy(key, file) {
+    const hit = this.classGenerator.newClassMap[key];
+    if (hit) {
+      hit.usedBy.add(file);
+    }
+  }
+  loadClassSet(classList) {
+    const list = sort(classList).desc((c) => c.length);
+    for (const className of list) {
+      if (this.currentMangleClassFilter(className)) {
+        this.classSet.add(className);
+      }
+    }
+  }
+  async initConfig(opts = {}) {
+    const { cwd, classList: _classList, mangleOptions } = opts;
+    const { config, cwd: configCwd } = await getConfig(cwd);
+    this.mergeOptions(mangleOptions, config?.mangle);
+    if (_classList) {
+      this.loadClassSet(_classList);
+    } else {
+      let jsonPath = this.options.classListPath ?? resolve(process.cwd(), config?.patch?.output?.filename);
+      if (!isAbsolute(jsonPath)) {
+        jsonPath = resolve(configCwd ?? process.cwd(), jsonPath);
+      }
+      if (jsonPath && fs.existsSync(jsonPath)) {
+        const rawClassList = fs.readFileSync(jsonPath, "utf8");
+        const list = JSON.parse(rawClassList);
+        this.loadClassSet(list);
+      }
+    }
+    for (const cls of this.classSet) {
+      this.classGenerator.generateClassName(cls);
+    }
+    for (const x of Object.entries(this.classGenerator.newClassMap)) {
+      this.replaceMap.set(x[0], x[1].name);
+    }
+    return config;
+  }
+  // ["clsx\\(([^)]*)\\)", "(?:'|\"|`)([^']*)(?:'|\"|`)"]
+}
+
 const postcssPlugin = "postcss-mangle-tailwindcss-plugin";
+const clonedKey = "__tw_mangle_cloned__";
 function isVueScoped(s) {
   if (s.parent) {
     const index = s.parent.nodes.indexOf(s);
@@ -73,12 +199,15 @@ function isVueScoped(s) {
   return false;
 }
 const transformSelectorPostcssPlugin = function(options) {
-  const { ignoreVueScoped, replaceMap } = defu(options, {
+  const { ignoreVueScoped, replaceMap, ctx } = defu(options, {
     ignoreVueScoped: true
   });
   return {
     postcssPlugin,
     async Rule(rule) {
+      if (rule[clonedKey]) {
+        return;
+      }
       await parser((selectors) => {
         selectors.walkClasses((s) => {
           if (s.value && replaceMap && replaceMap.has(s.value)) {
@@ -87,6 +216,10 @@ const transformSelectorPostcssPlugin = function(options) {
             }
             const v = replaceMap.get(s.value);
             if (v) {
+              if (ctx.isPreserveClass(s.value)) {
+                const r = rule.cloneBefore();
+                r[clonedKey] = true;
+              }
               s.value = v;
             }
           }
@@ -203,7 +336,7 @@ function traverse(node, visitor, parent) {
 }
 
 function htmlHandler(rawSource, options) {
-  const { replaceMap, classGenerator } = options;
+  const { replaceMap, ctx } = options;
   const fragment = parse(rawSource);
   traverse(fragment, {
     element(node) {
@@ -214,7 +347,7 @@ function htmlHandler(rawSource, options) {
         });
         for (const v of array) {
           if (replaceMap.has(v)) {
-            attribute.value = attribute.value.replace(makeRegex(v), classGenerator.generateClassName(v).name);
+            attribute.value = attribute.value.replace(makeRegex(v), ctx.classGenerator.generateClassName(v).name);
           }
         }
       }
@@ -225,136 +358,46 @@ function htmlHandler(rawSource, options) {
 
 const isProd = () => process.env.NODE_ENV === "production";
 
-// >>> INTERFACES <<<
-// >>> HELPERS <<<
-var castComparer = function (comparer) { return function (a, b, order) { return comparer(a, b, order) * order; }; };
-var throwInvalidConfigErrorIfTrue = function (condition, context) {
-    if (condition)
-        throw Error("Invalid sort config: " + context);
-};
-var unpackObjectSorter = function (sortByObj) {
-    var _a = sortByObj || {}, asc = _a.asc, desc = _a.desc;
-    var order = asc ? 1 : -1;
-    var sortBy = (asc || desc);
-    // Validate object config
-    throwInvalidConfigErrorIfTrue(!sortBy, 'Expected `asc` or `desc` property');
-    throwInvalidConfigErrorIfTrue(asc && desc, 'Ambiguous object with `asc` and `desc` config properties');
-    var comparer = sortByObj.comparer && castComparer(sortByObj.comparer);
-    return { order: order, sortBy: sortBy, comparer: comparer };
-};
-// >>> SORTERS <<<
-var multiPropertySorterProvider = function (defaultComparer) {
-    return function multiPropertySorter(sortBy, sortByArr, depth, order, comparer, a, b) {
-        var valA;
-        var valB;
-        if (typeof sortBy === 'string') {
-            valA = a[sortBy];
-            valB = b[sortBy];
-        }
-        else if (typeof sortBy === 'function') {
-            valA = sortBy(a);
-            valB = sortBy(b);
-        }
-        else {
-            var objectSorterConfig = unpackObjectSorter(sortBy);
-            return multiPropertySorter(objectSorterConfig.sortBy, sortByArr, depth, objectSorterConfig.order, objectSorterConfig.comparer || defaultComparer, a, b);
-        }
-        var equality = comparer(valA, valB, order);
-        if ((equality === 0 || (valA == null && valB == null)) &&
-            sortByArr.length > depth) {
-            return multiPropertySorter(sortByArr[depth], sortByArr, depth + 1, order, comparer, a, b);
-        }
-        return equality;
-    };
-};
-function getSortStrategy(sortBy, comparer, order) {
-    // Flat array sorter
-    if (sortBy === undefined || sortBy === true) {
-        return function (a, b) { return comparer(a, b, order); };
-    }
-    // Sort list of objects by single object key
-    if (typeof sortBy === 'string') {
-        throwInvalidConfigErrorIfTrue(sortBy.includes('.'), 'String syntax not allowed for nested properties.');
-        return function (a, b) { return comparer(a[sortBy], b[sortBy], order); };
-    }
-    // Sort list of objects by single function sorter
-    if (typeof sortBy === 'function') {
-        return function (a, b) { return comparer(sortBy(a), sortBy(b), order); };
-    }
-    // Sort by multiple properties
-    if (Array.isArray(sortBy)) {
-        var multiPropSorter_1 = multiPropertySorterProvider(comparer);
-        return function (a, b) { return multiPropSorter_1(sortBy[0], sortBy, 1, order, comparer, a, b); };
-    }
-    // Unpack object config to get actual sorter strategy
-    var objectSorterConfig = unpackObjectSorter(sortBy);
-    return getSortStrategy(objectSorterConfig.sortBy, objectSorterConfig.comparer || comparer, objectSorterConfig.order);
-}
-var sortArray = function (order, ctx, sortBy, comparer) {
-    var _a;
-    if (!Array.isArray(ctx)) {
-        return ctx;
-    }
-    // Unwrap sortBy if array with only 1 value to get faster sort strategy
-    if (Array.isArray(sortBy) && sortBy.length < 2) {
-        _a = sortBy, sortBy = _a[0];
-    }
-    return ctx.sort(getSortStrategy(sortBy, comparer, order));
-};
-function createNewSortInstance(opts) {
-    var comparer = castComparer(opts.comparer);
-    return function (arrayToSort) {
-        var ctx = Array.isArray(arrayToSort) && !opts.inPlaceSorting
-            ? arrayToSort.slice()
-            : arrayToSort;
-        return {
-            asc: function (sortBy) {
-                return sortArray(1, ctx, sortBy, comparer);
-            },
-            desc: function (sortBy) {
-                return sortArray(-1, ctx, sortBy, comparer);
-            },
-            by: function (sortBy) {
-                return sortArray(1, ctx, sortBy, comparer);
-            },
-        };
-    };
-}
-var defaultComparer = function (a, b, order) {
-    if (a == null)
-        return order;
-    if (b == null)
-        return -order;
-    if (typeof a !== typeof b) {
-        return typeof a < typeof b ? -1 : 1;
-    }
-    if (a < b)
-        return -1;
-    if (a > b)
-        return 1;
-    return 0;
-};
-var sort = createNewSortInstance({
-    comparer: defaultComparer,
-});
-createNewSortInstance({
-    comparer: defaultComparer,
-    inPlaceSorting: true,
-});
+function getStringLiteralCalleeName(path) {
+  if (path.parentPath.isCallExpression()) {
+    const callee = path.parentPath.get("callee");
+    if (callee.isIdentifier()) {
+      return callee.node.name;
+    }
+  }
+}
+function getTemplateElementCalleeName(path) {
+  if (path.parentPath.isTemplateLiteral()) {
+    const pp = path.parentPath;
+    if (pp.parentPath.isCallExpression()) {
+      const callee = pp.parentPath.get("callee");
+      if (callee.isIdentifier()) {
+        return callee.node.name;
+      }
+    }
+  }
+}
 
 function handleValue$1(options) {
-  const { addToUsedBy, id, magicString, node, raw, replaceMap, offset = 0, escape = false } = options;
+  const { ctx, id, path, magicString, raw, replaceMap, offset = 0, escape = false, preserve = false } = options;
+  const node = path.node;
   let value = raw;
   const arr = sort(splitCode(value)).desc((x) => x.length);
   for (const str of arr) {
     if (replaceMap.has(str)) {
-      addToUsedBy(str, id);
+      ctx.addToUsedBy(str, id);
+      if (preserve) {
+        ctx.addPreserveClass(str);
+      }
       const v = replaceMap.get(str);
       if (v) {
         value = value.replaceAll(str, v);
       }
     }
   }
+  if (preserve) {
+    return;
+  }
   if (typeof node.start === "number" && typeof node.end === "number" && value) {
     const start = node.start + offset;
     const end = node.end - offset;
@@ -363,48 +406,56 @@ function handleValue$1(options) {
     }
   }
 }
-const plugin = declare((api, options) => {
+const JsPlugin = declare((api, options) => {
   api.assertVersion(7);
-  const { magicString, replaceMap, id, addToUsedBy } = options;
+  const { magicString, replaceMap, id, ctx } = options;
   return {
     visitor: {
       StringLiteral: {
         enter(p) {
-          const node = p.node;
-          handleValue$1({
-            addToUsedBy,
+          const opts = {
+            ctx,
             id,
             magicString,
-            node,
-            raw: node.value,
+            path: p,
+            raw: p.node.value,
             replaceMap,
             offset: 1,
-            escape: true
-          });
+            escape: true,
+            preserve: false
+          };
+          const calleeName = getStringLiteralCalleeName(p);
+          if (calleeName && ctx.isPreserveFunction(calleeName)) {
+            opts.preserve = true;
+          }
+          handleValue$1(opts);
         }
       },
       TemplateElement: {
         enter(p) {
-          const node = p.node;
-          handleValue$1({
-            addToUsedBy,
+          const opts = {
+            ctx,
             id,
             magicString,
-            node,
-            raw: node.value.raw,
+            path: p,
+            raw: p.node.value.raw,
             replaceMap,
             offset: 0,
-            escape: false
-          });
+            escape: false,
+            preserve: false
+          };
+          const calleeName = getTemplateElementCalleeName(p);
+          if (calleeName && ctx.isPreserveFunction(calleeName)) {
+            opts.preserve = true;
+          }
+          handleValue$1(opts);
         }
       }
     }
   };
 });
-function preProcessJs(options) {
-  const { code, replaceMap, id, addToUsedBy } = options;
-  const magicString = typeof code === "string" ? new MagicString(code) : code;
-  babel.transformSync(magicString.original, {
+function transformSync(code, plugins, filename) {
+  babel.transformSync(code, {
     presets: [
       // ['@babel/preset-react', {}],
       [
@@ -415,24 +466,99 @@ function preProcessJs(options) {
         }
       ]
     ],
-    plugins: [
+    plugins,
+    filename
+  });
+}
+function preProcessJs(options) {
+  const { code, replaceMap, id, ctx } = options;
+  const magicString = typeof code === "string" ? new MagicString(code) : code;
+  transformSync(
+    magicString.original,
+    [
       [
-        plugin,
+        JsPlugin,
         {
           magicString,
           replaceMap,
           id,
-          addToUsedBy
+          ctx
         }
       ]
     ],
-    filename: id
-  });
+    id
+  );
+  return magicString.toString();
+}
+function preProcessRawCode(options) {
+  const { code, replaceMap, ctx } = options;
+  const magicString = typeof code === "string" ? new MagicString(code) : code;
+  const markArr = [];
+  for (const regex of ctx.preserveFunctionRegexs) {
+    const allArr = [];
+    let arr = null;
+    while ((arr = regex.exec(magicString.original)) !== null) {
+      allArr.push(arr);
+      markArr.push([arr.index, arr.index + arr[0].length]);
+    }
+    for (const regExpMatch of allArr) {
+      let ast;
+      try {
+        ast = parse$1(regExpMatch[0], {
+          sourceType: "unambiguous"
+        });
+        traverse$1(ast, {
+          StringLiteral: {
+            enter(p) {
+              const arr2 = sort(splitCode(p.node.value)).desc((x) => x.length);
+              for (const v of arr2) {
+                if (replaceMap.has(v)) {
+                  ctx.addPreserveClass(v);
+                }
+              }
+            }
+          },
+          TemplateElement: {
+            enter(p) {
+              const arr2 = sort(splitCode(p.node.value.raw)).desc((x) => x.length);
+              for (const v of arr2) {
+                if (replaceMap.has(v)) {
+                  ctx.addPreserveClass(v);
+                }
+              }
+            }
+          }
+        });
+      } catch {
+        continue;
+      }
+    }
+  }
+  for (const [key, value] of replaceMap) {
+    const regex = new RegExp(escapeStringRegexp(key), "g");
+    let arr = null;
+    while ((arr = regex.exec(magicString.original)) !== null) {
+      const start = arr.index;
+      const end = arr.index + arr[0].length;
+      let shouldUpdate = true;
+      for (const [ps, pe] of markArr) {
+        if (start > ps && start < pe || end < pe && end > ps) {
+          shouldUpdate = false;
+          break;
+        }
+      }
+      if (shouldUpdate) {
+        magicString.update(start, end, value);
+        markArr.push([start, end]);
+      }
+    }
+  }
   return magicString.toString();
 }
 
 function handleValue(raw, node, options) {
-  const { replaceMap, classGenerator: clsGen, splitQuote = true } = options;
+  const { replaceMap, ctx, splitQuote = true } = options;
+  const clsGen = ctx.classGenerator;
   const array = splitCode(raw, {
     splitQuote
   });
@@ -451,7 +577,7 @@ function handleValue(raw, node, options) {
   return rawString;
 }
 function jsHandler(rawSource, options) {
-  const result = transformSync(rawSource, {
+  const result = transformSync$1(rawSource, {
     babelrc: false,
     ast: true,
     plugins: [
@@ -499,4 +625,4 @@ function jsHandler(rawSource, options) {
   return result;
 }
 
-export { cssHandler, handleValue, htmlHandler, jsHandler, preProcessJs };
+export { Context, cssHandler, handleValue, htmlHandler, jsHandler, preProcessJs, preProcessRawCode };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss-mangle/core",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "The core of tailwindcss-mangle",
   "exports": {
     ".": {
@@ -36,27 +36,43 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@ast-core/escape": "^1.0.0",
-    "@babel/core": "^7.22.10",
+    "@ast-core/escape": "^1.0.1",
+    "@babel/core": "^7.22.19",
     "@babel/helper-plugin-utils": "^7.22.5",
-    "@babel/preset-typescript": "^7.22.5",
-    "@babel/types": "^7.22.10",
-    "magic-string": "^0.30.2",
+    "@babel/parser": "^7.22.16",
+    "@babel/preset-typescript": "^7.22.15",
+    "@babel/traverse": "^7.22.19",
+    "@babel/types": "^7.22.19",
+    "fast-sort": "^3.4.0",
+    "magic-string": "^0.30.3",
+    "micromatch": "^4.0.5",
     "parse5": "^7.1.2",
-    "postcss": "^8.4.27",
+    "postcss": "^8.4.29",
     "postcss-selector-parser": "^6.0.13",
-    "@tailwindcss-mangle/shared": "^2.1.0"
+    "@tailwindcss-mangle/config": "^2.2.0",
+    "@tailwindcss-mangle/shared": "^2.2.0"
   },
   "devDependencies": {
-    "@parse5/tools": "^0.2.0",
-    "@types/babel__core": "^7.20.1"
+    "@parse5/tools": "^0.3.0",
+    "@types/babel__core": "^7.20.1",
+    "@types/babel__traverse": "^7.20.1",
+    "@types/micromatch": "^4.0.2",
+    "@vue/compiler-core": "^3.3.4",
+    "@vue/compiler-sfc": "^3.3.4"
   },
   "homepage": "https://github.com/sonofmagic/tailwindcss-mangle",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/sonofmagic/tailwindcss-mangle.git"
   },
+  "bugs": {
+    "url": "https://github.com/sonofmagic/tailwindcss-mangle/issues"
+  },
+  "directories": {
+    "test": "test"
+  },
   "scripts": {
+    "dev": "unbuild --sourcemap",
     "build": "unbuild",
     "test": "vitest run --coverage.enabled",
     "test:dev": "vitest",