W3C home > Mailing lists > Public > public-webapps@w3.org > April to June 2015

Re: [webcomponents] How about let's go with slots?

From: Elliott Sprehn <esprehn@chromium.org>
Date: Tue, 19 May 2015 11:15:05 -0700
Message-ID: <CAO9Q3iJ+9Bk0Bfq6V4fuRefJnduXr5b7jPwmNBJ6pvFpdHB1XQ@mail.gmail.com>
To: Domenic Denicola <d@domenic.me>
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>
On Tue, May 19, 2015 at 10:09 AM, Domenic Denicola <d@domenic.me> wrote:

> 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.
>

<li> is actually just a layout mode, you can make anything a list item by
doing display: list-item. There's no special content model for <ul>.
<details> and <select> are examples of selection based on tag name.

In general these "dumb containers" have proven harmful though because they
insert extra boxes around your content and are not configurable which are
annoying for authors. They're the reason we keep coming back to trying to
figure out how to customize <option> instead of just letting you replace it
with your own widget we tell to layout/paint at a specific size like other
platforms would.

ex. Authors don't like the disclosure triangle that <summary> inserts and
want to change it. They'd much rather do <div slot="summary"> and do
whatever they want instead.

- E
Received on Tuesday, 19 May 2015 18:23:33 UTC

This archive was generated by hypermail 2.3.1 : Friday, 27 October 2017 07:27:31 UTC