Differences

This shows you the differences between two versions of the page.

--- dev:eg-combobox [2025/04/02 14:41] – created sleary
+++ dev:eg-combobox [2025/04/02 15:59] (current) – syntax highlighting sleary
@@ Line 6: / Line 6: @@
   - events
     * keyboard
+  - eg-org-select is not a complete clone of eg-combobox
   - [[https://bugs.launchpad.net/evergreen/+bugs?field.tag=eg-combobox|open combobox bugs]]
+===== Keyboard Events =====
+added to eg-combobox and eg-org-select as part of the Item Alerts, Notes, Tags, and Templates Rework (bug 2074112). There are new event emitters to allow keyboard shortcuts in general, and there is a specific one for the Enter key where the selected value is emitted.
+Examples:
+Support for keyboard events was added to eg-combobox and eg-org-select as part of the Item Alerts, Notes, Tags, and Templates Rework (bug 2074112), building on the keyboard shortcuts previously added in the MARC rich editor to open the suggestion list.
+There are new event emitters to allow keyboard shortcuts in general, and there is a specific one for the Enter key where the selected value is emitted.
+<code html>
+   <eg-combobox
+   (comboboxEnter)="saveSelectedValueSomewhere($event)"
+   (comboboxKeydown)="$event.key === 'Escape' ? cancel() : handleKeydown($event)" />
+   <eg-combobox>
+   <eg-org-select
+   (orgSelectEnter)="saveSelectedOrgSomewhere($event)"
+   (orgSelectKey)="$event.key === 'Escape' ? cancel() : handleKeydown($event)" />
+   </eg-org-select>
+</code>
+The Enter key event's payload is the selected option ID. The generic keyboard handler is a [[https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent|keyboard event]].
+===== Frustration Memes =====
+When combobox is driving you crazy:
+{{:dev:combobox2.jpg?direct|}} {{:dev:combobox.jpg?direct|}} {{:dev:no_good_very_bad_combobox.jpg?direct|}} {{:dev:always_been_combobox.jpg?direct|}}