rfc: [Breaking] rename `template` host directive to `host`

[KingOfTac]

💬 RFC

This RFC is to gather feedback on potentially renaming the template host directive to host to make it more clear that it represents the host the template is being attached to.

Comments from the community as well as the core team would be much appreciated.

🔦 Context

A point of feedback I have seen after onboarding multiple teams to FAST is that using <template> within a FAST template to signify the host element is a bit confusing. This RFC aims to improve the ergonomics by changing the tag used for the directive to either <host> or just the tag name of the component itself.

As it currently stands, this would probably be a breaking change but I would like to know from the team if this is doable and if there is a way we could make it backwards compatible.

Tagging for visibility @chrisdholt @EisenbergEffect @nicholasrice

💻 Examples

This just seems more intuitive

const template = html`
  <host class="class-on-host-element">
    ...
  </host>
`;

than this

const template = html`
  <template class="class-on-host-element">
    ...
  </template>
`;

[chrisdholt]

Thanks @kingoftac - I don't think this is really tenable as there is a direct link to the actual platform here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template.

I definitely get how there can be confusion given in a styling world, the selector is :host, but in HTML land the actual "host" being referred to is <template></template>. Unfortunately, I think we get into more trouble deviating from the platform than we do better documenting these things. @janechu as FYI.

[KingOfTac]

I don't think this is really tenable as there is a direct link to the actual platform

I figured as much after digging through the template compiler, but wanted to pose the question anyway to see if we could somehow translate the <host> tag from the component template to the native <template> tag.

[scomea]

It seems very breaky and destabilizing for little gain.