@unocss/preset-mini 0.39.2 → 0.41.0

package/dist/chunks/default3.cjs

@@ -32,22 +32,35 @@ const variantBreakpoints = {
         order -= idx + 1;
         return {
           matcher: m,
-          parent: [`@media (max-width: ${calcMaxWidthBySize(size)})`, order]
+          handle: (input, next) => next({
+            ...input,
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (max-width: ${calcMaxWidthBySize(size)})`,
+            parentOrder: order
+          })
         };
       }
       order += idx + 1;
       if (isAtPrefix && idx < variantEntries.length - 1) {
         return {
           matcher: m,
-          parent: [`@media (min-width: ${size}) and (max-width: ${calcMaxWidthBySize(variantEntries[idx + 1][1])})`, order]
+          handle: (input, next) => next({
+            ...input,
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (min-width: ${size}) and (max-width: ${calcMaxWidthBySize(variantEntries[idx + 1][1])})`,
+            parentOrder: order
+          })
         };
       }
       return {
         matcher: m,
-        parent: [`@media (min-width: ${size})`, order]
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (min-width: ${size})`,
+          parentOrder: order
+        })
       };
     }
   },
+  multiPass: true,
   autocomplete: "(at-|lt-|)$breakpoints:"
 };
 
@@ -87,17 +100,21 @@ const variantCustomMedia = {
       const media = theme.media?.[match[1]] ?? `(--${match[1]})`;
       return {
         matcher: matcher.slice(match[0].length),
-        parent: `@media ${media}`
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@media ${media}`
+        })
       };
     }
-  }
+  },
+  multiPass: true
 };
 
 const variantColorsMediaOrClass = (options = {}) => {
   if (options?.dark === "class") {
     return [
-      variants$1.variantMatcher("dark", (input) => `.dark $$ ${input}`),
-      variants$1.variantMatcher("light", (input) => `.light $$ ${input}`)
+      variants$1.variantMatcher("dark", (input) => ({ prefix: `.dark $$ ${input.prefix}` })),
+      variants$1.variantMatcher("light", (input) => ({ prefix: `.light $$ ${input.prefix}` }))
     ];
   }
   return [
@@ -107,8 +124,8 @@ const variantColorsMediaOrClass = (options = {}) => {
 };
 
 const variantLanguageDirections = [
-  variants$1.variantMatcher("rtl", (input) => `[dir="rtl"] $$ ${input}`),
-  variants$1.variantMatcher("ltr", (input) => `[dir="ltr"] $$ ${input}`)
+  variants$1.variantMatcher("rtl", (input) => ({ prefix: `[dir="rtl"] $$ ${input.prefix}` })),
+  variants$1.variantMatcher("ltr", (input) => ({ prefix: `[dir="ltr"] $$ ${input.prefix}` }))
 ];
 
 const variantSelector = {
@@ -130,7 +147,10 @@ const variantCssLayer = {
     if (match) {
       return {
         matcher: matcher.slice(match[0].length),
-        parent: `@layer ${match[1]}`
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@layer ${match[1]}`
+        })
       };
     }
   }
@@ -159,6 +179,30 @@ const variantScope = {
     }
   }
 };
+const variantVariables = {
+  name: "variables",
+  match(matcher) {
+    const match = matcher.match(/^(\[.+?\]):/);
+    if (match) {
+      const variant = utilities.handler.bracket(match[1]) ?? "";
+      return {
+        matcher: matcher.slice(match[0].length),
+        handle(input, next) {
+          const updates = variant.startsWith("@") ? {
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
+          } : {
+            selector: variant.replace(/&/g, input.selector)
+          };
+          return next({
+            ...input,
+            ...updates
+          });
+        }
+      };
+    }
+  },
+  multiPass: true
+};
 
 const numberRE = /[0-9.]+(?:[a-z]+|%)?/;
 const ignoreProps = [
@@ -282,7 +326,7 @@ const sortValue = (pseudo) => {
     return 1;
 };
 const taggedPseudoClassMatcher = (tag, parent, combinator) => {
-  const rawRe = new RegExp(`^${core.escapeRegExp(parent)}:`);
+  const rawRe = new RegExp(`${core.escapeRegExp(parent)}:`);
   const pseudoRE = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
   const pseudoColonRE = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesColonStr}))[:]`);
   return {
@@ -295,8 +339,11 @@ 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}`,
-          sort: sortValue(match[3])
+          handle: (input2, next) => next({
+            ...input2,
+            prefix: rawRe.test(input2.prefix) ? input2.prefix.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${input2.prefix}`,
+            sort: sortValue(match[3])
+          })
         };
       }
     }
