@unocss/preset-mini 0.23.0 → 0.24.3

package/dist/chunks/default3.cjs

@@ -58,8 +58,7 @@ const variantCombinators = [
   scopeMatcher(true, "group", "&&-c &&-s"),
   scopeMatcher(true, "parent", "&&-c>&&-s"),
   scopeMatcher(true, "previous", "&&-c+&&-s"),
-  scopeMatcher(true, "peer", "&&-c~&&-s"),
-  variants$1.variantMatcher("svg", (input) => `${input} svg`)
+  scopeMatcher(true, "peer", "&&-c~&&-s")
 ];
 
 const variantMotions = [
@@ -197,6 +196,10 @@ const PartClassesRE = /(part-\[(.+)]:)(.+)/;
 const PseudoElementsRE = new RegExp(`^(${PseudoElementsStr})[:-]`);
 const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
 const PseudoClassFunctionsRE = new RegExp(`^(${PseudoClassFunctionsStr})-(${PseudoClassesStr})[:-]`);
+const sortValue = (pseudo) => {
+  if (pseudo === "active")
+    return 1;
+};
 const taggedPseudoClassMatcher = (tag, parent, combinator) => {
   const re = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
   const rawRe = new RegExp(`^${core.escapeRegExp(parent)}:`);
@@ -208,7 +211,8 @@ const taggedPseudoClassMatcher = (tag, parent, combinator) => {
         pseudo = `:${match[2]}(${pseudo})`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => rawRe.test(s) ? s.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${s}`
+        selector: (s) => rawRe.test(s) ? s.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${s}`,
+        sort: sortValue(match[3])
       };
     }
   };
@@ -230,7 +234,8 @@ const variantPseudoClasses = {
       const pseudo = PseudoClasses[match[1]] || `:${match[1]}`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => `${s}${pseudo}`
+        selector: (s) => `${s}${pseudo}`,
+        sort: sortValue(match[1])
       };
     }
   },

package/dist/chunks/default3.mjs

@@ -1,4 +1,4 @@
-import { v as variantMatcher, a as variantParentMatcher } from './variants.mjs';
+import { v as variantParentMatcher, a as variantMatcher } from './variants.mjs';
 import { toArray, escapeRegExp } from '@unocss/core';
 
 const regexCache = {};
@@ -56,8 +56,7 @@ const variantCombinators = [
   scopeMatcher(true, "group", "&&-c &&-s"),
   scopeMatcher(true, "parent", "&&-c>&&-s"),
   scopeMatcher(true, "previous", "&&-c+&&-s"),
-  scopeMatcher(true, "peer", "&&-c~&&-s"),
-  variantMatcher("svg", (input) => `${input} svg`)
+  scopeMatcher(true, "peer", "&&-c~&&-s")
 ];
 
 const variantMotions = [
@@ -195,6 +194,10 @@ const PartClassesRE = /(part-\[(.+)]:)(.+)/;
 const PseudoElementsRE = new RegExp(`^(${PseudoElementsStr})[:-]`);
 const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
 const PseudoClassFunctionsRE = new RegExp(`^(${PseudoClassFunctionsStr})-(${PseudoClassesStr})[:-]`);
+const sortValue = (pseudo) => {
+  if (pseudo === "active")
+    return 1;
+};
 const taggedPseudoClassMatcher = (tag, parent, combinator) => {
   const re = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
   const rawRe = new RegExp(`^${escapeRegExp(parent)}:`);
@@ -206,7 +209,8 @@ const taggedPseudoClassMatcher = (tag, parent, combinator) => {
         pseudo = `:${match[2]}(${pseudo})`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => rawRe.test(s) ? s.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${s}`
+        selector: (s) => rawRe.test(s) ? s.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${s}`,
+        sort: sortValue(match[3])
       };
     }
   };
@@ -228,7 +232,8 @@ const variantPseudoClasses = {
       const pseudo = PseudoClasses[match[1]] || `:${match[1]}`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => `${s}${pseudo}`
+        selector: (s) => `${s}${pseudo}`,
+        sort: sortValue(match[1])
       };
     }
   },

