I built a custom React Native Input Component which shows a dark border at the bottom when focused but when I am using this component then I am not getting props suggestion provided by VS Code Intellisense.
function TextInputComponent(props) { const [controlledValue, setControlledValue] = useState(''); const [focused, setFocused] = useState(false); const { placeholder, onChangeText, autoCapitalize, ref, secureTextEntry, value, defaultValue, controlled, editable, ...rest } = props; return (<TextInput ref={ref} value={controlled ? controlledValue : value} defaultValue={defaultValue} secureTextEntry={secureTextEntry} placeholder={placeholder} placeholderTextColor={globalColors.semiGray} autoCapitalize={autoCapitalize} editable={editable} mode="outlined" onFocus={() => { setFocused(true); }} onBlur={() => { setFocused(false); }} style={[ styles.textInput, focused ? {borderColor: globalColors.blue} : {}, ]} onChangeText={text => { if (controlled) { console.log(text.toLowerCase()); setControlledValue(text.toLowerCase()); onChangeText(text); } else { onChangeText(text); } }} {...rest} /> );}const styles = StyleSheet.create({ textInput: { ...elementStyles.input, },});
Is there any way I can get prop and type definitions without using TypeScript?
/** * * @param {{header: string, subheader: string, imageAlt: string, contentList: Array, orderLink: Object, contentLink: Object}} props */
I have seen @params way of definition but I just want to extend the default TextInput Definition not to write all the type definitions again for my custom component.