@unocss/core 0.19.0 → 0.20.4

package/dist/index.cjs

@@ -110,13 +110,6 @@ function mergeSet(target, append) {
   append.forEach((i) => target.add(i));
   return target;
 }
-function cacheFunction(fn) {
-  const cache = Object.create(null);
-  return (str) => {
-    const hit = cache[str];
-    return hit || (cache[str] = fn(str));
-  };
-}
 
 const hexRE = /^#?([\da-f]+)$/i;
 function hex2rgba(hex = "") {
@@ -256,7 +249,6 @@ function createValueHandler(handlers) {
       if (res != null)
         return res;
     }
-    return void 0;
   };
   function addProcessor(that, name) {
     if (!that.__options) {
@@ -360,6 +352,8 @@ function resolveConfig(userConfig = {}, defaults = {}) {
     rulesSize,
     rulesDynamic: rules,
     rulesStaticMap,
+    preprocess: mergePresets("preprocess"),
+    postprocess: mergePresets("postprocess"),
     preflights: mergePresets("preflights"),
     variants: mergePresets("variants").map(normalizeVariant),
     shortcuts: resolveShortcuts(mergePresets("shortcuts")),
@@ -368,7 +362,7 @@ function resolveConfig(userConfig = {}, defaults = {}) {
   };
 }
 
-const version = "0.19.0";
+const version = "0.20.4";
 
 class UnoGenerator {
   constructor(userConfig = {}, defaults = {}) {
@@ -446,8 +440,8 @@ class UnoGenerator {
         return;
       }
       let current = raw;
-      if (this.config.preprocess)
-        current = this.config.preprocess(raw);
+      for (const p of this.config.preprocess)
+        current = p(raw);
       if (this.isBlocked(current))
         return block(current);
       const applied = this.matchVariants(raw, current);
@@ -485,7 +479,7 @@ class UnoGenerator {
     const getLayer = (layer) => {
       if (layerCache[layer])
         return layerCache[layer];
-      let css = Array.from(sheet).sort((a, b) => (this.parentOrders.get(a[0]) || 0) - (this.parentOrders.get(b[0]) || 0)).map(([parent, items]) => {
+      let css = Array.from(sheet).sort((a, b) => (this.parentOrders.get(a[0]) ?? 0) - (this.parentOrders.get(b[0]) ?? 0) || a[0]?.localeCompare(b[0] || "") || 0).map(([parent, items]) => {
         const size = items.length;
         const sorted = items.filter((i) => (i[4]?.layer || "default") === layer).sort((a, b) => a[0] - b[0] || a[1]?.localeCompare(b[1] || "") || 0).map((a) => [a[1] ? applyScope(a[1], scope) : a[1], a[2]]);
         if (!sorted.length)
@@ -495,7 +489,7 @@ class UnoGenerator {
             for (let i = idx + 1; i < size; i++) {
               const current = sorted[i];
               if (current && current[0] && current[1] === body) {
-                current[0] = `${current[0]},${selector}`;
+                current[0] = `${current[0]},${nl}${selector}`;
                 return null;
               }
             }
@@ -564,19 +558,23 @@ class UnoGenerator {
     return [raw, processed, handlers];
   }
   applyVariants(parsed, variantHandlers = parsed[4], raw = parsed[1]) {
-    const entries = variantHandlers.reduce((p, v) => v.body?.(p) || p, parsed[2]);
-    return [
-      variantHandlers.reduce((p, v) => v.selector?.(p, entries) || p, toEscapedSelector(raw)),
+    const handlers = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0));
+    const entries = handlers.reduce((p, v) => v.body?.(p) || p, parsed[2]);
+    const obj = {
+      selector: handlers.reduce((p, v) => v.selector?.(p, entries) || p, toEscapedSelector(raw)),
       entries,
-      variantHandlers.reduce((p, v) => Array.isArray(v.parent) ? v.parent[0] : v.parent || p, void 0)
-    ];
+      parent: handlers.reduce((p, v) => Array.isArray(v.parent) ? v.parent[0] : v.parent || p, void 0)
+    };
+    for (const p of this.config.postprocess)
+      p(obj);
+    return obj;
   }
   constructCustomCSS(context, body, overrideSelector) {
     body = normalizeCSSEntries(body);
-    const [selector, entries, mediaQuery] = this.applyVariants([0, overrideSelector || context.rawSelector, body, void 0, context.variantHandlers]);
+    const { selector, entries, parent } = this.applyVariants([0, overrideSelector || context.rawSelector, body, void 0, context.variantHandlers]);
     const cssBody = `${selector}{${entriesToCss(entries)}}`;
-    if (mediaQuery)
-      return `${mediaQuery}{${cssBody}}`;
+    if (parent)
+      return `${parent}{${cssBody}}`;
     return cssBody;
   }
   async parseUtil(input, context, internal = false) {
@@ -613,11 +611,11 @@ class UnoGenerator {
       return;
     if (isRawUtil(parsed))
       return [parsed[0], void 0, parsed[1], void 0, parsed[2]];
-    const [selector, entries, mediaQuery] = this.applyVariants(parsed);
+    const { selector, entries, parent } = this.applyVariants(parsed);
     const body = entriesToCss(entries);
     if (!body)
       return;
-    return [parsed[0], selector, body, mediaQuery, parsed[3]];
+    return [parsed[0], selector, body, parent, parsed[3]];
   }
   expandShortcut(processed, context, depth = 3) {
     if (depth === 0)
@@ -662,8 +660,8 @@ class UnoGenerator {
     for (const item of parsed) {
       if (isRawUtil(item))
         continue;
-      const [selector, entries, mediaQuery] = this.applyVariants(item, [...item[4], ...parentVariants], raw);
-      const mapItem = selectorMap.getFallback(selector, mediaQuery, [[], item[0]]);
+      const { selector, entries, parent: parent2 } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push(...entries);
       if (item[0] > mapItem[1])
         mapItem[1] = item[0];
@@ -701,7 +699,6 @@ exports.BetterMap = BetterMap;
 exports.TwoKeyMap = TwoKeyMap;
 exports.UnoGenerator = UnoGenerator;
 exports.attributifyRE = attributifyRE;
-exports.cacheFunction = cacheFunction;
 exports.clearIdenticalEntries = clearIdenticalEntries;
 exports.createGenerator = createGenerator;
 exports.createValueHandler = createValueHandler;

package/dist/index.d.ts

@@ -11,7 +11,7 @@ declare class UnoGenerator {
     applyExtractors(code: string, id?: string, set?: Set<string>): Promise<Set<string>>;
     generate(input: string | Set<string>, { id, scope, preflights, safelist, minify, }?: GenerateOptions): Promise<GenerateResult>;
     matchVariants(raw: string, current?: string): VariantMatchedResult;
-    applyVariants(parsed: ParsedUtil, variantHandlers?: VariantHandler[], raw?: string): readonly [string, CSSEntries, string | undefined];
+    applyVariants(parsed: ParsedUtil, variantHandlers?: VariantHandler[], raw?: string): UtilObject;
     constructCustomCSS(context: Readonly<RuleContext>, body: CSSObject | CSSEntries, overrideSelector?: string): string;
     parseUtil(input: string | VariantMatchedResult, context: RuleContext, internal?: boolean): Promise<ParsedUtil[] | RawUtil[] | undefined>;
     stringifyUtil(parsed?: ParsedUtil | RawUtil): StringifiedUtil | undefined;
@@ -51,13 +51,17 @@ declare type ParsedColorValue = {
      */
     name: string;
     /**
-     * Color scale. Preferrably 000 - 999
+     * Color scale, preferrably 000 - 999.
      */
     no: string;
     /**
      * {@link RGBAColorValue}
      */
     rgba?: RGBAColorValue;
+    /**
+     * Parsed rgba's alpha value.
+     */
+    alpha?: number | string;
 };
 declare type PresetOptions = Record<string, any>;
 interface RuleContext<Theme extends {} = {}> {
@@ -167,6 +171,10 @@ interface VariantHandler {
      * Provide a parent selector(e.g. media query) to the output css.
      */
     parent?: string | [string, number] | undefined;
+    /**
+     * Variant ordering.
+     */
+    order?: number;
 }
 declare type VariantFunction<Theme extends {} = {}> = (matcher: string, context: Readonly<VariantContext<Theme>>) => string | VariantHandler | undefined;
 declare type VariantObject<Theme extends {} = {}> = {
@@ -182,6 +190,8 @@ declare type VariantObject<Theme extends {} = {}> = {
     multiPass?: boolean;
 };
 declare type Variant<Theme extends {} = {}> = VariantFunction<Theme> | VariantObject<Theme>;
+declare type Preprocessor = (matcher: string) => string | undefined;
+declare type Postprocessor = (util: UtilObject) => void;
 interface ConfigBase<Theme extends {} = {}> {
     /**
      * Rules to generate CSS utilities
@@ -227,6 +237,14 @@ interface ConfigBase<Theme extends {} = {}> {
      * Custom function to sort layers.
      */
     sortLayers?: (layers: string[]) => string[];
+    /**
+     * Preprocess the incoming utilities, return falsy value to exclude
+     */
+    preprocess?: Preprocessor | Preprocessor[];
+    /**
+     * Process the generate utils object
+     */
+    postprocess?: Postprocessor | Postprocessor[];
 }
 interface Preset<Theme extends {} = {}> extends ConfigBase<Theme> {
     name: string;
@@ -234,7 +252,7 @@ interface Preset<Theme extends {} = {}> extends ConfigBase<Theme> {
     /**
      * Preset options for other tools like IDE to consume
      */
-    options?: any;
+    options?: PresetOptions;
 }
 interface GeneratorOptions {
     /**
@@ -255,10 +273,6 @@ interface UserOnlyOptions<Theme extends {} = {}> {
      * The theme object, will be merged with the theme provides by presets
      */
     theme?: Theme;
-    /**
-     * Preprocess the incoming utilities, return falsy value to exclude
-     */
-    preprocess?: (matcher: string) => string | undefined;
     /**
      * Layout name of shortcuts
      *
@@ -306,6 +320,8 @@ interface UserConfigDefaults<Theme extends {} = {}> extends ConfigBase<Theme>, U
 interface ResolvedConfig extends Omit<RequiredByKey<UserConfig, 'mergeSelectors' | 'theme' | 'rules' | 'variants' | 'layers' | 'extractors' | 'blocklist' | 'safelist' | 'preflights' | 'sortLayers'>, 'rules' | 'shortcuts'> {
     shortcuts: Shortcut[];
     variants: VariantObject[];
+    preprocess: Preprocessor[];
+    postprocess: Postprocessor[];
     rulesSize: number;
     rulesDynamic: (DynamicRule | undefined)[];
     rulesStaticMap: Record<string, [number, CSSObject | CSSEntries, RuleMeta | undefined] | undefined>;
@@ -342,6 +358,11 @@ declare type StringifiedUtil = readonly [
     parent: string | undefined,
     meta: RuleMeta | undefined
 ];
+interface UtilObject {
+    selector: string;
+    entries: CSSEntries;
+    parent: string | undefined;
+}
 interface GenerateOptions {
     /**
      * Filepath of the file being processed.
@@ -387,9 +408,6 @@ declare function isStaticShortcut(sc: Shortcut): sc is StaticShortcut;
 declare function toArray<T>(value?: T | T[]): T[];
 declare function uniq<T>(value: T[]): T[];
 declare function mergeSet<T>(target: Set<T>, append: Set<T>): Set<T>;
-declare function cacheFunction<T extends (str: string) => R, R extends string | {
-    readonly [key: string]: string | number;
-}>(fn: T): T;
 
 declare function hex2rgba(hex?: string): RGBAColorValue | undefined;
 
@@ -437,4 +455,4 @@ declare const extractorSplit: Extractor;
 
 declare const extractorSvelte: Extractor;
 
-export { ArgumentType, Awaitable, BetterMap, BlocklistRule, CSSEntries, CSSObject, CSSValues, ConfigBase, DeepPartial, DynamicMatcher, DynamicRule, DynamicShortcut, DynamicShortcutMatcher, Extractor, ExtractorContext, FilterPattern, FlatObjectTuple, GenerateOptions, GenerateResult, GeneratorOptions, ParsedColorValue, ParsedUtil, PartialByKeys, PluginOptions, Preflight, Preset, PresetOptions, RGBAColorValue, RawUtil, RequiredByKey, ResolvedConfig, RestArgs, Rule, RuleContext, RuleMeta, Shift, Shortcut, StaticRule, StaticShortcut, StaticShortcutMap, StringifiedUtil, TwoKeyMap, UnoGenerator, UserConfig, UserConfigDefaults, UserOnlyOptions, UserShortcuts, ValueHandler, ValueHandlerCallback, Variant, VariantContext, VariantFunction, VariantHandler, VariantMatchedResult, VariantObject, attributifyRE, cacheFunction, clearIdenticalEntries, createGenerator, createValueHandler, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit, extractorSvelte, hasScopePlaceholder, hex2rgba, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, mergeDeep, mergeSet, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, toArray, uniq, validateFilterRE, warnOnce, withLayer };
+export { ArgumentType, Awaitable, BetterMap, BlocklistRule, CSSEntries, CSSObject, CSSValues, ConfigBase, DeepPartial, DynamicMatcher, DynamicRule, DynamicShortcut, DynamicShortcutMatcher, Extractor, ExtractorContext, FilterPattern, FlatObjectTuple, GenerateOptions, GenerateResult, GeneratorOptions, ParsedColorValue, ParsedUtil, PartialByKeys, PluginOptions, Postprocessor, Preflight, Preprocessor, Preset, PresetOptions, RGBAColorValue, RawUtil, RequiredByKey, ResolvedConfig, RestArgs, Rule, RuleContext, RuleMeta, Shift, Shortcut, StaticRule, StaticShortcut, StaticShortcutMap, StringifiedUtil, TwoKeyMap, UnoGenerator, UserConfig, UserConfigDefaults, UserOnlyOptions, UserShortcuts, UtilObject, ValueHandler, ValueHandlerCallback, Variant, VariantContext, VariantFunction, VariantHandler, VariantMatchedResult, VariantObject, attributifyRE, clearIdenticalEntries, createGenerator, createValueHandler, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit, extractorSvelte, hasScopePlaceholder, hex2rgba, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, mergeDeep, mergeSet, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, toArray, uniq, validateFilterRE, warnOnce, withLayer };

package/dist/index.mjs

@@ -106,13 +106,6 @@ function mergeSet(target, append) {
   append.forEach((i) => target.add(i));
   return target;
 }
-function cacheFunction(fn) {
-  const cache = Object.create(null);
-  return (str) => {
-    const hit = cache[str];
-    return hit || (cache[str] = fn(str));
-  };
-}
 
 const hexRE = /^#?([\da-f]+)$/i;
 function hex2rgba(hex = "") {
@@ -252,7 +245,6 @@ function createValueHandler(handlers) {
       if (res != null)
         return res;
     }
-    return void 0;
   };
   function addProcessor(that, name) {
     if (!that.__options) {
@@ -356,6 +348,8 @@ function resolveConfig(userConfig = {}, defaults = {}) {
     rulesSize,
     rulesDynamic: rules,
     rulesStaticMap,
+    preprocess: mergePresets("preprocess"),
+    postprocess: mergePresets("postprocess"),
     preflights: mergePresets("preflights"),
     variants: mergePresets("variants").map(normalizeVariant),
     shortcuts: resolveShortcuts(mergePresets("shortcuts")),
@@ -364,7 +358,7 @@ function resolveConfig(userConfig = {}, defaults = {}) {
   };
 }
 
-const version = "0.19.0";
+const version = "0.20.4";
 
 class UnoGenerator {
   constructor(userConfig = {}, defaults = {}) {
@@ -442,8 +436,8 @@ class UnoGenerator {
         return;
       }
       let current = raw;
-      if (this.config.preprocess)
-        current = this.config.preprocess(raw);
+      for (const p of this.config.preprocess)
+        current = p(raw);
       if (this.isBlocked(current))
         return block(current);
       const applied = this.matchVariants(raw, current);
@@ -481,7 +475,7 @@ class UnoGenerator {
     const getLayer = (layer) => {
       if (layerCache[layer])
         return layerCache[layer];
-      let css = Array.from(sheet).sort((a, b) => (this.parentOrders.get(a[0]) || 0) - (this.parentOrders.get(b[0]) || 0)).map(([parent, items]) => {
+      let css = Array.from(sheet).sort((a, b) => (this.parentOrders.get(a[0]) ?? 0) - (this.parentOrders.get(b[0]) ?? 0) || a[0]?.localeCompare(b[0] || "") || 0).map(([parent, items]) => {
         const size = items.length;
         const sorted = items.filter((i) => (i[4]?.layer || "default") === layer).sort((a, b) => a[0] - b[0] || a[1]?.localeCompare(b[1] || "") || 0).map((a) => [a[1] ? applyScope(a[1], scope) : a[1], a[2]]);
         if (!sorted.length)
@@ -491,7 +485,7 @@ class UnoGenerator {
             for (let i = idx + 1; i < size; i++) {
               const current = sorted[i];
               if (current && current[0] && current[1] === body) {
-                current[0] = `${current[0]},${selector}`;
+                current[0] = `${current[0]},${nl}${selector}`;
                 return null;
               }
             }
@@ -560,19 +554,23 @@ class UnoGenerator {
     return [raw, processed, handlers];
   }
   applyVariants(parsed, variantHandlers = parsed[4], raw = parsed[1]) {
-    const entries = variantHandlers.reduce((p, v) => v.body?.(p) || p, parsed[2]);
-    return [
-      variantHandlers.reduce((p, v) => v.selector?.(p, entries) || p, toEscapedSelector(raw)),
+    const handlers = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0));
+    const entries = handlers.reduce((p, v) => v.body?.(p) || p, parsed[2]);
+    const obj = {
+      selector: handlers.reduce((p, v) => v.selector?.(p, entries) || p, toEscapedSelector(raw)),
       entries,
-      variantHandlers.reduce((p, v) => Array.isArray(v.parent) ? v.parent[0] : v.parent || p, void 0)
-    ];
+      parent: handlers.reduce((p, v) => Array.isArray(v.parent) ? v.parent[0] : v.parent || p, void 0)
+    };
+    for (const p of this.config.postprocess)
+      p(obj);
+    return obj;
   }
   constructCustomCSS(context, body, overrideSelector) {
     body = normalizeCSSEntries(body);
-    const [selector, entries, mediaQuery] = this.applyVariants([0, overrideSelector || context.rawSelector, body, void 0, context.variantHandlers]);
+    const { selector, entries, parent } = this.applyVariants([0, overrideSelector || context.rawSelector, body, void 0, context.variantHandlers]);
     const cssBody = `${selector}{${entriesToCss(entries)}}`;
-    if (mediaQuery)
-      return `${mediaQuery}{${cssBody}}`;
+    if (parent)
+      return `${parent}{${cssBody}}`;
     return cssBody;
   }
   async parseUtil(input, context, internal = false) {
@@ -609,11 +607,11 @@ class UnoGenerator {
       return;
     if (isRawUtil(parsed))
       return [parsed[0], void 0, parsed[1], void 0, parsed[2]];
-    const [selector, entries, mediaQuery] = this.applyVariants(parsed);
+    const { selector, entries, parent } = this.applyVariants(parsed);
     const body = entriesToCss(entries);
     if (!body)
       return;
-    return [parsed[0], selector, body, mediaQuery, parsed[3]];
+    return [parsed[0], selector, body, parent, parsed[3]];
   }
   expandShortcut(processed, context, depth = 3) {
     if (depth === 0)
@@ -658,8 +656,8 @@ class UnoGenerator {
     for (const item of parsed) {
       if (isRawUtil(item))
         continue;
-      const [selector, entries, mediaQuery] = this.applyVariants(item, [...item[4], ...parentVariants], raw);
-      const mapItem = selectorMap.getFallback(selector, mediaQuery, [[], item[0]]);
+      const { selector, entries, parent: parent2 } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push(...entries);
       if (item[0] > mapItem[1])
         mapItem[1] = item[0];
@@ -693,4 +691,4 @@ function toEscapedSelector(raw) {
     return `.${e(raw)}`;
 }
 
-export { BetterMap, TwoKeyMap, UnoGenerator, attributifyRE, cacheFunction, clearIdenticalEntries, createGenerator, createValueHandler, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit, extractorSvelte, hasScopePlaceholder, hex2rgba, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, mergeDeep, mergeSet, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, toArray, uniq, validateFilterRE, warnOnce, withLayer };
+export { BetterMap, TwoKeyMap, UnoGenerator, attributifyRE, clearIdenticalEntries, createGenerator, createValueHandler, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit, extractorSvelte, hasScopePlaceholder, hex2rgba, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, mergeDeep, mergeSet, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, toArray, uniq, validateFilterRE, warnOnce, withLayer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/core",
-  "version": "0.19.0",
+  "version": "0.20.4",
   "description": "The instant on-demand Atomic CSS engine.",
   "keywords": [
     "unocss",