He estado tratando de extender componentes como PaperTextInput.Icon o Tab.Navigator pero he estado fallando y me pregunto cómo se supone que debo extenderlos. Lo que estoy tratando de lograr es reemplazar PaperTextInput.Icon con StyledInputIcon que extiende PaperTextInput.Icon. Desafortunadamente, esto no parece funcionar.
const PasswordInput: FunctionComponent<Props> = ({ label, value, error, toggleShowPassword, hideInput = true, ...rest }) => { return ( <TextInput label={label} value={value} mode="outlined" error={error} textContentType="password" secureTextEntry={hideInput} right={ <PaperTextInput.Icon style={styles.icon} color={colors.primary600} name={hideInput ? 'eye' : 'eye-off'} accessibilityLabel={hideInput ? 'Show password' : 'Hide password'} onPress={toggleShowPassword} /> } {...rest} /> ); }; const StyledInputIcon = styled(PaperTextInput.Icon)` margin-top: 15px; margin-right: 5px; `; export default PasswordInput;