@@ -314,8 +361,18 @@ const variantPseudoClassesAndElements = {
       const pseudo = PseudoClasses[match[1]] || PseudoClassesColon[match[1]] || `:${match[1]}`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => `${s}${pseudo}`,
-        sort: sortValue(match[1])
+        handle: (input2, next) => {
+          const selectors = pseudo.startsWith("::") ? {
+            pseudo: `${input2.pseudo}${pseudo}`
+          } : {
+            selector: `${input2.selector}${pseudo}`
+          };
+          return next({
+            ...input2,
+            ...selectors,
+            sort: sortValue(match[1])
+          });
+        }
       };
     }
   },
@@ -376,6 +433,7 @@ const partClasses = {
 };
 
 const variants = (options) => [
+  variantVariables,
   variantCssLayer,
   variantSelector,
   variantInternalLayer,
@@ -410,4 +468,5 @@ exports.variantPseudoClassesAndElements = variantPseudoClassesAndElements;
 exports.variantScope = variantScope;
 exports.variantSelector = variantSelector;
 exports.variantTaggedPseudoClasses = variantTaggedPseudoClasses;
+exports.variantVariables = variantVariables;
 exports.variants = variants;

package/dist/chunks/default3.mjs

@@ -1,4 +1,4 @@
-import { k as resolveBreakpoints, C as CONTROL_MINI_NO_NEGATIVE } from './utilities.mjs';
+import { k as resolveBreakpoints, h as handler, C as CONTROL_MINI_NO_NEGATIVE } from './utilities.mjs';
 import { v as variantParentMatcher, a as variantMatcher } from './variants.mjs';
 import { escapeRegExp } from '@unocss/core';
 
@@ -30,22 +30,35 @@ const variantBreakpoints = {
         order -= idx + 1;
         return {
           matcher: m,
-          parent: [`@media (max-width: ${calcMaxWidthBySize(size)})`, order]
+          handle: (input, next) => next({
+            ...input,
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (max-width: ${calcMaxWidthBySize(size)})`,
+            parentOrder: order
+          })
         };
       }
       order += idx + 1;
       if (isAtPrefix && idx < variantEntries.length - 1) {
         return {
           matcher: m,
-          parent: [`@media (min-width: ${size}) and (max-width: ${calcMaxWidthBySize(variantEntries[idx + 1][1])})`, order]
+          handle: (input, next) => next({
+            ...input,
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (min-width: ${size}) and (max-width: ${calcMaxWidthBySize(variantEntries[idx + 1][1])})`,
+            parentOrder: order
+          })
         };
       }
       return {
         matcher: m,
-        parent: [`@media (min-width: ${size})`, order]
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@media (min-width: ${size})`,
+          parentOrder: order
+        })
       };
     }
   },
+  multiPass: true,
   autocomplete: "(at-|lt-|)$breakpoints:"
 };
 
@@ -85,17 +98,21 @@ const variantCustomMedia = {
       const media = theme.media?.[match[1]] ?? `(--${match[1]})`;
       return {
         matcher: matcher.slice(match[0].length),
-        parent: `@media ${media}`
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@media ${media}`
+        })
       };
     }
