Re: [csswg-drafts] [css-cascade-6] Add ability to scope rules from an imported stylesheet (#7348)

The CSS Working Group just discussed `scoping rules from @import`, and agreed to the following:

* `RESOLVED: add scope() to @import syntax`

<details><summary>The full IRC log of that discussion</summary>
&lt;emilio> Topic: scoping rules from @import<br>
&lt;emilio> Github: https://github.com/w3c/csswg-drafts/issues/7348<br>
&lt;emilio> miriam: similar to layer() in @import<br>
&lt;emilio> ... and upcoming layer in &lt;link><br>
&lt;emilio> ... there's a proposal to add scoping to a sheet when it's scoped<br>
&lt;emilio> ... proposal is to put the scoping condition in @scope<br>
&lt;emilio> ... and put it inside of a function<br>
&lt;emilio> ... so @import "url" scope(&lt;root> to &lt;lower>);<br>
&lt;emilio> ... we might want the same for html<br>
&lt;emilio> ... if you're only using scope you need double parens<br>
&lt;emilio> ... which is a bit ackward<br>
&lt;emilio> ... but proposal is to add the scope() function and maybe a shorthand for that awkward case<br>
&lt;emilio> q+<br>
&lt;heycam> emilio: this feels a bit more similar to @container or such, than @layer<br>
&lt;heycam> ... I feel it's a bit awkward. when would you want to scope a whole style sheet?<br>
&lt;Rossen_> ack emilio<br>
&lt;heycam> miriam: this would be particularly useful for systems that are currently modular / separate style sheets per component<br>
&lt;heycam> ... we could take those separate sheets, apply a scope as importing them<br>
&lt;heycam> emilio: could use shadow DOM<br>
&lt;heycam> miriam: other way is to wrap it in a file<br>
&lt;heycam> emilio: seems like a weird thing to have a shorthand for<br>
&lt;heycam> ... but if you say it's useful<br>
&lt;heycam> emilio: it feels weird in the sense it's depends on the DOM you're styling, rather than layer or media, where it's more about the style sheet itself and the environment<br>
&lt;heycam> miriam: I'll say people are going to do this. they have other methods to do it. I don't feel strongly we need this one, but it will keep coming up<br>
&lt;heycam> ... do we want to provide it as a shorthand?<br>
&lt;heycam> emilio: should we encourage it?<br>
&lt;heycam> ... if you want this kind of scoping for your whole style sheet, you may just want to use shadow DOM and drop the style sheet there<br>
&lt;heycam> miriam: scope is fairly different from shadow DOM<br>
&lt;heycam> ... you could make a fair argument that if the style sheet is meant to be scoped then it should be inside the style sheet<br>
&lt;heycam> ydaniv: it might not be your style sheet<br>
&lt;heycam> emilio: I get wanting to use teh style sheet only when I'm printing, or to put it in this layer, but I want to scope this whole style sheet, since it depends on what selectors you're scoping it to<br>
&lt;heycam> chrishtr: seems like it's the same as @scope<br>
&lt;heycam> ... it's just for a whole file<br>
&lt;heycam> ... that could be convenient<br>
&lt;heycam> ... if we accept the general usefulness of scoping, which I think it is, we should provide primitives to make that easier<br>
&lt;heycam> ... this seems like a natural extension to that<br>
&lt;heycam> emilio: you could make the same argument for container<br>
&lt;heycam> emilio: to me, @scope and @container are more similar than @scope and @media<br>
&lt;heycam> ydaniv: it's more like @layer<br>
&lt;heycam> emilio: do you think so?<br>
&lt;heycam> ... @layer doesn't change whether something matches or not<br>
&lt;heycam> chrishtr: it's scoping to different subtrees<br>
&lt;heycam> emilio: not objecting<br>
&lt;emilio> RESOLVED: add scope() to @import syntax<br>
</details>


-- 
GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7348#issuecomment-1248646574 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 15 September 2022 21:23:54 UTC