packages/tailwindcss/src/variants.ts (1)

1215-1232: Reuse the candidate-side variant tokenizer here.

This is now a second parser for stacked-variant syntax. If packages/tailwindcss/src/candidate.ts picks up new escaping/bracketing rules, @variant can drift from utility-candidate parsing. I'd rather extract the comma -> group -> colon tokenization into a shared helper than open-code it in both places.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/tailwindcss/src/variants.ts` around lines 1215 - 1232, The code
duplicates candidate-side stacked-variant tokenization (segment(..., ',') then
segment(..., ':')), which risks drift; extract that logic into a shared helper
(e.g., export a parseStackedVariants or tokenizeVariantSequences function) and
use it from both packages/tailwindcss/src/variants.ts and
packages/tailwindcss/src/candidate.ts; update variants.ts to replace the inline
segment(...) chain that builds selectors with a call to the new helper (working
on variantNode.params) and keep the subsequent loop using selectors, so callers
like the loop that creates node = styleRule('&',
variantNode.nodes.map(cloneAstNode)) and designSystem.parseVariant(variant)
continue to work unchanged.

packages/tailwindcss/src/index.test.ts (1)

5551-5611: Add one true compound-variant case here.

This block currently exercises stacked static variants (hover:focus), but not a kind: 'compound' variant like group-hover, peer-focus, or not-hover that still goes through designSystem.parseVariant(...). One such case would better lock in the behavior this PR is aiming at.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/tailwindcss/src/index.test.ts` around lines 5551 - 5611, Add a true
“compound” variant test inside the describe('compound `@variant` rules') block
to exercise designSystem.parseVariant with kind: 'compound' (e.g., use a variant
like group-hover or peer-focus), not just stacked static variants; copy the
existing test structure (the compileCss call and snapshot assertion) and add a
new it(...) that uses `@variant` group-hover:focus (or `@variant` peer-focus:active)
in the CSS and assert the expected generated selector (e.g., .group:hover
.btn:focus { ... } for group-hover) so the snapshot verifies the compound
variant path is exercised.

packages/tailwindcss/src/index.test.ts (1)

5462-5736: Add one regression for arbitrary variants containing internal commas/colons.

The new parsing path now relies on segment() not splitting inside bracketed arbitrary variants. A case like @variant [&:is(:hover,:focus)], disabled { ... } would lock that behavior in and help prevent future parser regressions.

🤖 Prompt for AI Agents

Verify each finding against the current code and only fix it if needed.

In `@packages/tailwindcss/src/index.test.ts` around lines 5462 - 5736, Add a
regression test in the existing "comma-separated `@variant` rules" suite that
verifies arbitrary variants containing internal commas/colons are not split (use
compileCss and css helpers): create an it(...) that uses `@variant`
[&:is(:hover,:focus)], disabled { ... } inside a .btn rule and assert the
compiled output includes the combined selector for the arbitrary variant (e.g.
.btn[&:is(:hover,:focus)] -> translated correctly) and the separate
.btn:disabled rule; reference compileCss and css to locate where to add the
test.