Downshift: Implement react-autosuggest API

[kentcdodds]

Anyone wanna take on this task? By doing this it would really help us know whether react-autocompletely is powerful enough to support these use cases and if there's anything we can do to improve the API.

[kentcdodds]

To be clear, this would probably be best as a Codesandbox.io example (could be open sourced later if that's desired, but doesn't need to be).

[bernard-lin]

Are you looking for something similar to the react-instantsearch example?

[bernard-lin]

^bump 🙃

[kentcdodds]

Oh, sorry about that! 😅

Yeah, something like that would be fine :+1:

[kentcdodds]

You really have the liberty to do whatever you'd like honestly :)

[kentcdodds]

What I'm really looking for is some feedback on the API. How straightforward is it? Does it support your use cases? That kind of stuff.

[bernard-lin]

Sounds good! 👍

[kentcdodds]

FYI, pushed a pretty significant API change. Probably the last one. It's really great :smile:

[bernard-lin]

I saw! Thanks for the update 😄

[bernard-lin]

I've been weighed down by work so if anyone wants to take a shot at this in the meantime, please go for it!

[souporserious]

@kentcdodds any idea how to achieve the functionality where the input is filled in with the suggested value like in react-autosuggest? I'm guessing you need to hold on to two values. The suggested one as well the current inputValue 🤔

It's an interesting interaction where keyboard highlighting is the only way to get a suggestion, whereas hovering highlighting does not pre fill the input.

[kentcdodds]

I think that we'd just need to control the inputValue ourselves right?

[souporserious]

I _think_ so. I haven't tried yet, mainly because I'm a little unsure how to handle it. It seems like we would need to know if highlights are coming from a mouse or keyboard.

[kentcdodds]

It seems like we would need to know if highlights are coming from a mouse or keyboard.

Yeah, it does seem that way. Maybe we'll need to add to the stateChangeTypes after all. I didn't want to do that, but I think that'd be the best way to support this...

I'm in the middle of a big internal refactor/cleanup of things. Once that's done then we can work on this.

I'm planning on releasing downshift this week. Hopefully before React Rally (so I have something to talk about with folks there!)

[kentcdodds]

Soooo... this is what I was thinking for the cleanup and now I'm thinking I'm going to punt on that.

I was thinking that we'd allow people to extend/use ref if they need ultimate flexibility, but I don't think I want to do that at this stage. Maybe later. Technically we should be able to make this change later without breaking anyone after 1.0.0 if we need to so we can deal with it later.

So right now I'm going to work on adding more stateChangeTypes to allow for the API you're looking for :smile:

[kentcdodds]

Here it is: https://github.com/paypal/downshift/pull/147

[kentcdodds]

Ok, rc.17 has been published and supports more stateChangeTypes. I'm still not totally jazzed about the API, but I think it's the best way to do what we're trying to accomplish here. Also, these changes mean that onStateChange can be called when no state actually changes. We actually take advantage of this in the new example...

I added an internal example that simulates the react-autosuggest user interaction. You can see the code here and the rendered version here.

I think if we could take that as an example and build the full react-autosuggest API on top of downshift that'd be super cool.

[kentcdodds]

I'm going to go ahead and close this. Someone can feel free to implement it if they like though...