Improve screen reader and keyboard navigation experience for sound effect editor

[microbit-robert]

This PR makes various keyboard navigation and screen reader improves to the sound effect field editor.

Editor tab:

• Use the "p" key only to preview the sound effect when in the editor. Add a longer aria-label to explain this.
• Radio group label added for waveforms
• The duration input is given a combobox role and the down arrow opens the options and focuses the first option
• The value and type for the effect and interpolation dropdowns is now output for screen reader
  • e.g., from "Tremolo, list box pop-up collapsed" to "Tremolo, Effect, list box pop-up collapsed"
• Pressing Escape in the effect and interpolation lists closes them without closing the entire field editor
• Improved frequency and volume slider labels

Gallery tab:

• Change the gallery markup so it is a grid. This ensures that the preview buttons are discoverable by screen reader users.
  • The gallery wrapper now takes focus which uses aria-activedescendant to manage it's children. Previously, the children took focus directly.
• Remove "Stop Sound Preview" text. This gets in the way of the user hearing the sound preview and the sounds are so short, there isn't really a need to stop them.
• Focus the editor / gallery toggle after selecting a sound effect from the gallery - this matches the melody field editor

[riknoll]

Minor nitpicks! LGTM otherwise!

[riknoll]

don't like cramming multi-line handlers inline like this, let's pull it up into a variable. same for keydown below

[microbit-robert]

Refactor keydown handler e4db05d

Refactor focus handler e80c703

[microbit-robert]

@riknoll review feedback should now be addressed. I also added a bug fix and a text change that was intended but somehow didn't make it the first time around.