callstack / callstack/react-native-paper
Add handler for keyboard interactions to TextInput
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
**Is your feature request related to a problem? Please describe.**
I use your library for mobile and web development (expo with react-native and react-native-web) and in the web app I find even myself hitting enter key to save some text in TextInput component. In react-native-web the TextInput component provides a "onKeyPressed" prop and in react-native there is something similar with "onSubmitEditing" prop.
**Describe the solution you'd like**
I'd like to have an "onKeyPressed" prop on platform web and if usefull an "onSubmitEditing" prop in mobile TextInput component.
```jsx
setValue(newValue)}
label={'some label')}
placeholder={'some placeholder'}
dense={true}
error={getError()}
onKeyPress={(event) => {
if(event.key === 'Enter' && !getError()) {
handleSave();
}
}}
/>
```
**Describe alternatives you've considered**
There is a way to implement the functionality with the "render" prop:
```jsx
import {
Platform,
TextInput as NativeTextInput
} from 'react-native';
setValue(newValue)}
label={'some label')}
placeholder={'some placeholder'}
dense={true}
error={getError()}
render={(props) => {
if(event.key === 'Enter' && isURL(textValue, validatorOptions)) {
handleSave();
}
}
: undefined
}
/>}
/>
```
but the way with direct props is cleaner and more intuitive in my opinion...
**Additional context**
My examples are only with onKeyPress for the "web" version, for the "mobile" it works similar...
I would submit a pull request on this, but I never used typescript while developing, so I hope someone else find this idea useful and develops a solution...
snack as requested by @github-actions: https://snack.expo.dev/3l-fYP0gh
not sure why the versions matter submitting a feature request, but here they are:
* `react-native`: 0.64.3
* `react-native-paper`: 4.11.1
* `react-native-vector-icons`: not sure what is included in "@expo/vector-icons" 12.0.0
Contributor guide
Assessment
This issue has not been assessed yet.