@unocss/preset-mini 0.16.4 → 0.18.1

package/dist/chunks/default3.cjs

@@ -113,14 +113,18 @@ const variantSpace = (matcher) => {
   }
 };
 
-const variants = [
+const variants = (options) => [
   variantSpace,
   variantNegative,
   variantImportant,
   variantBreakpoints,
   ...variantCombinators,
   pseudo.variantPseudoClasses,
-  pseudo.variantPseudoElements
+  pseudo.variantPseudoClassFunctions,
+  pseudo.variantTaggedPseudoClasses(options),
+  pseudo.variantPseudoElements,
+  pseudo.partClasses,
+  ...options.dark === "media" ? variantColorsMedia : variantColorsClass
 ];
 
 exports.variantBreakpoints = variantBreakpoints;

package/dist/chunks/default3.mjs

@@ -1,5 +1,5 @@
 import { v as variantMatcher } from './variants.mjs';
-import { v as variantPseudoClasses, a as variantPseudoElements } from './pseudo.mjs';
+import { v as variantPseudoClasses, a as variantPseudoClassFunctions, b as variantTaggedPseudoClasses, c as variantPseudoElements, p as partClasses } from './pseudo.mjs';
 
 const regexCache = {};
 const variantBreakpoints = (matcher, _, theme) => {
@@ -111,14 +111,18 @@ const variantSpace = (matcher) => {
   }
 };
 
-const variants = [
+const variants = (options) => [
   variantSpace,
   variantNegative,
   variantImportant,
   variantBreakpoints,
   ...variantCombinators,
   variantPseudoClasses,
-  variantPseudoElements
+  variantPseudoClassFunctions,
+  variantTaggedPseudoClasses(options),
+  variantPseudoElements,
+  partClasses,
+  ...options.dark === "media" ? variantColorsMedia : variantColorsClass
 ];
 
-export { variantColorsMedia as a, variantColorsClass as b, variantBreakpoints as c, variantCombinators as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };
+export { variantBreakpoints as a, variantCombinators as b, variantColorsClass as c, variantColorsMedia as d, variantImportant as e, variantNegative as f, variantSpace as g, variants as v };

package/dist/chunks/pseudo.cjs

@@ -40,18 +40,46 @@ const PseudoClasses = Object.fromEntries([
   "only-of-type"
 ].map(core.toArray));
 const PseudoElements = [
+  "placeholder",
   "before",
   "after",
   "first-letter",
   "first-line",
   "selection"
 ];
+const PseudoClassFunctions = [
+  "not",
+  "is",
+  "where",
+  "has"
+];
+const PartClassesRE = /(part-\[(.+)]:)(.+)/;
 const PseudoElementsRE = new RegExp(`^(${PseudoElements.join("|")})[:-]`);
 const PseudoClassesStr = Object.keys(PseudoClasses).join("|");
+const PseudoClassFunctionsStr = PseudoClassFunctions.join("|");
 const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
-const PseudoClassesNotRE = new RegExp(`^not-(${PseudoClassesStr})[:-]`);
-const PseudoClassesGroupRE = new RegExp(`^group-((not-)?(${PseudoClassesStr}))[:-]`);
-const PseudoClassesPeerRE = new RegExp(`^peer-((not-)?(${PseudoClassesStr}))[:-]`);
+const PseudoClassFunctionsRE = new RegExp(`^(${PseudoClassFunctionsStr})-(${PseudoClassesStr})[:-]`);
+function shouldAdd(entires) {
+  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
+}
+const taggedPseudoClassMatcher = (tag, parent, combinator) => {
+  const re = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
+  const rawRe = new RegExp(`^${core.escapeRegExp(parent)}:`);
+  return (input) => {
+    const match = input.match(re);
+    if (match) {
+      let pseudo = PseudoClasses[match[3]] || match[3];
+      if (match[2])
+        pseudo = `${match[2]}(:${pseudo})`;
+      return {
+        matcher: input.slice(match[1].length + tag.length + 2),
+        selector: (s, body) => {
+          return shouldAdd(body) && rawRe.test(s) ? s.replace(rawRe, `${parent}:${pseudo}:`) : `${parent}:${pseudo}${combinator}${s}`;
+        }
+      };
+    }
+  };
+};
 const variantPseudoElements = (input) => {
   const match = input.match(PseudoElementsRE);
   if (match) {
@@ -61,12 +89,9 @@ const variantPseudoElements = (input) => {
     };
   }
 };
-function shouldAdd(entires) {
-  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
-}
 const variantPseudoClasses = {
   match: (input) => {
-    let match = input.match(PseudoClassesRE);
+    const match = input.match(PseudoClassesRE);
     if (match) {
       const pseudo = PseudoClasses[match[1]] || match[1];
       return {
@@ -74,32 +99,45 @@ const variantPseudoClasses = {
         selector: (s, body) => shouldAdd(body) && `${s}:${pseudo}`
       };
     }
-    match = input.match(PseudoClassesNotRE);
-    if (match) {
-      const pseudo = PseudoClasses[match[1]] || match[1];
-      return {
-        matcher: input.slice(match[1].length + 5),
-        selector: (s, body) => shouldAdd(body) && `${s}:not(:${pseudo})`
-      };
-    }
-    match = input.match(PseudoClassesGroupRE);
+  },
+  multiPass: true
+};
+const variantPseudoClassFunctions = {
+  match: (input) => {
+    const match = input.match(PseudoClassFunctionsRE);
     if (match) {
-      let pseudo = PseudoClasses[match[3]] || match[3];
-      if (match[2])
-        pseudo = `not(:${pseudo})`;
+      const fn = match[1];
+      const pseudo = PseudoClasses[match[2]] || match[2];
       return {
-        matcher: input.slice(match[1].length + 7),
-        selector: (s, body) => shouldAdd(body) && s.includes(".group:") ? s.replace(/\.group:/, `.group:${pseudo}:`) : `.group:${pseudo} ${s}`
+        matcher: input.slice(match[1].length + match[2].length + 2),
+        selector: (s, body) => shouldAdd(body) && `${s}:${fn}(:${pseudo})`
       };
     }
-    match = input.match(PseudoClassesPeerRE);
+  },
+  multiPass: true
+};
+const variantTaggedPseudoClasses = (options = {}) => ({
+  match: (input) => {
+    const attributify = !!options?.attributifyPseudo;
+    const g = taggedPseudoClassMatcher("group", attributify ? '[group=""]' : ".group", " ")(input);
+    if (g)
+      return g;
+    const p = taggedPseudoClassMatcher("peer", attributify ? '[peer=""]' : ".peer", "~")(input);
+    if (p)
+      return p;
+  },
+  multiPass: true
+});
+const partClasses = {
+  match: (input) => {
+    const match = input.match(PartClassesRE);
     if (match) {
-      let pseudo = PseudoClasses[match[3]] || match[3];
-      if (match[2])
-        pseudo = `not(:${pseudo})`;
+      const part = `part(${match[2]})`;
       return {
-        matcher: input.slice(match[1].length + 6),
-        selector: (s, body) => shouldAdd(body) && s.includes(".peer:") ? s.replace(/\.peer:/, `.peer:${pseudo}:`) : `.peer:${pseudo}~${s}`
+        matcher: input.slice(match[1].length),
+        selector: (s, body) => {
+          return shouldAdd(body) && `${s}::${part}`;
+        }
       };
     }
   },
@@ -107,6 +145,8 @@ const variantPseudoClasses = {
 };
 
 exports.CONTROL_BYPASS_PSEUDO_CLASS = CONTROL_BYPASS_PSEUDO_CLASS;
-exports.PseudoClasses = PseudoClasses;
+exports.partClasses = partClasses;
+exports.variantPseudoClassFunctions = variantPseudoClassFunctions;
 exports.variantPseudoClasses = variantPseudoClasses;
 exports.variantPseudoElements = variantPseudoElements;
+exports.variantTaggedPseudoClasses = variantTaggedPseudoClasses;

package/dist/chunks/pseudo.mjs

@@ -1,4 +1,4 @@
-import { toArray } from '@unocss/core';
+import { toArray, escapeRegExp } from '@unocss/core';
 
 const CONTROL_BYPASS_PSEUDO_CLASS = "$$no-pseudo";
 const PseudoClasses = Object.fromEntries([
@@ -38,18 +38,46 @@ const PseudoClasses = Object.fromEntries([
   "only-of-type"
 ].map(toArray));
 const PseudoElements = [
+  "placeholder",
   "before",
   "after",
   "first-letter",
   "first-line",
   "selection"
 ];
+const PseudoClassFunctions = [
+  "not",
+  "is",
+  "where",
+  "has"
+];
+const PartClassesRE = /(part-\[(.+)]:)(.+)/;
 const PseudoElementsRE = new RegExp(`^(${PseudoElements.join("|")})[:-]`);
 const PseudoClassesStr = Object.keys(PseudoClasses).join("|");
+const PseudoClassFunctionsStr = PseudoClassFunctions.join("|");
 const PseudoClassesRE = new RegExp(`^(${PseudoClassesStr})[:-]`);
-const PseudoClassesNotRE = new RegExp(`^not-(${PseudoClassesStr})[:-]`);
-const PseudoClassesGroupRE = new RegExp(`^group-((not-)?(${PseudoClassesStr}))[:-]`);
-const PseudoClassesPeerRE = new RegExp(`^peer-((not-)?(${PseudoClassesStr}))[:-]`);
+const PseudoClassFunctionsRE = new RegExp(`^(${PseudoClassFunctionsStr})-(${PseudoClassesStr})[:-]`);
+function shouldAdd(entires) {
+  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
+}
+const taggedPseudoClassMatcher = (tag, parent, combinator) => {
+  const re = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
+  const rawRe = new RegExp(`^${escapeRegExp(parent)}:`);
+  return (input) => {
+    const match = input.match(re);
+    if (match) {
+      let pseudo = PseudoClasses[match[3]] || match[3];
+      if (match[2])
+        pseudo = `${match[2]}(:${pseudo})`;
+      return {
+        matcher: input.slice(match[1].length + tag.length + 2),
+        selector: (s, body) => {
+          return shouldAdd(body) && rawRe.test(s) ? s.replace(rawRe, `${parent}:${pseudo}:`) : `${parent}:${pseudo}${combinator}${s}`;
+        }
+      };
+    }
+  };
+};
 const variantPseudoElements = (input) => {
   const match = input.match(PseudoElementsRE);
   if (match) {
@@ -59,12 +87,9 @@ const variantPseudoElements = (input) => {
     };
   }
 };
-function shouldAdd(entires) {
-  return !entires.find((i) => i[0] === CONTROL_BYPASS_PSEUDO_CLASS) || void 0;
-}
 const variantPseudoClasses = {
   match: (input) => {
-    let match = input.match(PseudoClassesRE);
+    const match = input.match(PseudoClassesRE);
     if (match) {
       const pseudo = PseudoClasses[match[1]] || match[1];
       return {
@@ -72,36 +97,49 @@ const variantPseudoClasses = {
         selector: (s, body) => shouldAdd(body) && `${s}:${pseudo}`
       };
     }
-    match = input.match(PseudoClassesNotRE);
-    if (match) {
-      const pseudo = PseudoClasses[match[1]] || match[1];
-      return {
-        matcher: input.slice(match[1].length + 5),
-        selector: (s, body) => shouldAdd(body) && `${s}:not(:${pseudo})`
-      };
-    }
-    match = input.match(PseudoClassesGroupRE);
+  },
+  multiPass: true
+};
+const variantPseudoClassFunctions = {
+  match: (input) => {
+    const match = input.match(PseudoClassFunctionsRE);
     if (match) {
-      let pseudo = PseudoClasses[match[3]] || match[3];
-      if (match[2])
-        pseudo = `not(:${pseudo})`;
+      const fn = match[1];
+      const pseudo = PseudoClasses[match[2]] || match[2];
       return {
-        matcher: input.slice(match[1].length + 7),
-        selector: (s, body) => shouldAdd(body) && s.includes(".group:") ? s.replace(/\.group:/, `.group:${pseudo}:`) : `.group:${pseudo} ${s}`
+        matcher: input.slice(match[1].length + match[2].length + 2),
+        selector: (s, body) => shouldAdd(body) && `${s}:${fn}(:${pseudo})`
       };
     }
-    match = input.match(PseudoClassesPeerRE);
+  },
+  multiPass: true
+};
+const variantTaggedPseudoClasses = (options = {}) => ({
+  match: (input) => {
+    const attributify = !!options?.attributifyPseudo;
+    const g = taggedPseudoClassMatcher("group", attributify ? '[group=""]' : ".group", " ")(input);
+    if (g)
+      return g;
+    const p = taggedPseudoClassMatcher("peer", attributify ? '[peer=""]' : ".peer", "~")(input);
+    if (p)
+      return p;
+  },
+  multiPass: true
+});
+const partClasses = {
+  match: (input) => {
+    const match = input.match(PartClassesRE);
     if (match) {
-      let pseudo = PseudoClasses[match[3]] || match[3];
-      if (match[2])
-        pseudo = `not(:${pseudo})`;
+      const part = `part(${match[2]})`;
       return {
-        matcher: input.slice(match[1].length + 6),
-        selector: (s, body) => shouldAdd(body) && s.includes(".peer:") ? s.replace(/\.peer:/, `.peer:${pseudo}:`) : `.peer:${pseudo}~${s}`
+        matcher: input.slice(match[1].length),
+        selector: (s, body) => {
+          return shouldAdd(body) && `${s}::${part}`;
+        }
       };
     }
   },
   multiPass: true
 };
 
-export { CONTROL_BYPASS_PSEUDO_CLASS as C, PseudoClasses as P, variantPseudoElements as a, variantPseudoClasses as v };
+export { CONTROL_BYPASS_PSEUDO_CLASS as C, variantPseudoClassFunctions as a, variantTaggedPseudoClasses as b, variantPseudoElements as c, partClasses as p, variantPseudoClasses as v };

package/dist/chunks/utilities.cjs

@@ -36,12 +36,64 @@ const xyzMap = {
   "": ["-x", "-y"]
 };
 
+const cssBasicProps = [
+  "color",
+  "border-color",
+  "background-color",
+  "flex-grow",
+  "flex",
+  "flex-shrink",
+  "caret-color",
+  "font",
+  "gap",
+  "opacity",
+  "visibility",
+  "z-index",
+  "font-weight",
+  "zoom",
+  "text-shadow",
+  "transform",
+  "box-shadow"
+];
+const cssPositionProps = [
+  "backround-position",
+  "left",
+  "right",
+  "top",
+  "bottom",
+  "object-position"
+];
+const cssSizeProps = [
+  "max-height",
+  "min-height",
+  "max-width",
+  "min-width",
+  "height",
+  "width",
+  "border-width",
+  "margin",
+  "padding",
+  "outline-width",
+  "outline-offset",
+  "font-size",
+  "line-height",
+  "text-indent",
+  "vertical-align",
+  "border-spacing",
+  "letter-spacing",
+  "word-spacing"
+];
+const cssEnhanceProps = ["stroke", "filter", "backdrop-filter", "fill", "mask", "mask-size", "mask-border", "clip-path", "clip"];
+const cssProps = [
+  ...cssBasicProps,
+  ...cssPositionProps,
+  ...cssSizeProps,
+  ...cssEnhanceProps
+];
 const numberWithUnitRE = /^(-?[0-9.]+)(px|pt|pc|rem|em|%|vh|vw|in|cm|mm|ex|ch|vmin|vmax)?$/i;
 const numberRE = /^(-?[0-9.]+)$/i;
 const unitOnlyRE = /^(px)$/i;
 function numberWithUnit(str) {
-  if (str === "auto" || str === "a")
-    return "auto";
   const match = str.match(numberWithUnitRE);
   if (!match)
     return;
@@ -49,9 +101,11 @@ function numberWithUnit(str) {
   if (unit)
     return str;
 }
-function rem(str) {
+function auto(str) {
   if (str === "auto" || str === "a")
     return "auto";
+}
+function rem(str) {
   if (str.match(unitOnlyRE))
     return `1${str}`;
   const match = str.match(numberWithUnitRE);
@@ -122,10 +176,20 @@ function global(str) {
   if (["inherit", "initial", "revert", "unset"].includes(str))
     return str;
 }
+function properties(str) {
+  if (str === void 0)
+    return;
+  for (const prop of str.split(",")) {
+    if (!cssProps.includes(prop))
+      return;
+  }
+  return str;
+}
 
 const valueHandlers = {
   __proto__: null,
   numberWithUnit: numberWithUnit,
+  auto: auto,
   rem: rem,
   px: px,
   number: number,
@@ -134,7 +198,8 @@ const valueHandlers = {
   bracket: bracket,
   cssvar: cssvar,
   time: time,
-  global: global
+  global: global,
+  properties: properties
 };
 
 const handler = core.createValueHandler(valueHandlers);
@@ -143,17 +208,87 @@ const h = handler;
 function capitalize(str) {
   return str.charAt(0).toUpperCase() + str.slice(1);
 }
-const directionSize = (prefix) => ([_, direction, size]) => {
-  const v = handler.bracket.rem.fraction.cssvar(size);
-  if (v)
-    return directionMap[direction].map((i) => [prefix + i, v]);
+const directionSize = (propertyPrefix) => ([_, direction, size]) => {
+  const v = handler.bracket.auto.rem.fraction.cssvar(size);
+  if (v !== void 0)
+    return directionMap[direction].map((i) => [`${propertyPrefix}${i}`, v]);
+};
+const getThemeColor = (theme, colors) => theme.colors?.[colors.join("-").replace(/(-[a-z])/g, (n) => n.slice(1).toUpperCase())];
+const parseColor = (body, theme) => {
+  const [main, opacity] = body.split(/(?:\/|:)/);
+  const colors = main.replace(/([a-z])([0-9])/g, "$1-$2").split(/-/g);
+  const [name] = colors;
+  if (!name)
+    return;
+  let color;
+  const bracket = handler.bracket(main);
+  const bracketOrMain = bracket || main;
+  if (bracketOrMain.startsWith("#"))
+    color = bracketOrMain.slice(1);
+  if (bracketOrMain.startsWith("hex-"))
+    color = bracketOrMain.slice(4);
+  color = color || bracket;
+  let no = "DEFAULT";
+  if (!color) {
+    let colorData;
+    const [scale] = colors.slice(-1);
+    if (scale.match(/^\d+$/)) {
+      no = scale;
+      colorData = getThemeColor(theme, colors.slice(0, -1));
+    } else {
+      colorData = getThemeColor(theme, colors);
+      if (!colorData) {
+        [, no = no] = colors;
+        colorData = getThemeColor(theme, [name]);
+      }
+    }
+    if (typeof colorData === "string")
+      color = colorData;
+    else if (no && colorData)
+      color = colorData[no];
+  }
+  return {
+    opacity,
+    name,
+    no,
+    color,
+    rgba: core.hex2rgba(color)
+  };
+};
+const colorResolver = (property, varName) => ([, body], { theme }) => {
+  const data = parseColor(body, theme);
+  if (!data)
+    return;
+  const { opacity, color, rgba } = data;
+  if (!color)
+    return;
+  const a = opacity ? opacity[0] === "[" ? handler.bracket.percent(opacity) : parseFloat(opacity) / 100 : rgba?.[3];
+  if (rgba) {
+    if (a != null && !Number.isNaN(a)) {
+      rgba[3] = typeof a === "string" && !a.includes("%") ? parseFloat(a) : a;
+      return {
+        [property]: `rgba(${rgba.join(",")})`
+      };
+    } else {
+      return {
+        [`--un-${varName}-opacity`]: 1,
+        [property]: `rgba(${rgba.slice(0, 3).join(",")},var(--un-${varName}-opacity))`
+      };
+    }
+  } else {
+    return {
+      [property]: color.replace("%alpha", `${a || 1}`)
+    };
+  }
 };
 
 exports.capitalize = capitalize;
+exports.colorResolver = colorResolver;
 exports.cornerMap = cornerMap;
 exports.directionMap = directionMap;
 exports.directionSize = directionSize;
 exports.h = h;
 exports.handler = handler;
+exports.parseColor = parseColor;
 exports.valueHandlers = valueHandlers;
 exports.xyzMap = xyzMap;