fix(menu): enable numpad arrow and Enter keys

[nikkimk]

Description

Handles keydown event by event.key instead of event.code so that numpad keys will work with menu.

Related issue(s)

• fixes #3751

How has this been tested?

• [ ] Test case 1
  1. Go here
  2. Do this
• [ ] Test case 2
  1. Go here
  2. Do this

Types of changes

• [x] Bug fix (non-breaking change which fixes an issue)
• [ ] New feature (non-breaking change which adds functionality)
• [ ] Breaking change (fix or feature that would cause existing functionality to change)
• [ ] Chore (minor updates related to the tooling or maintenance of the repository, does not impact compiled assets)

Checklist

• [x] I have signed the Adobe Open Source CLA.
• [x] My code follows the code style of this project.
• [ ] If my change required a change to the documentation, I have updated the documentation in this pull request.
• [x] I have read the CONTRIBUTING document.
• [x] I have added tests to cover my changes.
• [ ] All new and existing tests passed.
• [x] I have reviewed at the Accessibility Practices for this feature, see: Aria Practices

[github-actions[bot]]

Branch preview

• Documentation Site
• Storybook

Visual regression test results

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs: - [High Contrast Mode | Medium | LTR](https://beab5189015c2b197065cb537036c2c1--spectrum-web-components.netlify.app/review/) - [Spectrum | Lightest | Medium | LTR](https://21b68bdb206e01697aeb13ebce80d13b--spectrum-web-components.netlify.app/review/) - [Spectrum | Lightest | Medium | RTL](https://821cea11163faffd33e3eb402be2621f--spectrum-web-components.netlify.app/review/) - [Spectrum | Lightest | Large | LTR](https://a1cae770dae4d7f92310a21ddc49051d--spectrum-web-components.netlify.app/review/) - [Spectrum | Lightest | Large | RTL](https://6bad4e0d520849326123a7d88fca6231--spectrum-web-components.netlify.app/review/) - [Spectrum | Light | Medium | LTR](https://d29c5eef6409039f375a8cdf073e1d63--spectrum-web-components.netlify.app/review/) - [Spectrum | Light | Medium | RTL](https://6b4295c2081001da18ac47eec61e0029--spectrum-web-components.netlify.app/review/) - [Spectrum | Light | Large | LTR](https://773484fddf25c52125492f86072851ba--spectrum-web-components.netlify.app/review/) - [Spectrum | Light | Large | RTL](https://8ab404277d995c6e51475eb579a5c3f6--spectrum-web-components.netlify.app/review/) - [Spectrum | Dark | Medium | LTR](https://ea52d6edfa2b58fe9e28696b49c25fd3--spectrum-web-components.netlify.app/review/) - [Spectrum | Dark | Medium | RTL](https://febf4aae3d5d76f8bb159ce01b6daa26--spectrum-web-components.netlify.app/review/) - [Spectrum | Dark | Large | LTR](https://139912225a1d73f31a3013ac40f8c0f5--spectrum-web-components.netlify.app/review/) - [Spectrum | Dark | Large | RTL](https://0a96690825263039a0d2b5a29fb48872--spectrum-web-components.netlify.app/review/) - [Spectrum | Darkest | Medium | LTR](https://13924b31466d7dd8e9f96747ea83f80c--spectrum-web-components.netlify.app/review/) - [Spectrum | Darkest | Medium | RTL](https://f0c706a05f779c6fe40a365372533cc9--spectrum-web-components.netlify.app/review/) - [Spectrum | Darkest | Large | LTR](https://65bbba6e4e939c0e003f3acd2feca52f--spectrum-web-components.netlify.app/review/) - [Spectrum | Darkest | Large | RTL](https://64eea8715dee0274bd8a1a6fcb0b1ad6--spectrum-web-components.netlify.app/review/) - [Express | Lightest | Medium | LTR](https://5c96eba01a4ffa3b23b62e38d5ca812c--spectrum-web-components.netlify.app/review/) - [Express | Lightest | Medium | RTL](https://97d75004a2ee2bdcab58c9b216ff1fa5--spectrum-web-components.netlify.app/review/) - [Express | Lightest | Large | LTR](https://cc643fac7b277218b860f18ae5ec4016--spectrum-web-components.netlify.app/review/) - [Express | Lightest | Large | RTL](https://bd40370559937794e5754c3d39de651b--spectrum-web-components.netlify.app/review/) - [Express | Light | Medium | LTR](https://f0aae897b40110019f9108fc372ae10e--spectrum-web-components.netlify.app/review/) - [Express | Light | Medium | RTL](https://37a58e943a70b00aa4c9823ae4cd20d4--spectrum-web-components.netlify.app/review/) - [Express | Light | Large | LTR](https://6efa7c5fdcec75664ed99286e279e8dd--spectrum-web-components.netlify.app/review/) - [Express | Light | Large | RTL](https://ae772698eed11905f4d32b1d055165cb--spectrum-web-components.netlify.app/review/) - [Express | Dark | Medium | LTR](https://61b4c5f2b338fb1a02b04ae7e73e044f--spectrum-web-components.netlify.app/review/) - [Express | Dark | Medium | RTL](https://7e69430c609b3151c1f734f6640bc605--spectrum-web-components.netlify.app/review/) - [Express | Dark | Large | LTR](https://41b06e70e80d4773562fbb67b6b9747a--spectrum-web-components.netlify.app/review/) - [Express | Dark | Large | RTL](https://29f9d26d9397d4b0c6d2cd0338689110--spectrum-web-components.netlify.app/review/) - [Express | Darkest | Medium | LTR](https://782db20db2c56865e2e2f8e2274eea68--spectrum-web-components.netlify.app/review/) - [Express | Darkest | Medium | RTL](https://e06000026af44d8618cd0efabec6ef46--spectrum-web-components.netlify.app/review/) - [Express | Darkest | Large | LTR](https://118588f3588a5c34a28e20435a73e8f2--spectrum-web-components.netlify.app/review/) - [Express | Darkest | Large | RTL](https://bbd3b949dfcfb7e7f8145e5aa2fc9719--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Light | Medium | LTR](https://9fdc26e755fc673ab32d3eaeeaa80f91--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Light | Medium | RTL](https://418172c5d500f6af14f38c8bb8812328--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Light | Large | LTR](https://22c8bb255ece2b7c59b7c0deeacae6e7--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Light | Large | RTL](https://a56c345ccc9bf4d8704e1ac0ce41c15d--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Dark | Medium | LTR](https://1617e746af96d10987a5f638ef7acb68--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Dark | Medium | RTL](https://4c10bc870225164774f48ac334230d67--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Dark | Large | LTR](https://118c74e08fb4c786daaaedcb3856b7c0--spectrum-web-components.netlify.app/review/) - [Spectrum-two | Dark | Large | RTL](https://774f81808a2575f0022e63a8035964be--spectrum-web-components.netlify.app/review/)

[github-actions[bot]]

Lighthouse scores

Category	Latest (report)	Main (report)	Branch (report)
Performance	0.99	0.95	0.99
Accessibility	1	1	1
Best Practices	1	1	1
SEO	1	0.92	0.92
PWA	1	1	1

What is this?

[Lighthouse](https://github.com/GoogleChrome/lighthouse) scores comparing the documentation site built from the PR ("Branch") to that of the production documentation site ("Latest") and the build currently on main ("Main"). Higher scores are better, but *note that the SEO scores on Netlify URLs are artifically constrained to 0.92.*

Transfer Size

Category	Latest	Main	Branch
Total	221.147 kB	210.075 kB 🏆	210.506 kB
Scripts	53.39 kB	47.963 kB 🏆	48.125 kB
Stylesheet	34.663 kB	30.332 kB 🏆	30.489 kB
Document	5.91 kB	5.185 kB 🏆	5.19 kB
Font	127.184 kB	126.595 kB 🏆	126.702 kB

Request Count

Category	Latest	Main	Branch
Total	45	45	45
Scripts	37	37	37
Stylesheet	5	5	5
Document	1	1	1
Font	2	2	2

[github-actions[bot]]

Tachometer results

Chrome

## action-menu [_permalink_](#user-content-action-menu) ### test-basic | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 647 kB | 131.10ms - 134.17ms | - | faster ✔
5% - 8%
7.27ms - 11.70ms | | branch | 634 kB | 140.52ms - 143.71ms | slower ❌
5% - 9%
7.27ms - 11.70ms | - | ### test-directive [_permalink_](#user-content-action-menu-test-directive) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 604 kB | 60.56ms - 61.60ms | - | faster ✔
5% - 8%
3.53ms - 5.30ms | | branch | 591 kB | 64.78ms - 66.22ms | slower ❌
6% - 9%
3.53ms - 5.30ms | - | ### test-lazy [_permalink_](#user-content-action-menu-test-lazy) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 603 kB | 58.49ms - 59.57ms | - | faster ✔
6% - 9%
3.84ms - 5.86ms | | branch | 590 kB | 63.03ms - 64.73ms | slower ❌
6% - 10%
3.84ms - 5.86ms | - | ### test-open-close-directive [_permalink_](#user-content-action-menu-test-open-close-directive) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 789 kB | 1872.15ms - 1874.83ms | - | unsure 🔍
-0% - +0%
-2.70ms - +1.54ms | | branch | 777 kB | 1872.42ms - 1875.72ms | unsure 🔍
-0% - +0%
-1.54ms - +2.70ms | - | ### test-open-close [_permalink_](#user-content-action-menu-test-open-close) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 788 kB | 1858.45ms - 1861.41ms | - | unsure 🔍
-0% - +0%
-2.62ms - +2.14ms | | branch | 775 kB | 1858.31ms - 1862.04ms | unsure 🔍
-0% - +0%
-2.14ms - +2.62ms | - | ## combobox [_permalink_](#user-content-combobox) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 709 kB | 35.55ms - 36.88ms | - | faster ✔
3% - 7%
1.03ms - 2.51ms | | branch | 697 kB | 37.65ms - 38.32ms | slower ❌
3% - 7%
1.03ms - 2.51ms | - | ### light-dom-test [_permalink_](#user-content-combobox-light-dom-test) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 709 kB | 395.46ms - 401.66ms | - | faster ✔
2% - 4%
8.37ms - 18.30ms | | branch | 697 kB | 408.02ms - 415.77ms | slower ❌
2% - 5%
8.37ms - 18.30ms | - | ## menu [_permalink_](#user-content-menu) ### test-basic | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 475 kB | 212.24ms - 215.47ms | - | faster ✔
2% - 4%
4.52ms - 9.27ms | | branch | 463 kB | 219.01ms - 222.48ms | slower ❌
2% - 4%
4.52ms - 9.27ms | - | ## picker [_permalink_](#user-content-picker) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 513 kB | 530.69ms - 544.24ms | - | faster ✔
1% - 5%
6.18ms - 25.44ms | | branch | 500 kB | 546.43ms - 560.12ms | slower ❌
1% - 5%
6.18ms - 25.44ms | - | ## split-button [_permalink_](#user-content-split-button) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 723 kB | 1857.94ms - 1861.75ms | - | unsure 🔍
-0% - +0%
-2.29ms - +3.05ms | | branch | 710 kB | 1857.59ms - 1861.34ms | unsure 🔍
-0% - +0%
-3.05ms - +2.29ms | - |

Firefox

## action-menu [_permalink_](#user-content-action-menu) ### test-basic | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 647 kB | 273.91ms - 280.05ms | - | faster ✔
11% - 14%
34.68ms - 42.92ms | | branch | 634 kB | 313.02ms - 318.54ms | slower ❌
12% - 16%
34.68ms - 42.92ms | - | ### test-directive [_permalink_](#user-content-action-menu-test-directive) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 604 kB | 127.86ms - 129.74ms | - | faster ✔
1% - 3%
1.60ms - 3.84ms | | branch | 591 kB | 130.93ms - 132.11ms | slower ❌
1% - 3%
1.60ms - 3.84ms | - | ### test-lazy [_permalink_](#user-content-action-menu-test-lazy) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 603 kB | 154.82ms - 160.34ms | - | slower ❌
10% - 15%
13.58ms - 20.70ms | | branch | 590 kB | 138.19ms - 142.69ms | faster ✔
9% - 13%
13.58ms - 20.70ms | - | ### test-open-close-directive [_permalink_](#user-content-action-menu-test-open-close-directive) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 789 kB | 1914.42ms - 1923.10ms | - | slower ❌
1% - 2%
26.79ms - 36.21ms | | branch | 777 kB | 1885.43ms - 1889.09ms | faster ✔
1% - 2%
26.79ms - 36.21ms | - | ### test-open-close [_permalink_](#user-content-action-menu-test-open-close) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 788 kB | 1882.21ms - 1886.87ms | - | unsure 🔍
-0% - +0%
-2.41ms - +4.33ms | | branch | 775 kB | 1881.15ms - 1886.01ms | unsure 🔍
-0% - +0%
-4.33ms - +2.41ms | - | ## combobox [_permalink_](#user-content-combobox) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 709 kB | 61.72ms - 65.80ms | - | unsure 🔍
-1% - +6%
-0.82ms - +3.78ms | | branch | 697 kB | 61.22ms - 63.34ms | unsure 🔍
-6% - +1%
-3.78ms - +0.82ms | - | ### light-dom-test [_permalink_](#user-content-combobox-light-dom-test) | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 709 kB | 726.48ms - 737.84ms | - | slower ❌
0% - 4%
1.52ms - 27.76ms | | branch | 697 kB | 705.69ms - 729.35ms | faster ✔
0% - 4%
1.52ms - 27.76ms | - | ## menu [_permalink_](#user-content-menu) ### test-basic | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 475 kB | 425.21ms - 438.59ms | - | faster ✔
1% - 6%
5.20ms - 25.92ms | | branch | 463 kB | 439.55ms - 455.37ms | slower ❌
1% - 6%
5.20ms - 25.92ms | - | ## picker [_permalink_](#user-content-picker) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 513 kB | 1004.49ms - 1034.19ms | - | faster ✔
3% - 6%
34.81ms - 66.43ms | | branch | 500 kB | 1064.55ms - 1075.37ms | slower ❌
3% - 7%
34.81ms - 66.43ms | - | ## split-button [_permalink_](#user-content-split-button) ### basic-test | Version | Bytes | Avg Time | vs remote | vs branch | |---|---|---|---|---| | npm latest | 723 kB | 1874.75ms - 1879.61ms | - | unsure 🔍
-0% - +0%
-3.15ms - +4.39ms | | branch | 710 kB | 1873.68ms - 1879.44ms | unsure 🔍
-0% - +0%
-4.39ms - +3.15ms | - |