Theming solution for LitElement

[nicolejadeyee]

[chase-moskal]

hello!

i just wanted to share that in my case, i found applying a shared css theme to many shadow-dom lit-element components was no sweat

using a decorator called mixin-css, and a couple helper functions, theme-components and register-components, i can easily share a css theme across many components like this:

registerComponents(themeComponents(theme, components))
 //  ↑              ↑
 //  │              └——— apply the css theme to components
 //  │
 //  └—————————————————— register components via customElements.define

this pattern decouples each component from any particular theme, making themes for components easily swappable at a high level

  :wave: chase

[motss]

IIUC, it basically achieves that using Constructible Stylesheets with fallback when needed.

[sorvell]

Closing in favor of lit/rfcs#10