<angle-bracket> components

What are the plans on supporting <angle-bracket> components?

The old {{mustache-component}} syntax will not be abandoned before 3.0, as the new syntax won’t land until 2.1. Therefore Emblem can’t just make the new syntax the default one.

We need a way to indicate that the new syntax should be used. Alternatively we could upgrade the major version number and do the opposite by using the new <angle-bracket> syntax by default, while keeping the old {{mustache-component}} syntax accessible through said indicator.

Obviously, this issue doesn’t need to be addressed until Ember 2.0 comes out, but I’m curious for your ideas.

Personally, I’d prefer the latter option and bump the major version number, so the new syntax can be used by default without additional indicators, while still enabling users to use legacy components, as <angle-bracket> components are the way to go.

[machty]

It was probably a mistake to create a white list of known HTML attributes that determines whether foo is interpreted as {{foo}} or <foo>, because it’s a bit confusing and not exactly future proof (Glimmer angle bracket components as a primary example, but also new additions to HTML elements, etc).

Emblem isn’t 1.0 yet so technically the rules for semantic versioning don’t apply, but since it’s been around for a few years, it’s fair to say it’s post 1.0 in spirit, so I’m pretty hesitant to “fix” the white-listing mistake if there’s any other way around it, since it’ll break everyone’s templates.

I haven’t seen anyone mention it in this thread, but as a reminder, you can prefix with % to force interpretation as an HTML element, e.g. %foo produces <foo>. Angle-bracket Glimmer components are being designed such that the way you bind attributes, pass in properties, etc., is the same syntax as what how you’d do such things with a normal HTML component, e.g. in Glimmer you can do <div class={{foo}}> or <my-component items={{things}}>.

Emblem already specifies how to pass in attributes to HTML elements, e.g. %div class="wat" (the % is optional since div is on the whitelist) so maybe going forward the safest thing to do is stick with % as the way to prefix angle-bracket components.

%my-component items=things

produces

<my-component item={{things}}></my-component>

This I believe is working syntax today. We’ll probably need to add things like block syntax for angle bracket components and maybe some other things that come along, but am I missing anything fundamental about % limitations?

Separately, we can decide:

1. Should we remove the white-list and treat ALL un-prefixed identifiers as angle-brackets, and if so, when? (This would break older Emblem templates)
2. Perhaps as a midterm solution we can treat all unprefixed identifiers with dashes (a requirement for Glimmer components is that there is a dash in the name) as angle brackets.

How’s that all sound?

[kjhangiani]

What’s the latest status on this? Are angle bracket components supported in the latest emblem? We’ve finally updated to ember 1.13, and are looking to migrate to glimmer components, but can’t find any updates on the latest syntax.