wix / stylable

Stylable - CSS for components
https://stylable.io
MIT License
1.26k stars 62 forks source link

feat: support CSS nesting in CSS mixin #2855

Closed idoros closed 1 year ago

idoros commented 1 year ago

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.