[select] Add loading prop for async option fetching
Open
@DiegoAndai is already working on this.
Since Jun 27, 2025.
scope: select
type: new feature
waiting for 👍
- Dominant language
- JavaScript
- Stars
- 99.1k
- Forks
- 32.5k
- Avg merge
- 2d 17h
- Merged PRs (30d)
- 106
Description
Summary
When fetching options asynchronously for <Select>, there is currently no built-in way to indicate a loading state (e.g., disable the select, show a spinner, or display a loading option). This is especially important for dynamic forms where options are loaded from an API.
Examples
<Select value={value} disabled={isLoading}>
{isLoading ? (
<MenuItem disabled>Loading...</MenuItem>
) : (
options.map(option => <MenuItem key={option} value={option}>{option}</MenuItem>)
)}
</Select>
Motivation
A dedicated loading prop would allow for a more consistent and accessible UX, similar to what exists for <Autocomplete>.
Search keywords: select, async
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Assessment
This issue has not been assessed yet.