Up until now, when a mixin fragment was created, Stylable used a nesting selector (&) internally to mark the mixin anchor that would be fused in transformation to the mixin target. This is conflicting with native CSS nesting in case the mixin has a nesting selector in it's source.
This PR refactors the internal selector that is used to mark the mixin anchor from & to [st-mixin-marker], solving an issue with mixins that contain CSS nesting.
Collect and merge nested rules
Merges the transformed mixin fragment for nested rules
fix: merge nested at-rules instead of flattening deep declarations
NO NESTING IN JS MIXINS
JS mixin uses & to reference the mix target anchor, which is a public API that cannot change. To support nesting in JS mixin, Stylable would have to offer a new mixin API that would provide some other way of referencing the mixin anchor.
Custom marker from mixin anchor
Up until now, when a mixin fragment was created, Stylable used a nesting selector (
&
) internally to mark the mixin anchor that would be fused in transformation to the mixin target. This is conflicting with native CSS nesting in case the mixin has a nesting selector in it's source.This PR refactors the internal selector that is used to mark the mixin anchor from
&
to[st-mixin-marker]
, solving an issue with mixins that contain CSS nesting.Collect and merge nested rules
NO NESTING IN JS MIXINS
JS mixin uses
&
to reference the mix target anchor, which is a public API that cannot change. To support nesting in JS mixin, Stylable would have to offer a new mixin API that would provide some other way of referencing the mixin anchor.