callstack / callstack/react-native-paper
TextInput : Text going multiple lines when I unselect it in IOS
- Dominant language
- TypeScript
- Stars
- 14.5k
- Forks
- 2.2k
- Avg merge
- 5d 23h
- Merged PRs (30d)
- 12
Description
### Current behaviour
I am getting an issue in the react native paper Text input component when I add multiline functionality, which means making their value true, then it works fine, but when I make their value false or do not add the multiline key, then when I enter long text and unselect the Textfield the text expand to multiple lines. it only happens in iOS, in Android, it works fine as expected.
### Expected behaviour
if i add multiline functionality then they need to show text in multi-lines but when I make the value of multiline false then not need to take and show text in multi-line
### Code
```
import {SafeAreaView, StyleSheet} from 'react-native';
import React, {useState} from 'react';
import {TextInput} from 'react-native-paper';
const App = () => {
const [surname, setSurName] = useState('');
const [forename, setForeName] = useState('');
return (
setSurName(value)}
outlineColor={'blue'}
activeOutlineColor={'black'}
label={'Surname'}
placeholder="Enter Surname"
placeholderTextColor={'grey'}
mode="outlined"
multiline={true}
/>
setForeName(value)}
outlineColor={'blue'}
activeOutlineColor={'black'}
label={'Forename'}
placeholder="Enter Forename"
placeholderTextColor={'grey'}
mode="outlined"
multiline={false}
/>
);
};
export default App;
const styles = StyleSheet.create({
inputfield: {
marginHorizontal: 20,
marginVertical: 20,
},
});
```
### Preview
### Your Environment
| software | version
| --------------------- | -------
| ios | 17.2
| react-native | 0.74.0
| react-native-paper | ^5.12.5
Contributor guide
Research direction
The entry point is the react-native-paper TextInput shown in the reproduction, with multiline toggled true or false on iOS. Start by reproducing the blur behavior with the supplied example on iOS and compare it with Android. Done means a false or omitted multiline prop remains single-line after entering long text and unselecting the field, with regression coverage for the behavior.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- ios, react-native, typescript
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 45/100