-  }
+  },
+  multiPass: true
 };
 
 const variantColorsMediaOrClass = (options = {}) => {
   if (options?.dark === "class") {
     return [
-      variantMatcher("dark", (input) => `.dark $$ ${input}`),
-      variantMatcher("light", (input) => `.light $$ ${input}`)
+      variantMatcher("dark", (input) => ({ prefix: `.dark $$ ${input.prefix}` })),
+      variantMatcher("light", (input) => ({ prefix: `.light $$ ${input.prefix}` }))
     ];
   }
   return [
@@ -105,8 +122,8 @@ const variantColorsMediaOrClass = (options = {}) => {
 };
 
 const variantLanguageDirections = [
-  variantMatcher("rtl", (input) => `[dir="rtl"] $$ ${input}`),
-  variantMatcher("ltr", (input) => `[dir="ltr"] $$ ${input}`)
+  variantMatcher("rtl", (input) => ({ prefix: `[dir="rtl"] $$ ${input.prefix}` })),
+  variantMatcher("ltr", (input) => ({ prefix: `[dir="ltr"] $$ ${input.prefix}` }))
 ];
 
 const variantSelector = {
@@ -128,7 +145,10 @@ const variantCssLayer = {
     if (match) {
       return {
         matcher: matcher.slice(match[0].length),
-        parent: `@layer ${match[1]}`
+        handle: (input, next) => next({
+          ...input,
+          parent: `${input.parent ? `${input.parent} $$ ` : ""}@layer ${match[1]}`
+        })
       };
     }
   }
@@ -157,6 +177,30 @@ const variantScope = {
     }
   }
 };
+const variantVariables = {
+  name: "variables",
+  match(matcher) {
+    const match = matcher.match(/^(\[.+?\]):/);
+    if (match) {
+      const variant = handler.bracket(match[1]) ?? "";
+      return {
+        matcher: matcher.slice(match[0].length),
+        handle(input, next) {
+          const updates = variant.startsWith("@") ? {
+            parent: `${input.parent ? `${input.parent} $$ ` : ""}${variant}`
+          } : {
+            selector: variant.replace(/&/g, input.selector)
+          };
+          return next({
+            ...input,
+            ...updates
+          });
+        }
+      };
+    }
+  },
+  multiPass: true
+};
 
 const numberRE = /[0-9.]+(?:[a-z]+|%)?/;
 const ignoreProps = [
@@ -280,7 +324,7 @@ const sortValue = (pseudo) => {
     return 1;
 };
 const taggedPseudoClassMatcher = (tag, parent, combinator) => {
-  const rawRe = new RegExp(`^${escapeRegExp(parent)}:`);
+  const rawRe = new RegExp(`${escapeRegExp(parent)}:`);
   const pseudoRE = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesStr}))[:-]`);
   const pseudoColonRE = new RegExp(`^${tag}-((?:(${PseudoClassFunctionsStr})-)?(${PseudoClassesColonStr}))[:]`);
   return {
@@ -293,8 +337,11 @@ 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}`,
-          sort: sortValue(match[3])
+          handle: (input2, next) => next({
+            ...input2,
+            prefix: rawRe.test(input2.prefix) ? input2.prefix.replace(rawRe, `${parent}${pseudo}:`) : `${parent}${pseudo}${combinator}${input2.prefix}`,
+            sort: sortValue(match[3])
+          })
         };
       }
     }
@@ -312,8 +359,18 @@ const variantPseudoClassesAndElements = {
       const pseudo = PseudoClasses[match[1]] || PseudoClassesColon[match[1]] || `:${match[1]}`;
       return {
         matcher: input.slice(match[0].length),
-        selector: (s) => `${s}${pseudo}`,
-        sort: sortValue(match[1])
+        handle: (input2, next) => {
+          const selectors = pseudo.startsWith("::") ? {
+            pseudo: `${input2.pseudo}${pseudo}`
+          } : {
+            selector: `${input2.selector}${pseudo}`
+          };
+          return next({
+            ...input2,
+            ...selectors,
+            sort: sortValue(match[1])
+          });
+        }
       };
     }
   },
