<slot>

- [ ] replace all elements that has `slot` or `slot:` attributes into `` or `` when moved into shadow root while the elements still inside the top level host Element (a.k.a [light DOM](https://javascript.info/slots-composition)).
- [ ] make all children in `` inherit all of it's attributes. This mean all children will inherit the slot attribute of `` when moved into light DOM. Note that `` are not moved into shadow DOM while all of it's children stay in the host Element without being wrapped by `…`.

To guarantee and not break the dom isolation, the implementation might involve one or many of this features:
- nested slot
- [manual slot assignment](https://github.com/WICG/webcomponents/blob/gh-pages/proposals/Imperative-Shadow-DOM-Distribution-API.md)
- nested \
- [scoped custom-element](https://github.com/WICG/webcomponents/blob/gh-pages/proposals/Scoped-Custom-Element-Registries.md)

---
`` is a native WebComponent feature. The usual usage is like a portal but I'm thinking it's worth more. For example, it can be used as a way to inject an [island](https://jasonformat.com/islands-architecture/) component from other framework. Another way is for conditional and list rendering. So this is more about documenting on how to use `` in that scenario. There is no need to implement `` from scratch or made custom functionality for certain use cases:
- [ ] #7
- [ ] #65