[Upload] File upload button not keyboard accessible

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate. –> There is this related issue, but the discussion ended up shifting away from the file upload button.

Current Behavior 😯

Following the official file upload button example, once one of the upload button is keyboard focused, pressing on enter or the spacebar does not do anything.

Expected Behavior 🤔

Following the official file upload button example, once one of the upload button is keyboard focused, pressing on enter or the spacebar should open the file selection dialog.

Steps to Reproduce 🕹

Steps:

1. Go to https://codesandbox.io/s/hidden-currying-e83y7
2. Click on the browser part of the window.
3. Press tab once or twice (to respectively select the first or the second button).
4. Press enter or spacebar, nothing happens.

Context 🔦

This is an accessibility requirement: https://webaim.org/techniques/keyboard/#testing

Your Environment 🌎

Tech	Version
Material-UI	v4.11.0
React	v16.13.1
Browser	Firefox 79.0 and Chromium 84.0.4147.89 (on Linux)

[tcx]

The problem is not about focusability, but about opening the file selection dialog.

• If you mouse click on the button, you’ll get a file selection dialog.
• There is no way to open the same file selection dialog only with the keyboard.

With a vanilla <input type=file>, opening the file selection dialog can be achieved by focusing on the element and using enter or spacebar.

[eps1lon]

Closing in favor of #22434. A dedicated component would fix existing usages which we can’t really do with demos.