package/dist/chunks/utilities.cjs

@@ -2,6 +2,7 @@
 
 const core = require('@unocss/core');
 
+const cssColorFunctions = ["hsl", "hsla", "hwb", "lab", "lch", "oklab", "oklch", "rgb", "rgba"];
 function hex2rgba(hex = "") {
   const color = parseHexColor(hex);
   if (color != null) {
@@ -11,41 +12,32 @@ function hex2rgba(hex = "") {
     return [...components, alpha];
   }
 }
-function parseHexColor(str) {
-  const [, body] = str.match(/^#?([\da-f]+)$/i) || [];
-  if (!body)
-    return;
-  switch (body.length) {
-    case 3:
-    case 4:
-      const digits = Array.from(body, (s) => Number.parseInt(s, 16)).map((n) => n << 4 | n);
-      return {
-        type: "rgb",
-        components: digits.slice(0, 3),
-        alpha: body.length === 3 ? void 0 : Math.round(digits[3] / 255 * 100) / 100
-      };
-    case 6:
-    case 8:
-      const value = Number.parseInt(body, 16);
-      return {
-        type: "rgb",
-        components: body.length === 6 ? [value >> 16 & 255, value >> 8 & 255, value & 255] : [value >> 24 & 255, value >> 16 & 255, value >> 8 & 255],
-        alpha: body.length === 6 ? void 0 : Math.round((value & 255) / 255 * 100) / 100
-      };
-  }
-}
 function parseCssColor(str = "") {
   const color = parseColor$1(str);
   if (color == null)
     return;
   const { type: casedType, components, alpha } = color;
   const type = casedType.toLowerCase();
+  if (components.length === 0)
+    return;
   if (["rgba", "hsla"].includes(type) && alpha === void 0)
     return;
-  if (["rgb", "hsl", "hwb", "lab", "lch", "oklab", "oklch"].includes(type) && components.length !== 3)
+  if (cssColorFunctions.includes(type) && components.length !== 3)
     return;
   return { type, components, alpha };
 }
+function colorToString(color, alphaOverride) {
+  const { components } = color;
+  let { alpha, type } = color;
+  alpha = alphaOverride ?? alpha;
+  type = type.toLowerCase();
+  if (["hsla", "hsl", "rgba", "rgb"].includes(type))
+    return `${type.replace("a", "")}a(${components.join(",")}${alpha == null ? "" : `,${alpha}`})`;
+  alpha = alpha == null ? "" : ` / ${alpha}`;
+  if (cssColorFunctions.includes(type))
+    return `${type}(${components.join(" ")}${alpha})`;
+  return `color(${type} ${components.join(" ")}${alpha})`;
+}
 function parseColor$1(str) {
   if (!str)
     return;
@@ -65,10 +57,32 @@ function parseColor$1(str) {
   if (color != null)
     return color;
 }
+function parseHexColor(str) {
+  const [, body] = str.match(/^#?([\da-f]+)$/i) || [];
+  if (!body)
+    return;
+  switch (body.length) {
+    case 3:
+    case 4:
+      const digits = Array.from(body, (s) => Number.parseInt(s, 16)).map((n) => n << 4 | n);
+      return {
+        type: "rgb",
+        components: digits.slice(0, 3),
+        alpha: body.length === 3 ? void 0 : Math.round(digits[3] / 255 * 100) / 100
+      };
+    case 6:
+    case 8:
+      const value = Number.parseInt(body, 16);
+      return {
+        type: "rgb",
+        components: body.length === 6 ? [value >> 16 & 255, value >> 8 & 255, value & 255] : [value >> 24 & 255, value >> 16 & 255, value >> 8 & 255],
+        alpha: body.length === 6 ? void 0 : Math.round((value & 255) / 255 * 100) / 100
+      };
+  }
+}
 function cssColorKeyword(str) {
   const color = {
-    rebeccapurple: [102, 51, 153, 1],
-    transparent: [0, 0, 0, 0]
+    rebeccapurple: [102, 51, 153, 1]
   }[str];
   if (color != null) {
     return {
@@ -78,54 +92,13 @@ function cssColorKeyword(str) {
     };
   }
 }
-function getComponent(separator, str) {
-  const component = str.trim();
-  if (component === "")
-    return;
-  const l = str.length;
-  let parenthesis = 0;
-  for (let i = 0; i < l; i++) {
-    switch (str[i]) {
-      case "(":
-        parenthesis++;
-        break;
-      case ")":
-        if (--parenthesis < 0)
-          return;
-        break;
-      case separator:
-        if (parenthesis === 0) {
-          const component2 = str.slice(0, i).trim();
-          if (component2 === "")
-            return;
-          return [
-            str.slice(0, i).trim(),
-            str.slice(i + 1).trim()
-          ];
-        }
-    }
-  }
-  return [
-    str.trim(),
-    ""
-  ];
-}
 function parseCssCommaColorFunction(color) {
   const match = color.match(/^(rgb|rgba|hsl|hsla)\((.+)\)$/i);
   if (!match)
     return;
   const [, type, componentString] = match;
-  const components = [];
-  let cs = componentString;
-  for (let c = 5; c > 0 && cs !== ""; --c) {
-    const componentValue = getComponent(",", cs);
-    if (!componentValue)
-      return;
-    const [component, rest] = componentValue;
-    components.push(component);
-    cs = rest;
-  }
-  if ([3, 4].includes(components.length)) {
+  const components = getComponents(componentString, ",", 5);
+  if (components && [3, 4].includes(components.length)) {
     return {
       type,
       components: components.slice(0, 3),
@@ -133,8 +106,9 @@ function parseCssCommaColorFunction(color) {
     };
   }
 }
+const cssColorFunctionsRe = new RegExp(`^(${cssColorFunctions.join("|")})\\((.+)\\)$`, "i");
 function parseCssSpaceColorFunction(color) {
-  const match = color.match(/^(rgb|rgba|hsl|hsla|hwb|lab|lch|oklab|oklch)\((.+)\)$/i);
+  const match = color.match(cssColorFunctionsRe);
   if (!match)
     return;
   const [, fn, componentString] = match;
@@ -163,16 +137,9 @@ function parseCssColorFunction(color) {
   }
 }
 function parseCssSpaceColorValues(componentString) {
-  let cs = componentString;
-  const components = [];
-  while (cs !== "") {
-    const cc = getComponent(" ", cs);
-    if (!cc)
-      return;
-    const [component, rest] = cc;
-    components.push(component);
-    cs = rest;
-  }
+  const components = getComponents(componentString);
+  if (!components)
+    return;
   let totalComponents = components.length;
   if (components[totalComponents - 2] === "/") {
     return {
@@ -180,21 +147,14 @@ function parseCssSpaceColorValues(componentString) {
       alpha: components[totalComponents - 1]
     };
   }
-  if (components[totalComponents - 2].endsWith("/") || components[totalComponents - 1].startsWith("/")) {
+  if (components[totalComponents - 2] != null && (components[totalComponents - 2].endsWith("/") || components[totalComponents - 1].startsWith("/"))) {
     const removed = components.splice(totalComponents - 2);
     components.push(removed.join(" "));
     --totalComponents;
   }
-  cs = components[totalComponents - 1];
-  const withAlpha = [];
-  while (cs !== "") {
-    const cc = getComponent("/", cs);
-    if (!cc)
-      return;
-    const [component, rest] = cc;
-    withAlpha.push(component);
-    cs = rest;
-  }
+  const withAlpha = getComponents(components[totalComponents - 1], "/", 3);
+  if (!withAlpha)
+    return;
   if (withAlpha.length === 1 || withAlpha[withAlpha.length - 1] === "")
     return { components };
   const alpha = withAlpha.pop();
@@ -204,6 +164,58 @@ function parseCssSpaceColorValues(componentString) {
     alpha
   };
 }
+function getComponent(str, separator) {
+  str = str.trim();
+  if (str === "")
+    return;
+  const l = str.length;
+  let parenthesis = 0;
+  for (let i = 0; i < l; i++) {
+    switch (str[i]) {
+      case "(":
+        parenthesis++;
+        break;
+      case ")":
+        if (--parenthesis < 0)
+          return;
+        break;
+      case separator:
+        if (parenthesis === 0) {
+          const component = str.slice(0, i).trim();
+          if (component === "")
+            return;
+          return [
+            component,
+            str.slice(i + 1).trim()
+          ];
+        }
+    }
+  }
+  return [
+    str,
+    ""
+  ];
+}
+function getComponents(str, separator, limit) {
+  separator = separator ?? " ";
+  if (separator.length !== 1)
+    return;
+  limit = limit ?? 10;
+  const components = [];
+  let i = 0;
+  while (str !== "") {
+    if (++i > limit)
+      return;
+    const componentPair = getComponent(str, separator);
+    if (!componentPair)
+      return;
+    const [component, rest] = componentPair;
+    components.push(component);
+    str = rest;
+  }
+  if (components.length > 0)
+    return components;
+}
 
 const directionMap = {
   "l": ["-left"],
@@ -509,54 +521,59 @@ const parseColor = (body, theme) => {
     else if (no && colorData)
       color = colorData[no];
   }
-  const rgba = hex2rgba(color);
-  const alpha = opacity ? opacity[0] === "[" ? handler.bracket.percent(opacity) : parseFloat(opacity) / 100 : rgba?.[3];
-  const hasAlpha = alpha != null && !Number.isNaN(alpha);
-  if (rgba) {
-    if (hasAlpha) {
-      rgba[3] = typeof alpha === "string" && !alpha.includes("%") ? parseFloat(alpha) : alpha;
-    } else {
-      rgba.splice(3);
-    }
-  }
   return {
     opacity,
     name,
     no,
     color,
-    rgba,
-    alpha: hasAlpha ? alpha : void 0
+    cssColor: parseCssColor(color),
+    alpha: handler.bracket.cssvar.percent(opacity ?? "")
   };
 };
 const colorResolver = (property, varName) => ([, body], { theme }) => {
   const data = parseColor(body, theme);
   if (!data)
     return;
-  const { alpha, opacity, color, rgba } = data;
-  if (!color)
-    return;
-  if (rgba) {
+  const { alpha, color, cssColor } = data;
+  if (cssColor) {
     if (alpha != null) {
       return {
-        [property]: `rgba(${rgba.join(",")})`
+        [property]: colorToString(cssColor, alpha)
       };
     } else {
       return {
-        [`--un-${varName}-opacity`]: (opacity && handler.cssvar(opacity)) ?? 1,
-        [property]: `rgba(${rgba.join(",")},var(--un-${varName}-opacity))`
+        [`--un-${varName}-opacity`]: cssColor.alpha ?? 1,
+        [property]: colorToString(cssColor, `var(--un-${varName}-opacity)`)
       };
     }
-  } else {
+  } else if (color) {
     return {
-      [property]: color.replace("%alpha", `${alpha || 1}`)
+      [property]: color.replace("%alpha", `${alpha ?? 1}`)
     };
   }
 };
+const colorableShadows = (shadows, colorVar) => {
+  const colored = [];
+  shadows = core.toArray(shadows);
+  for (let i = 0; i < shadows.length; i++) {
+    const components = getComponents(shadows[i], " ", 6);
+    if (!components || components.length < 3)
+      return shadows;
+    const color = parseCssColor(components.pop());
+    if (color == null)
+      return shadows;
+    colored.push(`${components.join(" ")} var(${colorVar}, ${colorToString(color)})`);
+  }
+  return colored;
+};
 
 exports.colorResolver = colorResolver;
+exports.colorToString = colorToString;
+exports.colorableShadows = colorableShadows;
 exports.cornerMap = cornerMap;
 exports.directionMap = directionMap;
 exports.directionSize = directionSize;
+exports.getComponents = getComponents;
 exports.h = h;
 exports.handler = handler;
 exports.hex2rgba = hex2rgba;