I have a Lit web component that includes a button with an onClick event. This is what it looks like in simplified form:
<button @click=${props.onClick}>
<!-- button content -->
</button>
The onClick function triggers on mouse click and even when the spacebar is pressed (when the button is focused using the keyboard).
However, I also want this behavior to occur when the enter/return key is pressed on the keyboard while the button is in focus. I haven't been able to figure out how to link keyboard events to the template. In Angular, I could simply do things like:
(keydown.enter)="myLogic()"To provide more context, the Lit web component contains other elements besides just the button.
Does anyone have any information on connecting keyboard events to the templates of a Lit web component?