Constructable Stylesheets and LitElement

[nemethmik]

Hello to the Lit Community!
I have recently found this article and I was wondering, if it is a more efficient way of sharing big block of CSS between light and shadow DOM than what is suggested in the Sharing Styles section in the Lit documentation?
Have you tried it or considered giving it a try?

[justinfagnani]

The css template tag already uses constructable Stylesheets where available. You can also pass a CSSStyleSheet object directly to element styles if you construct one on your own.

[nemethmik]

Thank you so much, I've just found the API adoptStyles

[justinfagnani]

You don't need to use that directly you can do:

const stylesheet = new CSSStyleSheet();
stylesheet.replaceSync(`...`);

class MyElement extends LitElement {
  styles = [stylesheet];
}

[nemethmik]

Awesome, thank you so much, I am only on Lit for only about a month, and I am still amazed how brilliantly engineered this toolset is.

[nemethmik]

Am I right when I say that unsafeCSS is roughly equivalent to using CSSStyleSheet and replaceSync?