feat(core): allow postprocessors to append or remove rules (#5010)

Menci · zyyv · web-flow · commit 298de3e86623 · 2025-12-02T16:27:48.000Z
Co-authored-by: Chris &lt;hizyyv@gmail.com&gt;
diff --git a/packages-engine/core/src/generator.ts b/packages-engine/core/src/generator.ts
@@ -156,7 +156,7 @@ class UnoGeneratorInternal<Theme extends object = object> {
       const utils = expanded
         ? await this.stringifyShortcuts(context.variantMatch, context, expanded[0], expanded[1])
         // no shortcuts
-        : (await this.parseUtil(context.variantMatch, context))?.map(i => this.stringifyUtil(i, context)).filter(notNull)
+        : (await this.parseUtil(context.variantMatch, context))?.flatMap(i => this.stringifyUtil(i, context)).filter(notNull)
 
       return utils
     }
@@ -496,7 +496,7 @@ class UnoGeneratorInternal<Theme extends object = object> {
     parsed: ParsedUtil,
     variantHandlers = parsed[4],
     raw = parsed[1],
-  ): UtilObject {
+  ): UtilObject[] {
     const handler = variantHandlers.slice()
       .sort((a, b) => (a.order || 0) - (b.order || 0))
       .reduceRight(
@@ -545,10 +545,22 @@ class UnoGeneratorInternal<Theme extends object = object> {
       noMerge: variantContextResult.noMerge,
     }
 
-    for (const p of this.config.postprocess)
-      p(obj)
-
-    return obj
+    return this.config.postprocess.reduce<UtilObject[]>(
+      (utilities, p) => {
+        const result: UtilObject[] = []
+        for (const util of utilities) {
+          const processed = p(util)
+          if (Array.isArray(processed)) {
+            result.push(...processed.filter(notNull))
+          }
+          else {
+            result.push(processed || util)
+          }
+        }
+        return result
+      },
+      [obj],
+    )
   }
 
   constructCustomCSS(
@@ -560,11 +572,14 @@ class UnoGeneratorInternal<Theme extends object = object> {
     if (isString(normalizedBody))
       return normalizedBody
 
-    const { selector, entries, parent } = this.applyVariants([0, overrideSelector || context.rawSelector, normalizedBody, undefined, context.variantHandlers])
-    const cssBody = `${selector}{${entriesToCss(entries)}}`
-    if (parent)
-      return `${parent}{${cssBody}}`
-    return cssBody
+    return this.applyVariants([0, overrideSelector || context.rawSelector, normalizedBody, undefined, context.variantHandlers])
+      .map(({ selector, entries, parent }) => {
+        const cssBody = `${selector}{${entriesToCss(entries)}}`
+        if (parent)
+          return `${parent}{${cssBody}}`
+        return cssBody
+      })
+      .join('')
   }
 
   async parseUtil(
@@ -736,32 +751,37 @@ class UnoGeneratorInternal<Theme extends object = object> {
   stringifyUtil(
     parsed?: ParsedUtil | RawUtil,
     context?: RuleContext<Theme>,
-  ): StringifiedUtil<Theme> | undefined {
+  ): StringifiedUtil<Theme>[] | undefined {
     if (!parsed)
       return
     if (isRawUtil(parsed))
-      return [parsed[0], undefined, parsed[1], undefined, parsed[2], this.config.details ? context : undefined, undefined]
-
-    const {
-      selector,
-      entries,
-      parent,
-      layer: variantLayer,
-      sort: variantSort,
-      noMerge,
-    } = this.applyVariants(parsed)
-    const body = entriesToCss(entries)
-
-    if (!body)
-      return
+      return [[parsed[0], undefined, parsed[1], undefined, parsed[2], this.config.details ? context : undefined, undefined]]
+
+    const utilities = this.applyVariants(parsed)
+    const result: StringifiedUtil<Theme>[] = []
+    for (const util of utilities) {
+      const {
+        selector,
+        entries,
+        parent,
+        layer: variantLayer,
+        sort: variantSort,
+        noMerge,
+      } = util
+      const body = entriesToCss(entries)
+
+      if (!body)
+        continue
 
-    const { layer: metaLayer, sort: metaSort, ...meta } = parsed[3] ?? {}
-    const ruleMeta = {
-      ...meta,
-      layer: variantLayer ?? metaLayer,
-      sort: variantSort ?? metaSort,
+      const { layer: metaLayer, sort: metaSort, ...meta } = parsed[3] ?? {}
+      const ruleMeta = {
+        ...meta,
+        layer: variantLayer ?? metaLayer,
+        sort: variantSort ?? metaSort,
+      }
+      result.push([parsed[0], selector, body, parent, ruleMeta, this.config.details ? context : undefined, noMerge])
     }
-    return [parsed[0], selector, body, parent, ruleMeta, this.config.details ? context : undefined, noMerge]
+    return result
   }
 
   async expandShortcut(
@@ -882,14 +902,14 @@ class UnoGeneratorInternal<Theme extends object = object> {
 
       const isNoMerge = Object.fromEntries(item[2])[symbols.shortcutsNoMerge]
       const variants = [...item[4], ...(!isNoMerge ? parentVariants : [])]
-      const { selector, entries, parent, sort, noMerge, layer } = this.applyVariants(item, variants, raw)
-
-      // find existing layer and merge
-      const selectorMap = layerMap.getFallback(layer ?? meta.layer, new TwoKeyMap())
-      // find existing selector/mediaQuery pair and merge
-      const mapItem = selectorMap.getFallback(selector, parent, [[], item[0]])
-      // add entries
-      mapItem[0].push([entries, !!(noMerge ?? item[3]?.noMerge), sort ?? 0])
+      for (const { selector, entries, parent, sort, noMerge, layer } of this.applyVariants(item, variants, raw)) {
+        // find existing layer and merge
+        const selectorMap = layerMap.getFallback(layer ?? meta.layer, new TwoKeyMap())
+        // find existing selector/mediaQuery pair and merge
+        const mapItem = selectorMap.getFallback(selector, parent, [[], item[0]])
+        // add entries
+        mapItem[0].push([entries, !!(noMerge ?? item[3]?.noMerge), sort ?? 0])
+      }
     }
     return rawStringifiedUtil.concat(layerMap
       .flatMap((selectorMap, layer) =>
diff --git a/packages-engine/core/src/types.ts b/packages-engine/core/src/types.ts
@@ -390,7 +390,7 @@ export interface VariantObject<Theme extends object = object> {
 export type Variant<Theme extends object = object> = VariantFunction<Theme> | VariantObject<Theme>
 
 export type Preprocessor = (matcher: string) => string | undefined
-export type Postprocessor = (util: UtilObject) => void
+export type Postprocessor = (util: UtilObject) => void | UtilObject | (UtilObject | null | undefined)[]
 export type ThemeExtender<Theme extends object = object> = (theme: Theme, config: Readonly<ResolvedConfig<Theme>>) => Theme | void
 
 export interface ConfigBase<Theme extends object = object> {
diff --git a/packages-engine/core/test/postprocess.test.ts b/packages-engine/core/test/postprocess.test.ts
@@ -42,3 +42,22 @@ it('postprocess', async () => {
     .text-opacity-50{--hi-text-opacity:0.5;}"
   `)
 })
+
+it('postprocess can expand utilities', async () => {
+  const uno = await createGenerator({
+    rules: [
+      ['foo', { color: 'red' }],
+    ],
+    postprocess: [
+      (util) => {
+        if (util.selector === '.foo')
+          return [util, { ...util, selector: `${util.selector}::after` }]
+      },
+    ],
+  })
+
+  const { css } = await uno.generate('foo', { preflights: false })
+  expect(css).toMatchInlineSnapshot(`
+    "/* layer: default */\n.foo,\n.foo::after{color:red;}"
+  `)
+})
