Apart from helping avoid redundant code, I could not imagine many use-cases for this.
However, more than that, I see it as a possibility for creating CSS that is not dependant on the class-names you put in the markup.
So, instead of using instead of cluttering your markup with classes like
<a class=“btn btn-red price-btn”>Buy Now</a>
and your CSS like
.price-btn {
font-weight: 700;
...
}
You would would be writing
<a class=“price-btn”>Buy Now</a>
and your CSS would look something like this:
.price-btn {
@apply --btn;
@apply --btn-red;
font-weight: 700;
...
}
Which, I think is a pretty neat as it separates your markup from additional style-dependent classes.