## Summary
There are currently multiple issues with components that have menus when those menus contain many items. One of the ways we can improve UX is to show an initial set of items first, then load more only if the user takes an action indicating that they want to see more results.
### Use case
An important use case for this behavior is TypeaheadSearch on wikidata.org. When users search wikidata.org, they often need to scroll through a bunch of items before they find what they're looking for, so displaying the current default of 10 items is not sufficient. Adding some form of "load more" behavior would allow users to find what they need without loading too many items at once.
## Design
| [[ https://www.figma.com/file/KoDuJMadWBXtsOtzGS4134/%E2%9D%96-Codex-components?node-id=4918%3A48934 | This Figma file]] contains the specifications for the Menu component. |
## Implementation
### Enable "infinite" scroll
We will need to:
- Enable batch fetching of results by emitting an event when an Intersection Observer placed at the end of the menu is hit, then loading the new menu items (without deleting the old ones or causing any layout shift)
- Ensure keyboard navigation still works, and that an interactive footer (e.g. the search footer in TypeaheadSearch) can still be reached easily
- Figure out what to do, if anything, when there are no more results to show (show a message? just stop fetching results and assume the user will know what that means?)
### Demonstrate the behavior
- Add a demo to the Menu demo page displaying and explaining this behavior
### TypeaheadSearch
Note that enabling this behavior in TypeaheadSearch will be handled separately in T306933.
---
- [] Components with a menu are able to receiving an event when the end of the list of menu items has been reached, fetch more items, and provide those items to the Menu component
- [] New items are displayed in a seamless fashion, and old items persist
- [] Keyboard navigation works as expected
- [] This behavior is demoed on the Menu demo page