You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
_populateRules in ui/styling/style-scope.ts only descends into @media at-rules. Any other block at-rule — @layer, @supports, @scope, @container — is silently dropped with its contents.
@layer utilities {.my-util{color: red;}}
.my-util never applies. This is already biting the ecosystem: Tailwind v4 output crashes/loops on @layer (NativeScript/tailwind#197), and Panda CSS / Bamboo / UnoCSS all emit cascade layers, so none of the modern build-time atomic-CSS pipelines can feed NativeScript today. Community workarounds flatten @layer at bundler time (e.g. ns-tailwind-vite), which loses the cascade semantics.
Proposal
Apply @layer per CSS Cascade Level 5, scoped to what NativeScript's cascade implements:
Parse: the css-tree adapter (css/css-tree-parser.ts) already emits {type: 'layer', rules: [...]} — it just needs to keep the prelude (layer names).
Order: a document-wide name → ordinal registry; statement form @layer a, b; pre-declares order, block form registers on first sight, dotted names (a.b) resolve through ancestors, anonymous blocks get unreferenceable names.
Cascade: each RuleSet carries a layerPath: number[]; compareSelectors compares layer paths before specificity, with unlayered rules sorting after all layered ones — matching the spec (unlayered author styles beat all layered styles; layer order beats specificity within layers).
@import "x.css" layer(name) nests the imported sheet under the named layer.
Deliberately out of scope: !important layer-order reversal (NS does not implement !important — it warns and strips) and other block at-rules (@supports, @container, @scope), which still need real semantics and are safer left dropped than applied unconditionally.
PR
I have a patch ready on a fork branch with unit tests — will open the PR referencing this issue.
Activity