@unocss/core 0.39.2 → 0.41.0

package/dist/index.cjs

@@ -350,7 +350,7 @@ function extractQuoted(str, options = {}) {
   return result;
 }
 
-const splitCode = (code) => code.split(/[\s'"`;>=]+/g).filter(isValidSelector);
+const splitCode = (code) => code.split(/[\s'"`;=]+/g).filter(isValidSelector);
 const extractorSplit = {
   name: "split",
   order: 0,
@@ -460,7 +460,7 @@ function resolveConfig(userConfig = {}, defaults = {}) {
   };
 }
 
-const version = "0.39.2";
+const version = "0.41.0";
 
 class UnoGenerator {
   constructor(userConfig = {}, defaults = {}) {
@@ -638,7 +638,10 @@ class UnoGenerator {
           const selectors = selectorSortPair ? [...new Set(selectorSortPair.sort((a, b) => a[1] - b[1] || a[0]?.localeCompare(b[0] || "") || 0).map((pair) => pair[0]).filter(Boolean))] : [];
           return selectors.length ? `${selectors.join(`,${nl}`)}{${body}}` : body;
         }).filter(Boolean).reverse().join(nl);
-        return parent ? `${parent}{${nl}${rules}${nl}}` : rules;
+        if (!parent)
+          return rules;
+        const parents = parent.split(" $$ ");
+        return `${parents.join("{")}{${nl}${rules}${nl}}${parents.map((_) => "").join("}")}`;
       }).filter(Boolean).join(nl);
       if (preflights) {
         css = [preflightsMap[layer], css].filter(Boolean).join(nl);
@@ -679,8 +682,6 @@ class UnoGenerator {
         if (typeof handler === "string")
           handler = { matcher: handler };
         processed = handler.matcher;
-        if (Array.isArray(handler.parent))
-          this.parentOrders.set(handler.parent[0], handler.parent[1]);
         handlers.unshift(handler);
         variants.add(v);
         applied = true;
@@ -694,25 +695,38 @@ class UnoGenerator {
     return [raw, processed, handlers, variants];
   }
   applyVariants(parsed, variantHandlers = parsed[4], raw = parsed[1]) {
-    const handlers = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0));
-    let entries = parsed[2];
-    let selector = toEscapedSelector(raw);
-    let parent;
-    let layer;
-    let sort;
-    handlers.forEach((v) => {
-      entries = v.body?.(entries) || entries;
-      selector = v.selector?.(selector, entries) || selector;
-      parent = Array.isArray(v.parent) ? v.parent[0] : v.parent || parent;
-      layer = v.layer || layer;
-      sort = v.sort || sort;
+    const handler = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0)).reverse().reduce((previous, v) => (input) => {
+      const entries = v.body?.(input.entries) || input.entries;
+      const parents = Array.isArray(v.parent) ? v.parent : [v.parent, void 0];
+      return (v.handle ?? defaultVariantHandler)({
+        ...input,
+        entries,
+        selector: v.selector?.(input.selector, entries) || input.selector,
+        parent: parents[0] || input.parent,
+        parentOrder: parents[1] || input.parentOrder,
+        layer: v.layer || input.layer,
+        sort: v.sort || input.sort
+      }, previous);
+    }, (input) => input);
+    const variantContextResult = handler({
+      prefix: "",
+      selector: toEscapedSelector(raw),
+      pseudo: "",
+      entries: parsed[2]
     });
+    const { parent, parentOrder } = variantContextResult;
+    if (parent != null && parentOrder != null)
+      this.parentOrders.set(parent, parentOrder);
     const obj = {
-      selector: movePseudoElementsEnd(selector),
-      entries,
+      selector: movePseudoElementsEnd([
+        variantContextResult.prefix,
+        variantContextResult.selector,
+        variantContextResult.pseudo
+      ].join("")),
+      entries: variantContextResult.entries,
       parent,
-      layer,
-      sort
+      layer: variantContextResult.layer,
+      sort: variantContextResult.sort
     };
     for (const p of this.config.postprocess)
       p(obj);
@@ -847,14 +861,14 @@ class UnoGenerator {
       const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push([entries, !!item[3]?.noMerge, sort ?? 0]);
     }
-    return rawStringfieldUtil.concat(selectorMap.map(([e2, index], selector, mediaQuery) => {
+    return rawStringfieldUtil.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, mediaQuery, { ...meta, noMerge, sort: maxSort }, context];
+            return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort }, context];
           return void 0;
         });
       };
@@ -897,6 +911,9 @@ function toEscapedSelector(raw) {
     return raw.replace(attributifyRe, (_, n, s, i) => `[${e(n)}${s}"${e(i)}"]`);
   return `.${e(raw)}`;
 }
+function defaultVariantHandler(input, next) {
+  return next(input);
+}
 
 exports.BetterMap = BetterMap;
 exports.CONTROL_SHORTCUT_NO_MERGE = CONTROL_SHORTCUT_NO_MERGE;

package/dist/index.d.ts

@@ -333,11 +333,53 @@ interface Preflight<Theme extends {} = {}> {
     layer?: string;
 }
 declare type BlocklistRule = string | RegExp;
+interface VariantHandlerContext {
+    /**
+     * Rewrite the output selector. Often be used to append parents.
+     */
+    prefix: string;
+    /**
+     * Rewrite the output selector. Often be used to append pesudo classes.
+     */
+    selector: string;
+    /**
+     * Rewrite the output selector. Often be used to append pesudo elements.
+     */
+    pseudo: string;
+    /**
+     * Rewrite the output css body. The input come in [key,value][] pairs.
+     */
+    entries: CSSEntries;
+    /**
+     * Provide a parent selector(e.g. media query) to the output css.
+     */
+    parent?: string;
+    /**
+     * Provide order to the `parent` parent selector within layer.
+     */
+    parentOrder?: number;
+    /**
+     * Override layer to the output css.
+     */
+    layer?: string;
+    /**
+     * Order in which the variant is sorted within single rule.
+     */
+    sort?: number;
+}
 interface VariantHandler {
+    /**
+     * Callback to process the handler.
+     */
+    handle?: (input: VariantHandlerContext, next: (input: VariantHandlerContext) => VariantHandlerContext) => VariantHandlerContext;
     /**
      * The result rewritten selector for the next round of matching
      */
     matcher: string;
+    /**
+     * Order in which the variant is applied to selector.
+     */
+    order?: number;
     /**
      * Rewrite the output selector. Often be used to append pesudo classes or parents.
      */
@@ -350,10 +392,6 @@ interface VariantHandler {
      * Provide a parent selector(e.g. media query) to the output css.
      */
     parent?: string | [string, number] | undefined;
-    /**
-     * Order in which the variant is applied to selector.
-     */
-    order?: number;
     /**
      * Order in which the variant is sorted within single rule.
      */
@@ -732,4 +770,4 @@ declare const extractorSplit: Extractor;
 
 declare const extractorSvelte: Extractor;
 
-export { ArgumentType, Arrayable, AutoCompleteExtractor, AutoCompleteExtractorContext, AutoCompleteExtractorResult, AutoCompleteFunction, AutoCompleteTemplate, Awaitable, BetterMap, BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, CSSColorValue, CSSEntries, CSSObject, CSSValue, CSSValues, ConfigBase, DeepPartial, DetailString, DynamicMatcher, DynamicRule, DynamicShortcut, DynamicShortcutMatcher, ExtractStringOptions, Extractor, ExtractorContext, FilterPattern, FlatObjectTuple, GenerateOptions, GenerateResult, GeneratorOptions, ParsedColorValue, ParsedUtil, PartialByKeys, PluginOptions, Postprocessor, Preflight, PreflightContext, PreparedRule, Preprocessor, Preset, PresetOptions, RGBAColorValue, Range, RawUtil, Replacement, RequiredByKey, ResolvedConfig, RestArgs, Rule, RuleContext, RuleMeta, Shift, Shortcut, SourceCodeTransformer, SourceMap, StaticRule, StaticShortcut, StaticShortcutMap, StringifiedUtil, SuggestResult, ThemeExtender, TransformResult, TwoKeyMap, UnoGenerator, UnocssPluginContext, UserConfig, UserConfigDefaults, UserOnlyOptions, UserShortcuts, UtilObject, ValueHandler, ValueHandlerCallback, Variant, VariantContext, VariantFunction, VariantHandler, VariantMatchedResult, VariantObject, attributifyRE, clearIdenticalEntries, clone, createGenerator, createValueHandler, cssIdRE, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractQuoted, extractorSplit, extractorSvelte, hasScopePlaceholder, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, matchingPair, mergeDeep, mergeSet, movePseudoElementsEnd, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, regexScopePlaceholder, toArray, toEscapedSelector, uniq, validateFilterRE, warnOnce, withLayer };
+export { ArgumentType, Arrayable, AutoCompleteExtractor, AutoCompleteExtractorContext, AutoCompleteExtractorResult, AutoCompleteFunction, AutoCompleteTemplate, Awaitable, BetterMap, BlocklistRule, CONTROL_SHORTCUT_NO_MERGE, CSSColorValue, CSSEntries, CSSObject, CSSValue, CSSValues, ConfigBase, DeepPartial, DetailString, DynamicMatcher, DynamicRule, DynamicShortcut, DynamicShortcutMatcher, ExtractStringOptions, Extractor, ExtractorContext, FilterPattern, FlatObjectTuple, GenerateOptions, GenerateResult, GeneratorOptions, ParsedColorValue, ParsedUtil, PartialByKeys, PluginOptions, Postprocessor, Preflight, PreflightContext, PreparedRule, Preprocessor, Preset, PresetOptions, RGBAColorValue, Range, RawUtil, Replacement, RequiredByKey, ResolvedConfig, RestArgs, Rule, RuleContext, RuleMeta, Shift, Shortcut, SourceCodeTransformer, SourceMap, StaticRule, StaticShortcut, StaticShortcutMap, StringifiedUtil, SuggestResult, ThemeExtender, TransformResult, TwoKeyMap, UnoGenerator, UnocssPluginContext, UserConfig, UserConfigDefaults, UserOnlyOptions, UserShortcuts, UtilObject, ValueHandler, ValueHandlerCallback, Variant, VariantContext, VariantFunction, VariantHandler, VariantHandlerContext, VariantMatchedResult, VariantObject, attributifyRE, clearIdenticalEntries, clone, createGenerator, createValueHandler, cssIdRE, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractQuoted, extractorSplit, extractorSvelte, hasScopePlaceholder, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, matchingPair, mergeDeep, mergeSet, movePseudoElementsEnd, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, regexScopePlaceholder, toArray, toEscapedSelector, uniq, validateFilterRE, warnOnce, withLayer };

package/dist/index.mjs

@@ -346,7 +346,7 @@ function extractQuoted(str, options = {}) {
   return result;
 }
 
-const splitCode = (code) => code.split(/[\s'"`;>=]+/g).filter(isValidSelector);
+const splitCode = (code) => code.split(/[\s'"`;=]+/g).filter(isValidSelector);
 const extractorSplit = {
   name: "split",
   order: 0,
@@ -456,7 +456,7 @@ function resolveConfig(userConfig = {}, defaults = {}) {
   };
 }
 
-const version = "0.39.2";
+const version = "0.41.0";
 
 class UnoGenerator {
   constructor(userConfig = {}, defaults = {}) {
@@ -634,7 +634,10 @@ class UnoGenerator {
           const selectors = selectorSortPair ? [...new Set(selectorSortPair.sort((a, b) => a[1] - b[1] || a[0]?.localeCompare(b[0] || "") || 0).map((pair) => pair[0]).filter(Boolean))] : [];
           return selectors.length ? `${selectors.join(`,${nl}`)}{${body}}` : body;
         }).filter(Boolean).reverse().join(nl);
-        return parent ? `${parent}{${nl}${rules}${nl}}` : rules;
+        if (!parent)
+          return rules;
+        const parents = parent.split(" $$ ");
+        return `${parents.join("{")}{${nl}${rules}${nl}}${parents.map((_) => "").join("}")}`;
       }).filter(Boolean).join(nl);
       if (preflights) {
         css = [preflightsMap[layer], css].filter(Boolean).join(nl);
@@ -675,8 +678,6 @@ class UnoGenerator {
         if (typeof handler === "string")
           handler = { matcher: handler };
         processed = handler.matcher;
-        if (Array.isArray(handler.parent))
-          this.parentOrders.set(handler.parent[0], handler.parent[1]);
         handlers.unshift(handler);
         variants.add(v);
         applied = true;
@@ -690,25 +691,38 @@ class UnoGenerator {
     return [raw, processed, handlers, variants];
   }
   applyVariants(parsed, variantHandlers = parsed[4], raw = parsed[1]) {
-    const handlers = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0));
-    let entries = parsed[2];
-    let selector = toEscapedSelector(raw);
-    let parent;
-    let layer;
-    let sort;
-    handlers.forEach((v) => {
-      entries = v.body?.(entries) || entries;
-      selector = v.selector?.(selector, entries) || selector;
-      parent = Array.isArray(v.parent) ? v.parent[0] : v.parent || parent;
-      layer = v.layer || layer;
-      sort = v.sort || sort;
+    const handler = [...variantHandlers].sort((a, b) => (a.order || 0) - (b.order || 0)).reverse().reduce((previous, v) => (input) => {
+      const entries = v.body?.(input.entries) || input.entries;
+      const parents = Array.isArray(v.parent) ? v.parent : [v.parent, void 0];
+      return (v.handle ?? defaultVariantHandler)({
+        ...input,
+        entries,
+        selector: v.selector?.(input.selector, entries) || input.selector,
+        parent: parents[0] || input.parent,
+        parentOrder: parents[1] || input.parentOrder,
+        layer: v.layer || input.layer,
+        sort: v.sort || input.sort
+      }, previous);
+    }, (input) => input);
+    const variantContextResult = handler({
+      prefix: "",
+      selector: toEscapedSelector(raw),
+      pseudo: "",
+      entries: parsed[2]
     });
+    const { parent, parentOrder } = variantContextResult;
+    if (parent != null && parentOrder != null)
+      this.parentOrders.set(parent, parentOrder);
     const obj = {
-      selector: movePseudoElementsEnd(selector),
-      entries,
+      selector: movePseudoElementsEnd([
+        variantContextResult.prefix,
+        variantContextResult.selector,
+        variantContextResult.pseudo
+      ].join("")),
+      entries: variantContextResult.entries,
       parent,
-      layer,
-      sort
+      layer: variantContextResult.layer,
+      sort: variantContextResult.sort
     };
     for (const p of this.config.postprocess)
       p(obj);
@@ -843,14 +857,14 @@ class UnoGenerator {
       const mapItem = selectorMap.getFallback(selector, parent2, [[], item[0]]);
       mapItem[0].push([entries, !!item[3]?.noMerge, sort ?? 0]);
     }
-    return rawStringfieldUtil.concat(selectorMap.map(([e2, index], selector, mediaQuery) => {
+    return rawStringfieldUtil.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, mediaQuery, { ...meta, noMerge, sort: maxSort }, context];
+            return [index, selector, body, joinedParents, { ...meta, noMerge, sort: maxSort }, context];
           return void 0;
         });
       };
@@ -893,5 +907,8 @@ function toEscapedSelector(raw) {
     return raw.replace(attributifyRe, (_, n, s, i) => `[${e(n)}${s}"${e(i)}"]`);
   return `.${e(raw)}`;
 }
+function defaultVariantHandler(input, next) {
+  return next(input);
+}
 
 export { BetterMap, CONTROL_SHORTCUT_NO_MERGE, TwoKeyMap, UnoGenerator, attributifyRE, clearIdenticalEntries, clone, createGenerator, createValueHandler, cssIdRE, e, entriesToCss, escapeRegExp, escapeSelector, expandVariantGroup, extractQuoted, extractorSplit, extractorSvelte, hasScopePlaceholder, isAttributifySelector, isObject, isRawUtil, isStaticRule, isStaticShortcut, isValidSelector, matchingPair, mergeDeep, mergeSet, movePseudoElementsEnd, noop, normalizeCSSEntries, normalizeCSSValues, normalizeVariant, notNull, regexClassGroup, regexScopePlaceholder, toArray, toEscapedSelector, uniq, validateFilterRE, warnOnce, withLayer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unocss/core",
-  "version": "0.39.2",
+  "version": "0.41.0",
   "description": "The instant on-demand Atomic CSS engine.",
   "author": "Anthony Fu <anthonyfu117@hotmail.com>",
   "license": "MIT",