Re: [w3c/webcomponents] Theming options for shadow roots (#864)

> need a way to get CSS into any webcomponent without using JS

Yes, that's my point indeed. Another point though is that it makes sense to align with the same restrictions that apply to `::part()` and only override parts that are **publicly exposed**.

I looked into some [Material UI](https://themes.material-ui.com/) and [Vuetify](https://vuetifyjs.com/en/themes/premium) themes for some examples, but I was unable to find any kind of internal convention on what internal parts are exposed for theming.

The Material UI components do declare themes themselves and they do it like this:

```js
  return {
    /* Styles applied to the root element. */
    root: {
      backgroundColor: theme.palette.background.paper,
      color: theme.palette.text.primary,
      transition: theme.transitions.create('box-shadow'),
    },
    /* Styles applied to the root element if `square={false}`. */
    rounded: {
      borderRadius: theme.shape.borderRadius,
    },
    /* Styles applied to the root element if `variant="outlined"` */
    outlined: {
      border: `1px solid ${theme.palette.divider}`,
    }
  };
```

Source: [Material UI - Paper](https://github.com/mui-org/material-ui/blob/9532f266c98ca092926e31ce696607bb53be7440/packages/material-ui/src/Paper/Paper.js#L14-L30)

Regarding web components, we might want to have API for exposing themes like `outlined` and `rounded`, but we also need to let developers to create their own theme variations.

That said, component authors would be still able to use `!important` if they need to force some properties to make sure the component works properly, as described by https://github.com/w3c/webcomponents/issues/864#issuecomment-579658956

Ideally, this convention should teach the web components authors better CSS API design, and eventually make the components consumers fall into the pit of success.

--- 

@dflorey what you are actually requesting is supposed to be covered by `adoptedStyleSheets`.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/864#issuecomment-591406410