Vixen
02b45cc4
csharp
public sealed class ApplyExpander

Expands @apply inside a stylesheet.

No guide page documents this yet — the page shows what the code says about itself.

Remarks

@apply flex items-center gap-2 writes out what those utilities mean, in place. It exists because the two ways of styling something should be able to meet: a component with a real name and a real selector, built out of the same tokens as everything else, without repeating the numbers.

Expanded before ExCSS sees the stylesheet, which is why this is a text transform rather than a pass over the parsed tree. ExCSS would hand @apply back as an unknown rule with no structure worth walking, and the declarations it produces have to be part of the block they were written in — not a rule of their own, which is what any post-parse approach would be forced into.

Variants are refused rather than approximated. @apply hover:bg-accent would have to invent a rule with a different selector from the block it sits in, which is not what "apply this here" means, and quietly emitting one is worse than saying no.

Fields and properties (1)

  • public IReadOnlyList<string> Diagnostics

    Every @apply that could not be expanded, and why.

Methods (2)

  • public ApplyExpander(ThemeTokens tokens)

    Creates an expander.

  • public string Expand(string css)

    Expands every @apply in a stylesheet.

Used by (1)

  • ThemeAndScannerTestsVixen.Ui.Styling.Utilities.Tests