adobe / adobe/react-spectrum

Autocomplete: select only the filtered items, or expose the filtered collection in a selection callback

Open
#10,250 4 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the feature here

When an Autocomplete filters a multi-select collection, provide a way to select only the items currently matching the filter, and/or expose the filtered set of keys/nodes in a callback so the consumer can compute that selection itself.

### 🤔 Expected Behavior?

Either (or both):
1. A "select all" that resolves to the keys currently passing the Autocomplete filter (could be an opt-in selectAllBehavior="filtered" on the wrapped collection inside an Autocomplete) or
2. A callback that surfaces the currently filtered collection (its keys or Nodes), so a "select all filtered" can be implemented in user space.

### 😯 Current Behavior

Autocomplete exposes only filter?: (textValue, inputValue, node: Node) => boolean and owns no selection API. SelectionManager.selectAll() calls setSelectedKeys('all'), and since Selection = 'all' | Set, onSelectionChange returns the literal 'all'. 'all' is not filter-aware and does not enumerate keys, so there is no way to select or even read the filtered subset

### 💁 Possible Solution

Add a `selectAllBehavior: 'all' | 'filtered'` (or similar) honored by a collection rendered inside an Autocomplete, so select-all maps to the filtered keys.

Alternate solution: Expose the filtered nodes/keys from Autocomplete (render prop or callback) so the consumer can derive the selection. Today the only workaround is to fully control filtering (see #8084) and the collection externally, duplicating state.

### 🔦 Context

We use Autocomplete over collections that support "select all." When a user searches, we want "select all" to just select visible/filtered matches, but we cannot implement this: select-all yields 'all', and we have no handle on the filtered key set (without doing some hacky stuff like reading collection state in child components, which contains the filtered collection. see https://github.com/adobe/react-spectrum/discussions/9395)

### 💻 Examples

_No response_

### 🧢 Your Company/Team

_No response_

### 🕷 Tracking Issue

_No response_

Contributor guide

Open the contributing guide

Research direction

Start by tracing Autocomplete's filter behavior and SelectionManager.selectAll(), then review the referenced discussion #9395 and issue #8084 for existing context. Done means either select-all resolves to the currently filtered keys or Autocomplete exposes filtered keys or nodes so consumers can implement that selection.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.