- From: Domenic Denicola <d@domenic.me>
- Date: Tue, 19 May 2015 17:09:12 +0000
- To: Elliott Sprehn <esprehn@chromium.org>
- CC: Justin Fagnani <justinfagnani@google.com>, "philip@philipwalton.com" <philip@philipwalton.com>, "dfreedm@google.com" <dfreedm@google.com>, "dglazkov@google.com" <dglazkov@google.com>, "sjmiles@google.com" <sjmiles@google.com>, "rniwa@apple.com" <rniwa@apple.com>, "eoconnor@apple.com" <eoconnor@apple.com>, "annevk@annevk.nl" <annevk@annevk.nl>, "travis.leithead@microsoft.com" <travis.leithead@microsoft.com>, "mjs@apple.com" <mjs@apple.com>, "arronei@microsoft.com" <arronei@microsoft.com>, "slightlyoff@google.com" <slightlyoff@google.com>, "public-webapps@w3.org" <public-webapps@w3.org>
From: Elliott Sprehn [mailto:esprehn@chromium.org]
> Given the widget <ui-collapsible> that expects a ui-collapsible-header in the content model, with slots I can write:
>
> <ui-collapsible>
> <my-header-v1 slot="ui-collapsible-header"> ... </...>
> </ui-collapsible>
>
> <ui-collapsible>
> <my-header-v2 slot="ui-collapsible-header"> ... </...>
> </ui-collapsible>
>
> within the same application. It also means the library can ship with an implementation of the header widget, but you can replace it with your own. This is identical to the common usage today in polymer apps where you annotate your own element with classes. There's no restriction on the type of the input.
I see. Thanks for explaining.
I think this model you cite Polymer using is different from what HTML normally does, which is why it was confusing to me. In HTML the "insertion point tags" (e.g. <summary> or <li> or <option>) act as dumb containers. This was reinforced by the examples in the proposal, which use <div content-slot=""> with the div being a clear dumb container. You cannot replace them with your own choice of container and have things still work.
As such, I think it would make more sense to write
<ui-collapsible>
<ui-collapsible-header>
<my-header-v1></my-header-v1>
</ui-collapsible-header>
</ui-collapsible>
<ui-collapsible>
<ui-collapsible-header>
<my-header-v2></my-header-v2>
</ui-collapsible-header>
</ui-collapsible>
if we were trying to match HTML. This would be easier to refactor later, e.g. to
<ui-collapsible>
<ui-collapsible-header>
<my-icon></my-icon>
Header for Foo
<a href="https://example.com/help-for-foo">(?)</a>
</ui-collapsible-header>
</ui-collapsible>
However, I understand how this departs from the Polymer/select="" model now. Polymer/select="" allows anything to stand in and be distributed to the appropriate destination location, whereas HTML only allows certain tag names. I am not sure which the original proposal from Jan, Ryosuke, and Ted *intended*, although I agree that as presented it leans toward Polymer/select="".
Received on Tuesday, 19 May 2015 17:09:42 UTC