Re: [w3ctag/design-reviews] Declarative CSS Modules and Declarative Shadow DOM `adoptedstylesheets` attribute (Issue #1000)

KurtCattiSchmidt left a comment (w3ctag/design-reviews#1000)

> Currently `@import` [cannot be used](https://drafts.csswg.org/cssom/#the-cssstylesheet-interface) in a constructed stylesheet. Constructed stylesheets are widely used with Shadow DOM. Is there a plan to address this limitation?

Good point. The `@import` issue is complex and is being discussed here: https://github.com/WICG/webcomponents/issues/870. Any resolutions in that thread would definitely need to apply here as well. 

> It's important to note that constructed stylesheets may be shared across shadowRoots whereas style and link elements cannot. This allows devs to modify a single constructed stylesheet to change styling in any adopting shadowRoot. 

Yes, this is one of the key requirements of both of my proposals. My [alternate proposal](https://github.com/whatwg/html/issues/11019) handles this as well - it allows for `<link>` and `<style>` elements to share and underlying sheet with shadow roots.

> Not being able to combine this capability with sheets that also use `@sheet` would force devs tho have to choose between these features rather than easily use them together.

This is a great point, and I have already thought about this - in order for `@sheet` to work with declarative a `adoptedstylesheets` attribute, we'd need a new `sheet` attribute on `<template>`, similar to this proposal for `<link>` tags: https://github.com/whatwg/html/issues/11022. Imperative shadow DOM can handle `@sheet` support by using braces with the `from` syntax, e.g. `import {foo} from bar.css with { type: "css" };` would import the `@sheet` named "foo".

-- 
Reply to this email directly or view it on GitHub:
https://github.com/w3ctag/design-reviews/issues/1000#issuecomment-3076358888
You are receiving this because you are subscribed to this thread.

Message ID: <w3ctag/design-reviews/issues/1000/3076358888@github.com>