Port child variant

src/corePlugins.js

@@ -25,6 +25,9 @@ import { normalize } from './util/dataTypes'
 import { INTERNAL_FEATURES } from './lib/setupContextUtils'
 
 export let variantPlugins = {
+  childVariant: ({ addVariant }) => {
+    addVariant('*', '& > *')
+  },
   pseudoElementVariants: ({ addVariant }) => {
     addVariant('first-letter', '&::first-letter')
     addVariant('first-line', '&::first-line')

src/lib/setupContextUtils.js

@@ -756,6 +756,7 @@ function resolvePlugins(context, root) {
   // TODO: This is a workaround for backwards compatibility, since custom variants
   // were historically sorted before screen/stackable variants.
   let beforeVariants = [
+    variantPlugins['childVariant'],
     variantPlugins['pseudoElementVariants'],
     variantPlugins['pseudoClassVariants'],
     variantPlugins['hasVariants'],

tests/variants.test.js

@@ -1202,3 +1202,36 @@ crosscheck(({ stable, oxide }) => {
     `)
   })
 })
+
+test('* is matched by the parser as the children variant', async () => {
+  let config = {
+    content: [
+      {
+        raw: html`
+          <div class="*:italic" />
+          <div class="*:hover:italic" />
+          <div class="hover:*:italic" />
+          <div class="data-[slot=label]:*:hover:italic" />
+          <div class="[&_p]:*:hover:italic" />
+        `,
+      },
+    ],
+    corePlugins: { preflight: false },
+  }
+
+  let input = css`
+    @tailwind utilities;
+  `
+
+  let result = await run(input, config)
+
+  expect(result.css).toMatchFormattedCss(css`
+    .\*\:italic > *,
+    .\*\:hover\:italic:hover > *,
+    .hover\:\*\:italic > :hover,
+    .data-\[slot\=label\]\:\*\:hover\:italic:hover > [data-slot='label'],
+    .\[\&_p\]\:\*\:hover\:italic:hover > * p {
+      font-style: italic;
+    }
+  `)
+})