@unocss/postcss 0.56.4 → 0.57.0

package/dist/index.cjs

@@ -7,16 +7,14 @@ const fg = require('fast-glob');
 const postcss = require('postcss');
 const core = require('@unocss/core');
 const config = require('@unocss/config');
-const cssTree = require('css-tree');
 const ruleUtils = require('@unocss/rule-utils');
-const MagicString = require('magic-string');
+const cssTree = require('css-tree');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
 
 const process__default = /*#__PURE__*/_interopDefaultCompat(process);
 const fg__default = /*#__PURE__*/_interopDefaultCompat(fg);
 const postcss__default = /*#__PURE__*/_interopDefaultCompat(postcss);
-const MagicString__default = /*#__PURE__*/_interopDefaultCompat(MagicString);
 
 const defaultFilesystemGlobs = [
   "**/*.{html,js,ts,jsx,tsx,vue,svelte,astro,elm,php,phtml,mdx,md}"
@@ -85,45 +83,9 @@ async function parseApply(root, uno, directiveName) {
   });
 }
 
-function themeFnRE(directiveName) {
-  return new RegExp(`${directiveName}\\((.*?)\\)`, "g");
-}
-async function parseTheme(root, uno, directiveName) {
+async function parseTheme(root, uno) {
   root.walkDecls((decl) => {
-    const matches = Array.from(decl.value.matchAll(themeFnRE(directiveName)));
-    if (!matches.length)
-      return;
-    for (const match of matches) {
-      const rawArg = match[1].trim();
-      if (!rawArg)
-        throw new Error(`${directiveName}() expect exact one argument, but got 0`);
-      const [rawKey, alpha] = rawArg.slice(1, -1).split("/");
-      let value = uno.config.theme;
-      const keys = rawKey.trim().split(".");
-      keys.every((key) => {
-        if (value[key] != null)
-          value = value[key];
-        else if (value[+key] != null)
-          value = value[+key];
-        else
-          return false;
-        return true;
-      });
-      if (typeof value === "string") {
-        if (alpha) {
-          const color = ruleUtils.parseCssColor(value);
-          if (color)
-            value = ruleUtils.colorToString(color, alpha);
-        }
-        const code = new MagicString__default(decl.value);
-        code.overwrite(
-          match.index,
-          match.index + match[0].length,
-          value
-        );
-        decl.value = code.toString();
-      }
-    }
+    decl.value = ruleUtils.transformThemeFn(decl.value, uno.config.theme);
   });
 }
 
@@ -146,9 +108,9 @@ async function parseScreen(root, uno, directiveName) {
         breakpoints = uno.userConfig.theme.breakpoints;
       if (!breakpoints)
         breakpoints = uno.config.theme.breakpoints;
-      return breakpoints;
+      return breakpoints ? Object.entries(breakpoints).sort((a, b) => Number.parseInt(a[1].replace(/[a-z]+/gi, "")) - Number.parseInt(b[1].replace(/[a-z]+/gi, ""))).map(([point, size]) => ({ point, size })) : void 0;
     };
-    const variantEntries = Object.entries(resolveBreakpoints() ?? {}).map(([point, size], idx) => [point, size, idx]);
+    const variantEntries = (resolveBreakpoints() ?? []).map(({ point, size }, idx) => [point, size, idx]);
     const generateMediaQuery = (breakpointName2, prefix2) => {
       const [, size, idx] = variantEntries.find((i) => i[0] === breakpointName2);
       if (prefix2) {
@@ -175,9 +137,6 @@ function calcMaxWidthBySize(size) {
 }
 
 function unocss(options = {}) {
-  core.warnOnce(
-    "`@unocss/postcss` package is in an experimental state right now. It doesn't follow semver, and may introduce breaking changes in patch versions."
-  );
   const {
     cwd = process__default.cwd(),
     configOrPath
@@ -215,9 +174,8 @@ function unocss(options = {}) {
                 return false;
             });
             if (!isTarget) {
-              const themeFn = themeFnRE(directiveMap.theme);
               root.walkDecls((decl) => {
-                if (themeFn.test(decl.value)) {
+                if (ruleUtils.hasThemeFn(decl.value)) {
                   isTarget = true;
                   return false;
                 }
@@ -254,7 +212,7 @@ function unocss(options = {}) {
           stats: true
         });
         await parseApply(root, uno, directiveMap.apply);
-        await parseTheme(root, uno, directiveMap.theme);
+        await parseTheme(root, uno);
         await parseScreen(root, uno, directiveMap.screen);
         promises$1.push(
           ...plainContent.map(async (c2, idx) => {

package/dist/index.mjs

@@ -3,11 +3,10 @@ import { normalize } from 'node:path';
 import process from 'node:process';
 import fg from 'fast-glob';
 import postcss from 'postcss';
-import { expandVariantGroup, notNull, regexScopePlaceholder, warnOnce, createGenerator } from '@unocss/core';
+import { expandVariantGroup, notNull, regexScopePlaceholder, createGenerator } from '@unocss/core';
 import { loadConfig } from '@unocss/config';
+import { transformThemeFn, hasThemeFn } from '@unocss/rule-utils';
 import { parse, generate, clone } from 'css-tree';
-import { parseCssColor, colorToString } from '@unocss/rule-utils';
-import MagicString from 'magic-string';
 
 const defaultFilesystemGlobs = [
   "**/*.{html,js,ts,jsx,tsx,vue,svelte,astro,elm,php,phtml,mdx,md}"
@@ -76,45 +75,9 @@ async function parseApply(root, uno, directiveName) {
   });
 }
 
-function themeFnRE(directiveName) {
-  return new RegExp(`${directiveName}\\((.*?)\\)`, "g");
-}
-async function parseTheme(root, uno, directiveName) {
+async function parseTheme(root, uno) {
   root.walkDecls((decl) => {
-    const matches = Array.from(decl.value.matchAll(themeFnRE(directiveName)));
-    if (!matches.length)
-      return;
-    for (const match of matches) {
-      const rawArg = match[1].trim();
-      if (!rawArg)
-        throw new Error(`${directiveName}() expect exact one argument, but got 0`);
-      const [rawKey, alpha] = rawArg.slice(1, -1).split("/");
-      let value = uno.config.theme;
-      const keys = rawKey.trim().split(".");
-      keys.every((key) => {
-        if (value[key] != null)
-          value = value[key];
-        else if (value[+key] != null)
-          value = value[+key];
-        else
-          return false;
-        return true;
-      });
-      if (typeof value === "string") {
-        if (alpha) {
-          const color = parseCssColor(value);
-          if (color)
-            value = colorToString(color, alpha);
-        }
-        const code = new MagicString(decl.value);
-        code.overwrite(
-          match.index,
-          match.index + match[0].length,
-          value
-        );
-        decl.value = code.toString();
-      }
-    }
+    decl.value = transformThemeFn(decl.value, uno.config.theme);
   });
 }
 
@@ -137,9 +100,9 @@ async function parseScreen(root, uno, directiveName) {
         breakpoints = uno.userConfig.theme.breakpoints;
       if (!breakpoints)
         breakpoints = uno.config.theme.breakpoints;
-      return breakpoints;
+      return breakpoints ? Object.entries(breakpoints).sort((a, b) => Number.parseInt(a[1].replace(/[a-z]+/gi, "")) - Number.parseInt(b[1].replace(/[a-z]+/gi, ""))).map(([point, size]) => ({ point, size })) : void 0;
     };
-    const variantEntries = Object.entries(resolveBreakpoints() ?? {}).map(([point, size], idx) => [point, size, idx]);
+    const variantEntries = (resolveBreakpoints() ?? []).map(({ point, size }, idx) => [point, size, idx]);
     const generateMediaQuery = (breakpointName2, prefix2) => {
       const [, size, idx] = variantEntries.find((i) => i[0] === breakpointName2);
       if (prefix2) {
@@ -166,9 +129,6 @@ function calcMaxWidthBySize(size) {
 }
 
 function unocss(options = {}) {
-  warnOnce(
-    "`@unocss/postcss` package is in an experimental state right now. It doesn't follow semver, and may introduce breaking changes in patch versions."
-  );
   const {
     cwd = process.cwd(),
     configOrPath
@@ -206,9 +166,8 @@ function unocss(options = {}) {
                 return false;
             });
             if (!isTarget) {
-              const themeFn = themeFnRE(directiveMap.theme);
               root.walkDecls((decl) => {
-                if (themeFn.test(decl.value)) {
+                if (hasThemeFn(decl.value)) {
                   isTarget = true;
                   return false;
                 }
@@ -245,7 +204,7 @@ function unocss(options = {}) {
           stats: true
         });
         await parseApply(root, uno, directiveMap.apply);
-        await parseTheme(root, uno, directiveMap.theme);
+        await parseTheme(root, uno);
         await parseScreen(root, uno, directiveMap.screen);
         promises.push(
           ...plainContent.map(async (c2, idx) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/postcss",
-  "version": "0.56.4",
+  "version": "0.57.0",
   "description": "PostCSS plugin for UnoCSS",
   "author": "sibbng <sibbngheid@gmail.com>",
   "license": "MIT",
@@ -38,11 +38,11 @@
   "dependencies": {
     "css-tree": "^2.3.1",
     "fast-glob": "^3.3.1",
-    "magic-string": "^0.30.3",
-    "postcss": "^8.4.30",
-    "@unocss/config": "0.56.4",
-    "@unocss/core": "0.56.4",
-    "@unocss/rule-utils": "0.56.4"
+    "magic-string": "^0.30.5",
+    "postcss": "^8.4.31",
+    "@unocss/config": "0.57.0",
+    "@unocss/core": "0.57.0",
+    "@unocss/rule-utils": "0.57.0"
   },
   "scripts": {
     "build": "unbuild",