@@ -374,6 +431,7 @@ const partClasses = {
 };
 
 const variants = (options) => [
+  variantVariables,
   variantCssLayer,
   variantSelector,
   variantInternalLayer,
@@ -392,4 +450,4 @@ const variants = (options) => [
   variantScope
 ];
 
-export { variantBreakpoints as a, variantCombinators as b, variantPrint as c, variantCustomMedia as d, variantColorsMediaOrClass as e, variantLanguageDirections as f, variantSelector as g, variantCssLayer as h, variantInternalLayer as i, variantScope as j, variantPseudoClassesAndElements as k, variantPseudoClassFunctions as l, variantTaggedPseudoClasses as m, variantImportant as n, variantNegative as o, partClasses as p, variants as v };
+export { variantBreakpoints as a, variantCombinators as b, variantPrint as c, variantCustomMedia as d, variantColorsMediaOrClass as e, variantLanguageDirections as f, variantSelector as g, variantCssLayer as h, variantInternalLayer as i, variantScope as j, variantVariables as k, variantPseudoClassesAndElements as l, variantPseudoClassFunctions as m, variantTaggedPseudoClasses as n, variantImportant as o, partClasses as p, variantNegative as q, variants as v };

package/dist/chunks/utilities.cjs

@@ -449,7 +449,7 @@ function bracketWithType(str, type) {
     else if (type && match[1] === type)
       base = str.slice(match[0].length, -1);
     if (base !== void 0) {
-      return base.replace(/(url\(.*?\))/g, (v) => v.replace(/_/g, "\\_")).replace(/([^\\])_/g, "$1 ").replace(/calc\((.*)/g, (v) => {
+      return base.replace(/(url\(.*?\))/g, (v) => v.replace(/_/g, "\\_")).replace(/([^\\])_/g, "$1 ").replace(/(?:calc|clamp|max|min)\((.*)/g, (v) => {
         return v.replace(/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ");
       });
     }

package/dist/chunks/utilities.mjs

@@ -447,7 +447,7 @@ function bracketWithType(str, type) {
     else if (type && match[1] === type)
       base = str.slice(match[0].length, -1);
     if (base !== void 0) {
-      return base.replace(/(url\(.*?\))/g, (v) => v.replace(/_/g, "\\_")).replace(/([^\\])_/g, "$1 ").replace(/calc\((.*)/g, (v) => {
+      return base.replace(/(url\(.*?\))/g, (v) => v.replace(/_/g, "\\_")).replace(/([^\\])_/g, "$1 ").replace(/(?:calc|clamp|max|min)\((.*)/g, (v) => {
         return v.replace(/(-?\d*\.?\d(?!\b-.+[,)](?![^+\-/*])\D)(?:%|[a-z]+)?|\))([+\-/*])/g, "$1 $2 ");
       });
     }

package/dist/chunks/variants.cjs

@@ -2,7 +2,7 @@
 
 const core = require('@unocss/core');
 
-const variantMatcher = (name, selector) => {
+const variantMatcher = (name, handler) => {
   const re = new RegExp(`^${core.escapeRegExp(name)}[:-]`);
   return {
     name,
@@ -11,7 +11,10 @@ const variantMatcher = (name, selector) => {
       if (match) {
         return {
           matcher: input.slice(match[0].length),
-          selector
+          handle: (input2, next) => next({
+            ...input2,
+            ...handler(input2)
+          })
         };
       }
     },

package/dist/chunks/variants.mjs

@@ -1,6 +1,6 @@
 import { escapeRegExp } from '@unocss/core';
 
-const variantMatcher = (name, selector) => {
+const variantMatcher = (name, handler) => {
   const re = new RegExp(`^${escapeRegExp(name)}[:-]`);
   return {
     name,
@@ -9,7 +9,10 @@ const variantMatcher = (name, selector) => {
       if (match) {
         return {
           matcher: input.slice(match[0].length),
-          selector
+          handle: (input2, next) => next({
+            ...input2,
+            ...handler(input2)
+          })
         };
       }
     },

package/dist/index.cjs

@@ -15,8 +15,10 @@ const preflights = [
   {
     layer: "preflights",
     getCSS(ctx) {
-      if (ctx.theme.preflightBase)
-        return `*,::before,::after{${core.entriesToCss(Object.entries(ctx.theme.preflightBase))}}`;
+      if (ctx.theme.preflightBase) {
+        const css = core.entriesToCss(Object.entries(ctx.theme.preflightBase));
+        return `*,::before,::after{${css}}::backdrop{${css}}`;
+      }
     }
   }
 ];

package/dist/index.mjs

@@ -12,8 +12,10 @@ const preflights = [
   {
     layer: "preflights",
     getCSS(ctx) {
-      if (ctx.theme.preflightBase)
-        return `*,::before,::after{${entriesToCss(Object.entries(ctx.theme.preflightBase))}}`;
+      if (ctx.theme.preflightBase) {
+        const css = entriesToCss(Object.entries(ctx.theme.preflightBase));
+        return `*,::before,::after{${css}}::backdrop{${css}}`;
+      }
     }
   }
 ];

package/dist/utils.d.ts

@@ -1,5 +1,5 @@
 import * as _unocss_core from '@unocss/core';
-import { RGBAColorValue, CSSColorValue, VariantObject } from '@unocss/core';
+import { RGBAColorValue, CSSColorValue, VariantHandlerContext, VariantObject } from '@unocss/core';
 export { C as CONTROL_MINI_NO_NEGATIVE, c as colorResolver, a as colorableShadows, d as directionSize, h as hasParseableColor, p as parseColor, r as resolveBreakpoints, b as resolveVerticalBreakpoints } from './utilities-c3da10e0.js';
 import './types-2a2972f5.js';
 
@@ -76,7 +76,7 @@ declare namespace handlers {
 declare const handler: _unocss_core.ValueHandler<"number" | "auto" | "global" | "position" | "numberWithUnit" | "rem" | "px" | "percent" | "fraction" | "bracket" | "bracketOfColor" | "bracketOfLength" | "bracketOfPosition" | "cssvar" | "time" | "degree" | "properties">;
 declare const h: _unocss_core.ValueHandler<"number" | "auto" | "global" | "position" | "numberWithUnit" | "rem" | "px" | "percent" | "fraction" | "bracket" | "bracketOfColor" | "bracketOfLength" | "bracketOfPosition" | "cssvar" | "time" | "degree" | "properties">;
 
-declare const variantMatcher: (name: string, selector?: ((input: string) => string | undefined) | undefined) => VariantObject;
+declare const variantMatcher: (name: string, handler: (input: VariantHandlerContext) => Record<string, any>) => VariantObject;
 declare const variantParentMatcher: (name: string, parent: string) => VariantObject;
 
 export { colorOpacityToString, colorToString, cornerMap, directionMap, getComponents, globalKeywords, h, handler, hex2rgba, insetMap, parseCssColor, positionMap, handlers as valueHandlers, variantMatcher, variantParentMatcher, xyzMap };

package/dist/variants.cjs

@@ -25,4 +25,5 @@ exports.variantPseudoClassesAndElements = _default.variantPseudoClassesAndElemen
 exports.variantScope = _default.variantScope;
 exports.variantSelector = _default.variantSelector;
 exports.variantTaggedPseudoClasses = _default.variantTaggedPseudoClasses;
+exports.variantVariables = _default.variantVariables;
 exports.variants = _default.variants;

package/dist/variants.d.ts

@@ -22,6 +22,7 @@ declare const variantSelector: Variant;
 declare const variantCssLayer: Variant;
 declare const variantInternalLayer: Variant;
 declare const variantScope: Variant;
+declare const variantVariables: Variant;
 
 declare const variantPseudoClassesAndElements: VariantObject;
 declare const variantPseudoClassFunctions: VariantObject;
@@ -32,4 +33,4 @@ declare const variantImportant: Variant;
 
 declare const variantNegative: Variant;
 
-export { partClasses, variantBreakpoints, variantColorsMediaOrClass, variantCombinators, variantCssLayer, variantCustomMedia, variantImportant, variantInternalLayer, variantLanguageDirections, variantNegative, variantPrint, variantPseudoClassFunctions, variantPseudoClassesAndElements, variantScope, variantSelector, variantTaggedPseudoClasses, variants };
+export { partClasses, variantBreakpoints, variantColorsMediaOrClass, variantCombinators, variantCssLayer, variantCustomMedia, variantImportant, variantInternalLayer, variantLanguageDirections, variantNegative, variantPrint, variantPseudoClassFunctions, variantPseudoClassesAndElements, variantScope, variantSelector, variantTaggedPseudoClasses, variantVariables, variants };

package/dist/variants.mjs

@@ -1,4 +1,4 @@
-export { p as partClasses, a as variantBreakpoints, e as variantColorsMediaOrClass, b as variantCombinators, h as variantCssLayer, d as variantCustomMedia, n as variantImportant, i as variantInternalLayer, f as variantLanguageDirections, o as variantNegative, c as variantPrint, l as variantPseudoClassFunctions, k as variantPseudoClassesAndElements, j as variantScope, g as variantSelector, m as variantTaggedPseudoClasses, v as variants } from './chunks/default3.mjs';
+export { p as partClasses, a as variantBreakpoints, e as variantColorsMediaOrClass, b as variantCombinators, h as variantCssLayer, d as variantCustomMedia, o as variantImportant, i as variantInternalLayer, f as variantLanguageDirections, q as variantNegative, c as variantPrint, m as variantPseudoClassFunctions, l as variantPseudoClassesAndElements, j as variantScope, g as variantSelector, n as variantTaggedPseudoClasses, k as variantVariables, v as variants } from './chunks/default3.mjs';
 import './chunks/utilities.mjs';
 import '@unocss/core';
 import './chunks/variants.mjs';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/preset-mini",
-  "version": "0.39.2",
+  "version": "0.41.0",
   "description": "The minimal preset for UnoCSS",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -61,7 +61,7 @@
     "*.css"
   ],
   "dependencies": {
-    "@unocss/core": "0.39.2"
+    "@unocss/core": "0.41.0"
   },
   "scripts": {
     "build": "unbuild",