Re: [WICG/webcomponents] "open-stylable" Shadow Roots (#909)

@boguz

> I wonder if there should be some way for component authors to create "private" and "public" parts of the component (in regard of being affected by the outside styles).

I alluded to this in my [previous comment](https://github.com/WICG/webcomponents/issues/909#issuecomment-1997996413).

"Private" just means how it works today (regardless of whether it's `closed` or `open`).

```html
<template shadowrootmode="open">
  <button class="button">Unaffected by page CSS</button>
</template>
```

"Public" means open-styleable (the original proposal).

```html
<template shadowrootmode="open-styleable">
  <button class="button">Affected by page CSS</button>
</template>
```

You can use mix-and-match these inside a larger open-styleable shadowroot.

```html
<my-component>
  <template shadowrootmode="open-styleable">
    <div>
      <template shadowrootmode="open">Private</template>
    </div>
    <div>
      <template shadowrootmode="open-styleable">Public</template>
    </div>
  </template>
</my-component>
```

(Obviously `open-styleable` doesn't exist, but I'm using it only to convey the idea. It likely shouldn't be another mode, rather another attribute/property. There was a lot of useful discussion around this very early in this thread: [1](https://github.com/WICG/webcomponents/issues/909#issuecomment-786995517), [2](https://github.com/WICG/webcomponents/issues/909#issuecomment-791496926), [3](https://github.com/WICG/webcomponents/issues/909#issuecomment-826030426))

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

Message ID: <WICG/webcomponents/issues/909/1998061265@github.com>