react-native-merlin
react-native-merlin copied to clipboard
hparton
Add disabled to Input
It would be nice to have support for disabled on Form.Input to be more in line with HTML forms.
Hi!
This should currently be possible since Merlin will just pass through any props that it's not using down to the input element. In React Native it would be editable instead of disabled to stop people from interacting with the input. Unless you mean disabling it in some other way?
You can take a look at the docs for the default input that Merlin uses: https://reactnative.dev/docs/textinput#editable
And an example of how that would work (I've specified the as but it defaults to TextInput):
<Form>
...
<Form.Input as={TextInput} editable={false} />
</Form>
Ah yeah I see. Thanks. Half way there. However, this confuses the automatic keyboard next/done-button handling. I'm trying to understand how to customise the keyboard behaviour.
Ah that will be an issue with that I guess. I should have some time to take a look at that in the next few days and I'll let you know when a fix is out.
Yeah no hurry :) Already great to get such a quick response here. Thanks a ton. I'm currently trying to adjust returnKeyType myself but doesn't seem to work since merlinProps override other props.
Will have a look at the behavior when setting a default input as disabled and how that's handled with the keyboard input but also need to take a look at exposing a way to define custom behavior for it. I could see it being useful on custom components that you might want to skip over or pass the focus inside of.
Absolutely. Custom Inputs could benefit from this but regular forms as well. I for example have a form I do not want to submit right after filling all the fields. The keyboard button on the final field should only hide the keyboard.
@MSchmidt I put in a PR for being able to manually override the returnKeyType https://github.com/hparton/react-native-merlin/pull/22
