web-ridge / react-native-paper-autocomplete

The autocomplete package you wished for on all platforms (iOS, Android, web)
MIT License
19 stars 6 forks source link

List of a few bugs #9

Closed jonnyasmar closed 2 years ago

jonnyasmar commented 3 years ago

Hey! Awesome work getting this off the ground. I've been looking for something like this for a few weeks now and it's super exciting to see this repo pop up!

Just wanted to enumerate a few bugs I've noticed in very early testing. I will try to contribute to this project if I have time, but unfortunately, this area of my project is not high priority yet, so it may be some time before I can.

These were all discovered on a physical iOS device using managed Expo:

  1. The list doesn't seem to open up adjacent to the input field, but rather in the top left corner of my page. Perhaps this has to do with nesting inside react-navigation screens? I'll test further soon and see if I can isolate the cause.
  2. When using an "outlined" input type, the content of the input is flush with the left of the input field.
  3. When using the "dense" prop, the caret isn't centered in the input field (it's a bit high).
  4. When the list is open, an initial tap on the list is required, which closes the keyboard first, before any interactions can take place.

My current implementation is pretty plain:

<Autocomplete
  onChange={() => null}
  value={null}
  options={[
    { value: 1, label: 'test' },
    { value: 2, label: 'Pjotr Versjuurre' },
    { value: 3, label: 'Bjart von Klef' },
    { value: 4, label: 'Riesjard Lindhoe' },
  ]}
  inputProps={{
    placeholder: 'Select user',
    mode: 'outlined',
    dense: true,
  }}
/>

Sorry this isn't the most well-formatted bug report. It's very late here and I need to sleep; just wanted to share my findings before I turned in.

Best of luck with this project!

RichardLindhout commented 3 years ago

Thanks for the feedback! Contributions are always welcome :-)

I'll first try to create more examples with every possible input etc + the densed input too.

We only use it in a react-native-web app right now but I'll soon be using it in a native app and will resolve most of the bugs you're seeing.

I think we should also provide something like a modal option on smaller screens as an autocomplete is small there

RichardLindhout commented 2 years ago

@jonnyasmar Most bugs should be resolved, we still need to support dense mode in outlined mode since the height is not correct