adopted-ember-addons/ember-keyboard

How are we going to use this with glimmer components?

NullVoxPopuli opened this issue · 4 comments

With @ember/component, we can use native classes using this technique: https://github.com/NullVoxPopuli/emberclear/blob/6782c452cb7643ce6f13a5d5eecab4536fc1f339/packages/frontend/src/ui/components/keyboard-press/component.ts#L4

but what about @glimmer/component? glimmer components don't extend from @ember/object and therefore don't have .extend/mixin functionality.

So, that may mean that we need to come up with some decorators to use with non-mixinable classes, or element modifiers.

locks commented

They also do not have this.on available.

I'd personally probably also prefer decorators. But thanks to @rwjblue I am trying to shift my mental model more towards template helpers and modifiers, since not the backing JS class is the driver of the program, but the template is.

I would use a modifier when it is important, that the element has focus / the focus is contained inside the element, when the keyboard event is dispatched.

For "global" keyboard listeners, I would use a template helper. This is also why I wrote ember-on-helper.

AFAICT we can add said template helpers and modifiers without requiring a breaking API change.

(The same would be true for decorators as well.)

FYI added some ways to use this from templates here: #111

#111 has been merged and will be released in v6.0.0