[RAC] Table typeahead captures all keyboard input, leaving none for nested Inputs
- Dominant language
- TypeScript
- Stars
- 15.9k
- Forks
- 1.6k
- Avg merge
- 3d 9m
- Merged PRs (30d)
- 59
Description
### Provide a general summary of the issue here
I've got a table like this, where the inputs can't capture a single keystroke, because the table hungrily swallows them all:
```jsx
import { Cell, Column, Input, Row, Table, TableBody, TableHeader } from "react-aria-components";
const items = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("").map((letter) => ({id:letter}));
export default function Home() {
return (
Name
Value
{(row) => (
{row.id}
)}
);
}
```
### 🤔 Expected Behavior?
I'd love for the inputs to Just Work™ in a situation like this.
### 😯 Current Behavior
https://github.com/adobe/react-spectrum/assets/13100/c28fa89b-ba9d-4e3f-a881-ee5a7a367389
### 💁 Possible Solution
1. Is there a good reason for `useTypeSelect` to be using the capture phase? If it used the bubble phase, the inputs themselves could choose if/when to stop propagation.
2. This is a bit more blunt, but why not allow typeahead to be disabled on tables? `useSelectableCollection` already takes a `disallowTypeAhead` prop, but there's not currently a way to drill that all the way down through `` → `useTable` → `useGrid` → `useSelectableCollection`.
### 🔦 Context
#1214 is a 3-year-old ticket that mentions that tables swallow spaces, but somehow fails to mention that tables can also swallow **all keystrokes** as long as the input is matching the value of a row header.
### 🖥️ Steps to Reproduce
https://codesandbox.io/p/sandbox/old-voice-k5n9p4
### Version
"react-aria-components": "^1.1.1"
### What browsers are you seeing the problem on?
Chrome
### If other, please specify.
_No response_
### What operating system are you using?
macOS
### 🧢 Your Company/Team
_No response_
### 🕷 Tracking Issue
_No response_
Contributor guide
Assessment
This issue has not been assessed yet.