@unocss/core 0.58.4 → 0.58.6

package/dist/index.cjs

@@ -226,6 +226,14 @@ class TwoKeyMap {
   }
 }
 class BetterMap extends Map {
+  getFallback(key, fallback) {
+    const v = this.get(key);
+    if (v === void 0) {
+      this.set(key, fallback);
+      return fallback;
+    }
+    return v;
+  }
   map(mapFn) {
     const result = [];
     this.forEach((v, k) => {
@@ -233,6 +241,13 @@ class BetterMap extends Map {
     });
     return result;
   }
+  flatMap(mapFn) {
+    const result = [];
+    this.forEach((v, k) => {
+      result.push(...mapFn(v, k));
+    });
+    return result;
+  }
 }
 
 var __defProp$1 = Object.defineProperty;
@@ -590,7 +605,7 @@ function definePreset(preset) {
   return preset;
 }
 
-const version = "0.58.4";
+const version = "0.58.6";
 
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -697,6 +712,7 @@ class UnoGenerator {
       minify = false,
       extendedInfo = false
     } = options;
+    const outputCssLayers = this.config.outputToCssLayers;
     const tokens = isString(input) ? await this.applyExtractors(
       input,
       id,
@@ -764,7 +780,7 @@ class UnoGenerator {
     })();
     const layers = this.config.sortLayers(Array.from(layerSet).sort((a, b) => (this.config.layers[a] ?? 0) - (this.config.layers[b] ?? 0) || a.localeCompare(b)));
     const layerCache = {};
-    const getLayer = (layer) => {
+    const getLayer = (layer = LAYER_DEFAULT) => {
       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) || a[0]?.localeCompare(b[0] || "") || 0).map(([parent, items]) => {
@@ -803,6 +819,14 @@ class UnoGenerator {
       if (preflights) {
         css = [preflightsMap[layer], css].filter(Boolean).join(nl);
       }
+      if (outputCssLayers && css) {
+        let cssLayer = typeof outputCssLayers === "object" ? outputCssLayers.cssLayerName?.(layer) : void 0;
+        if (cssLayer !== null) {
+          if (!cssLayer)
+            cssLayer = layer;
+          css = `@layer ${cssLayer}{${nl}${css}${nl}}`;
+        }
+      }
       const layerMark = minify ? "" : `/* layer: ${layer} */${nl}`;
       return layerCache[layer] = css ? layerMark + css : "";
     };
@@ -1034,7 +1058,7 @@ class UnoGenerator {
     ];
   }
   async stringifyShortcuts(parent, context, expanded, meta = { layer: this.config.shortcutsLayer }) {
-    const selectorMap = new TwoKeyMap();
+    const layerMap = new BetterMap();
     const parsed = (await Promise.all(uniq(expanded).map(async (i) => {
       const result = isString(i) ? await this.parseUtil(i, context, true, meta.prefix) : [[Number.POSITIVE_INFINITY, "{inline}", normalizeCSSEntries(i), void 0, []]];
       if (!result && this.config.warn)
@@ -1048,30 +1072,33 @@ class UnoGenerator {
         rawStringifiedUtil.push([item[0], void 0, item[1], void 0, item[2], context, void 0]);
         continue;
       }
-      const { selector, entries, parent: parent2, sort, noMerge } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const { selector, entries, parent: parent2, sort, noMerge, layer } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const selectorMap = layerMap.getFallback(layer ?? meta.layer, new TwoKeyMap());
       const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push([entries, !!(noMerge ?? item[3]?.noMerge), sort ?? 0]);
     }
-    return rawStringifiedUtil.concat(selectorMap.map(([e2, index], selector, joinedParents) => {
-      const stringify = (flatten, noMerge, entrySortPair) => {
-        const maxSort = Math.max(...entrySortPair.map((e3) => e3[1]));
-        const entriesList = entrySortPair.map((e3) => e3[0]);
-        return (flatten ? [entriesList.flat(1)] : entriesList).map((entries) => {
-          const body = entriesToCss(entries);
-          if (body)
-            return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort }, context, void 0];
-          return void 0;
-        });
-      };
-      const merges = [
-        [e2.filter(([, noMerge]) => noMerge).map(([entries, , sort]) => [entries, sort]), true],
-        [e2.filter(([, noMerge]) => !noMerge).map(([entries, , sort]) => [entries, sort]), false]
-      ];
-      return merges.map(([e3, noMerge]) => [
-        ...stringify(false, noMerge, e3.filter(([entries]) => entries.some((entry) => entry[0] === CONTROL_SHORTCUT_NO_MERGE))),
-        ...stringify(true, noMerge, e3.filter(([entries]) => entries.every((entry) => entry[0] !== CONTROL_SHORTCUT_NO_MERGE)))
-      ]);
-    }).flat(2).filter(Boolean));
+    return rawStringifiedUtil.concat(layerMap.flatMap(
+      (selectorMap, layer) => selectorMap.map(([e2, index], selector, joinedParents) => {
+        const stringify = (flatten, noMerge, entrySortPair) => {
+          const maxSort = Math.max(...entrySortPair.map((e3) => e3[1]));
+          const entriesList = entrySortPair.map((e3) => e3[0]);
+          return (flatten ? [entriesList.flat(1)] : entriesList).map((entries) => {
+            const body = entriesToCss(entries);
+            if (body)
+              return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort, layer }, context, void 0];
+            return void 0;
+          });
+        };
+        const merges = [
+          [e2.filter(([, noMerge]) => noMerge).map(([entries, , sort]) => [entries, sort]), true],
+          [e2.filter(([, noMerge]) => !noMerge).map(([entries, , sort]) => [entries, sort]), false]
+        ];
+        return merges.map(([e3, noMerge]) => [
+          ...stringify(false, noMerge, e3.filter(([entries]) => entries.some((entry) => entry[0] === CONTROL_SHORTCUT_NO_MERGE))),
+          ...stringify(true, noMerge, e3.filter(([entries]) => entries.every((entry) => entry[0] !== CONTROL_SHORTCUT_NO_MERGE)))
+        ]);
+      }).flat(2).filter(Boolean)
+    ));
   }
   isBlocked(raw) {
     return !raw || this.config.blocklist.some((e2) => typeof e2 === "function" ? e2(raw) : isString(e2) ? e2 === raw : e2.test(raw));

package/dist/index.d.cts

@@ -98,7 +98,9 @@ declare class TwoKeyMap<K1, K2, V> {
     map<T>(fn: (v: V, k1: K1, k2: K2) => T): T[];
 }
 declare class BetterMap<K, V> extends Map<K, V> {
+    getFallback(key: K, fallback: V): V;
     map<R>(mapFn: (value: V, key: K) => R): R[];
+    flatMap<R extends readonly unknown[]>(mapFn: (value: V, key: K) => R): R[number][];
 }
 
 declare class CountableSet<K> extends Set<K> {
@@ -296,7 +298,7 @@ interface Extractor {
      *
      * Return `undefined` to skip this extractor.
      */
-    extract?(ctx: ExtractorContext): Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
+    extract?: (ctx: ExtractorContext) => Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
 }
 interface RuleMeta {
     /**
@@ -520,6 +522,10 @@ interface ConfigBase<Theme extends object = object> {
      * Layer orders. Default to 0.
      */
     layers?: Record<string, number>;
+    /**
+     * Output the internal layers as CSS Cascade Layers.
+     */
+    outputToCssLayers?: boolean | OutputCssLayersOptions;
     /**
      * Custom function to sort layers.
      */
@@ -578,6 +584,14 @@ interface ConfigBase<Theme extends object = object> {
      */
     details?: boolean;
 }
+interface OutputCssLayersOptions {
+    /**
+     * Specify the css layer that the internal layer should be output to.
+     *
+     * Return `null` to specify that the layer should not be output to any css layer.
+     */
+    cssLayerName?: (internalLayer: string) => string | undefined | null;
+}
 type AutoCompleteTemplate = string;
 type AutoCompleteFunction = (input: string) => Awaitable<string[]>;
 interface AutoCompleteExtractorContext {
@@ -702,7 +716,7 @@ interface UnocssPluginContext<Config extends UserConfig = UserConfig> {
     /**
      * Await all pending tasks
      */
-    flushTasks(): Promise<any>;
+    flushTasks: () => Promise<any>;
     filter: (code: string, id: string) => boolean;
     extract: (code: string, id?: string) => Promise<void>;
     reloadConfig: () => Promise<LoadConfigResult<Config>>;
@@ -869,8 +883,8 @@ interface ResolvedConfig<Theme extends object = object> extends Omit<RequiredByK
 interface GenerateResult<T = Set<string>> {
     css: string;
     layers: string[];
-    getLayer(name?: string): string | undefined;
-    getLayers(includes?: string[], excludes?: string[]): string;
+    getLayer: (name?: string) => string | undefined;
+    getLayers: (includes?: string[], excludes?: string[]) => string;
     matched: T;
 }
 type VariantMatchedResult<Theme extends object = object> = readonly [
@@ -981,4 +995,4 @@ declare function mergeConfigs<Theme extends object = object>(configs: UserConfig
 declare function definePreset<Options extends object | undefined = undefined, Theme extends object = object>(preset: PresetFactory<Theme, Options>): PresetFactory<Theme, Options>;
 declare function definePreset<Theme extends object = object>(preset: Preset<Theme>): Preset<Theme>;
 
-export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };
+export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type OutputCssLayersOptions, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };

package/dist/index.d.mts

@@ -98,7 +98,9 @@ declare class TwoKeyMap<K1, K2, V> {
     map<T>(fn: (v: V, k1: K1, k2: K2) => T): T[];
 }
 declare class BetterMap<K, V> extends Map<K, V> {
+    getFallback(key: K, fallback: V): V;
     map<R>(mapFn: (value: V, key: K) => R): R[];
+    flatMap<R extends readonly unknown[]>(mapFn: (value: V, key: K) => R): R[number][];
 }
 
 declare class CountableSet<K> extends Set<K> {
@@ -296,7 +298,7 @@ interface Extractor {
      *
      * Return `undefined` to skip this extractor.
      */
-    extract?(ctx: ExtractorContext): Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
+    extract?: (ctx: ExtractorContext) => Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
 }
 interface RuleMeta {
     /**
@@ -520,6 +522,10 @@ interface ConfigBase<Theme extends object = object> {
      * Layer orders. Default to 0.
      */
     layers?: Record<string, number>;
+    /**
+     * Output the internal layers as CSS Cascade Layers.
+     */
+    outputToCssLayers?: boolean | OutputCssLayersOptions;
     /**
      * Custom function to sort layers.
      */
@@ -578,6 +584,14 @@ interface ConfigBase<Theme extends object = object> {
      */
     details?: boolean;
 }
+interface OutputCssLayersOptions {
+    /**
+     * Specify the css layer that the internal layer should be output to.
+     *
+     * Return `null` to specify that the layer should not be output to any css layer.
+     */
+    cssLayerName?: (internalLayer: string) => string | undefined | null;
+}
 type AutoCompleteTemplate = string;
 type AutoCompleteFunction = (input: string) => Awaitable<string[]>;
 interface AutoCompleteExtractorContext {
@@ -702,7 +716,7 @@ interface UnocssPluginContext<Config extends UserConfig = UserConfig> {
     /**
      * Await all pending tasks
      */
-    flushTasks(): Promise<any>;
+    flushTasks: () => Promise<any>;
     filter: (code: string, id: string) => boolean;
     extract: (code: string, id?: string) => Promise<void>;
     reloadConfig: () => Promise<LoadConfigResult<Config>>;
@@ -869,8 +883,8 @@ interface ResolvedConfig<Theme extends object = object> extends Omit<RequiredByK
 interface GenerateResult<T = Set<string>> {
     css: string;
     layers: string[];
-    getLayer(name?: string): string | undefined;
-    getLayers(includes?: string[], excludes?: string[]): string;
+    getLayer: (name?: string) => string | undefined;
+    getLayers: (includes?: string[], excludes?: string[]) => string;
     matched: T;
 }
 type VariantMatchedResult<Theme extends object = object> = readonly [
@@ -981,4 +995,4 @@ declare function mergeConfigs<Theme extends object = object>(configs: UserConfig
 declare function definePreset<Options extends object | undefined = undefined, Theme extends object = object>(preset: PresetFactory<Theme, Options>): PresetFactory<Theme, Options>;
 declare function definePreset<Theme extends object = object>(preset: Preset<Theme>): Preset<Theme>;
 
-export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };
+export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type OutputCssLayersOptions, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };

package/dist/index.d.ts

@@ -98,7 +98,9 @@ declare class TwoKeyMap<K1, K2, V> {
     map<T>(fn: (v: V, k1: K1, k2: K2) => T): T[];
 }
 declare class BetterMap<K, V> extends Map<K, V> {
+    getFallback(key: K, fallback: V): V;
     map<R>(mapFn: (value: V, key: K) => R): R[];
+    flatMap<R extends readonly unknown[]>(mapFn: (value: V, key: K) => R): R[number][];
 }
 
 declare class CountableSet<K> extends Set<K> {
@@ -296,7 +298,7 @@ interface Extractor {
      *
      * Return `undefined` to skip this extractor.
      */
-    extract?(ctx: ExtractorContext): Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
+    extract?: (ctx: ExtractorContext) => Awaitable<Set<string> | CountableSet<string> | string[] | undefined | void>;
 }
 interface RuleMeta {
     /**
@@ -520,6 +522,10 @@ interface ConfigBase<Theme extends object = object> {
      * Layer orders. Default to 0.
      */
     layers?: Record<string, number>;
+    /**
+     * Output the internal layers as CSS Cascade Layers.
+     */
+    outputToCssLayers?: boolean | OutputCssLayersOptions;
     /**
      * Custom function to sort layers.
      */
@@ -578,6 +584,14 @@ interface ConfigBase<Theme extends object = object> {
      */
     details?: boolean;
 }
+interface OutputCssLayersOptions {
+    /**
+     * Specify the css layer that the internal layer should be output to.
+     *
+     * Return `null` to specify that the layer should not be output to any css layer.
+     */
+    cssLayerName?: (internalLayer: string) => string | undefined | null;
+}
 type AutoCompleteTemplate = string;
 type AutoCompleteFunction = (input: string) => Awaitable<string[]>;
 interface AutoCompleteExtractorContext {
@@ -702,7 +716,7 @@ interface UnocssPluginContext<Config extends UserConfig = UserConfig> {
     /**
      * Await all pending tasks
      */
-    flushTasks(): Promise<any>;
+    flushTasks: () => Promise<any>;
     filter: (code: string, id: string) => boolean;
     extract: (code: string, id?: string) => Promise<void>;
     reloadConfig: () => Promise<LoadConfigResult<Config>>;
@@ -869,8 +883,8 @@ interface ResolvedConfig<Theme extends object = object> extends Omit<RequiredByK
 interface GenerateResult<T = Set<string>> {
     css: string;
     layers: string[];
-    getLayer(name?: string): string | undefined;
-    getLayers(includes?: string[], excludes?: string[]): string;
+    getLayer: (name?: string) => string | undefined;
+    getLayers: (includes?: string[], excludes?: string[]) => string;
     matched: T;
 }
 type VariantMatchedResult<Theme extends object = object> = readonly [
@@ -981,4 +995,4 @@ declare function mergeConfigs<Theme extends object = object>(configs: UserConfig
 declare function definePreset<Options extends object | undefined = undefined, Theme extends object = object>(preset: PresetFactory<Theme, Options>): PresetFactory<Theme, Options>;
 declare function definePreset<Theme extends object = object>(preset: Preset<Theme>): Preset<Theme>;
 
-export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };
+export { type ArgumentType, type Arrayable, type AutoCompleteExtractor, type AutoCompleteExtractorContext, type AutoCompleteExtractorResult, type AutoCompleteFunction, type AutoCompleteTemplate, type Awaitable, BetterMap, type BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, type CSSColorValue, type CSSEntries, type CSSObject, type CSSValue, type CSSValues, type CliEntryItem, type CliOptions, type ConfigBase, type ContentOptions, CountableSet, type DeepPartial, type DynamicMatcher, type DynamicRule, type DynamicShortcut, type DynamicShortcutMatcher, type ExtendedTokenInfo, type Extractor, type ExtractorContext, type FilterPattern, type FlatObjectTuple, type GenerateOptions, type GenerateResult, type GeneratorOptions, type HighlightAnnotation, type OutputCssLayersOptions, type ParsedColorValue, type ParsedUtil, type PartialByKeys, type PluginOptions, type Postprocessor, type Preflight, type PreflightContext, type PreparedRule, type Preprocessor, type Preset, type PresetFactory, type PresetOptions, type PresetOrFactory, type RGBAColorValue, type RawUtil, type Replacement, type RequiredByKey, type ResolvedConfig, type RestArgs, type Rule, type RuleContext, type RuleMeta, type Shift, type Shortcut, type ShortcutValue, type SourceCodeTransformer, type SourceCodeTransformerEnforce, type SourceMap, type StaticRule, type StaticShortcut, type StaticShortcutMap, type StringifiedUtil, type SuggestResult, type ThemeExtender, type ToArray, TwoKeyMap, UnoGenerator, type UnocssPluginContext, type UserConfig, type UserConfigDefaults, type UserOnlyOptions, type UserShortcuts, type UtilObject, type Variant, type VariantContext, type VariantFunction, type VariantHandler, type VariantHandlerContext, type VariantMatchedResult, type VariantObject, attributifyRE, clearIdenticalEntries, clone, collapseVariantGroup, createGenerator, cssIdRE, defaultSplitRE, definePreset, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractorSplit as extractorDefault, extractorSplit, hasScopePlaceholder, isAttributifySelector, isCountableSet, isObject, isRawUtil, isStaticRule, isStaticShortcut, isString, isValidSelector, makeRegexClassGroup, mergeConfigs, mergeDeep, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, parseVariantGroup, regexScopePlaceholder, resolveConfig, resolvePreset, resolvePresets, resolveShortcuts, splitWithVariantGroupRE, toArray, toEscapedSelector, uniq, uniqueBy, validateFilterRE, warnOnce, withLayer };

package/dist/index.mjs

@@ -224,6 +224,14 @@ class TwoKeyMap {
   }
 }
 class BetterMap extends Map {
+  getFallback(key, fallback) {
+    const v = this.get(key);
+    if (v === void 0) {
+      this.set(key, fallback);
+      return fallback;
+    }
+    return v;
+  }
   map(mapFn) {
     const result = [];
     this.forEach((v, k) => {
@@ -231,6 +239,13 @@ class BetterMap extends Map {
     });
     return result;
   }
+  flatMap(mapFn) {
+    const result = [];
+    this.forEach((v, k) => {
+      result.push(...mapFn(v, k));
+    });
+    return result;
+  }
 }
 
 var __defProp$1 = Object.defineProperty;
@@ -588,7 +603,7 @@ function definePreset(preset) {
   return preset;
 }
 
-const version = "0.58.4";
+const version = "0.58.6";
 
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
@@ -695,6 +710,7 @@ class UnoGenerator {
       minify = false,
       extendedInfo = false
     } = options;
+    const outputCssLayers = this.config.outputToCssLayers;
     const tokens = isString(input) ? await this.applyExtractors(
       input,
       id,
@@ -762,7 +778,7 @@ class UnoGenerator {
     })();
     const layers = this.config.sortLayers(Array.from(layerSet).sort((a, b) => (this.config.layers[a] ?? 0) - (this.config.layers[b] ?? 0) || a.localeCompare(b)));
     const layerCache = {};
-    const getLayer = (layer) => {
+    const getLayer = (layer = LAYER_DEFAULT) => {
       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) || a[0]?.localeCompare(b[0] || "") || 0).map(([parent, items]) => {
@@ -801,6 +817,14 @@ class UnoGenerator {
       if (preflights) {
         css = [preflightsMap[layer], css].filter(Boolean).join(nl);
       }
+      if (outputCssLayers && css) {
+        let cssLayer = typeof outputCssLayers === "object" ? outputCssLayers.cssLayerName?.(layer) : void 0;
+        if (cssLayer !== null) {
+          if (!cssLayer)
+            cssLayer = layer;
+          css = `@layer ${cssLayer}{${nl}${css}${nl}}`;
+        }
+      }
       const layerMark = minify ? "" : `/* layer: ${layer} */${nl}`;
       return layerCache[layer] = css ? layerMark + css : "";
     };
@@ -1032,7 +1056,7 @@ class UnoGenerator {
     ];
   }
   async stringifyShortcuts(parent, context, expanded, meta = { layer: this.config.shortcutsLayer }) {
-    const selectorMap = new TwoKeyMap();
+    const layerMap = new BetterMap();
     const parsed = (await Promise.all(uniq(expanded).map(async (i) => {
       const result = isString(i) ? await this.parseUtil(i, context, true, meta.prefix) : [[Number.POSITIVE_INFINITY, "{inline}", normalizeCSSEntries(i), void 0, []]];
       if (!result && this.config.warn)
@@ -1046,30 +1070,33 @@ class UnoGenerator {
         rawStringifiedUtil.push([item[0], void 0, item[1], void 0, item[2], context, void 0]);
         continue;
       }
-      const { selector, entries, parent: parent2, sort, noMerge } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const { selector, entries, parent: parent2, sort, noMerge, layer } = this.applyVariants(item, [...item[4], ...parentVariants], raw);
+      const selectorMap = layerMap.getFallback(layer ?? meta.layer, new TwoKeyMap());
       const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push([entries, !!(noMerge ?? item[3]?.noMerge), sort ?? 0]);
     }
-    return rawStringifiedUtil.concat(selectorMap.map(([e2, index], selector, joinedParents) => {
-      const stringify = (flatten, noMerge, entrySortPair) => {
-        const maxSort = Math.max(...entrySortPair.map((e3) => e3[1]));
-        const entriesList = entrySortPair.map((e3) => e3[0]);
-        return (flatten ? [entriesList.flat(1)] : entriesList).map((entries) => {
-          const body = entriesToCss(entries);
-          if (body)
-            return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort }, context, void 0];
-          return void 0;
-        });
-      };
-      const merges = [
-        [e2.filter(([, noMerge]) => noMerge).map(([entries, , sort]) => [entries, sort]), true],
-        [e2.filter(([, noMerge]) => !noMerge).map(([entries, , sort]) => [entries, sort]), false]
-      ];
-      return merges.map(([e3, noMerge]) => [
-        ...stringify(false, noMerge, e3.filter(([entries]) => entries.some((entry) => entry[0] === CONTROL_SHORTCUT_NO_MERGE))),
-        ...stringify(true, noMerge, e3.filter(([entries]) => entries.every((entry) => entry[0] !== CONTROL_SHORTCUT_NO_MERGE)))
-      ]);
-    }).flat(2).filter(Boolean));
+    return rawStringifiedUtil.concat(layerMap.flatMap(
+      (selectorMap, layer) => selectorMap.map(([e2, index], selector, joinedParents) => {
+        const stringify = (flatten, noMerge, entrySortPair) => {
+          const maxSort = Math.max(...entrySortPair.map((e3) => e3[1]));
+          const entriesList = entrySortPair.map((e3) => e3[0]);
+          return (flatten ? [entriesList.flat(1)] : entriesList).map((entries) => {
+            const body = entriesToCss(entries);
+            if (body)
+              return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort, layer }, context, void 0];
+            return void 0;
+          });
+        };
+        const merges = [
+          [e2.filter(([, noMerge]) => noMerge).map(([entries, , sort]) => [entries, sort]), true],
+          [e2.filter(([, noMerge]) => !noMerge).map(([entries, , sort]) => [entries, sort]), false]
+        ];
+        return merges.map(([e3, noMerge]) => [
+          ...stringify(false, noMerge, e3.filter(([entries]) => entries.some((entry) => entry[0] === CONTROL_SHORTCUT_NO_MERGE))),
+          ...stringify(true, noMerge, e3.filter(([entries]) => entries.every((entry) => entry[0] !== CONTROL_SHORTCUT_NO_MERGE)))
+        ]);
+      }).flat(2).filter(Boolean)
+    ));
   }
   isBlocked(raw) {
     return !raw || this.config.blocklist.some((e2) => typeof e2 === "function" ? e2(raw) : isString(e2) ? e2 === raw : e2.test(raw));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/core",
-  "version": "0.58.4",
+  "version": "0.58.6",
   "description": "The instant on-demand Atomic CSS engine.",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -37,7 +37,7 @@
     "dist"
   ],
   "devDependencies": {
-    "magic-string": "^0.30.5",
+    "magic-string": "^0.30.8",
     "unconfig": "^0.3.11"
   },
   "scripts": {