Add new option for custom match callback

Now, the way to specify which options should be shown is to pass the labelKey prop.

It would be nice if there was an option for passing a callback function that, having received an option, would tell whether it should match the query or not.

Here’s my motivation for requesting this feature: suppose I have a list of objects:

[
  ...,
  { username: 'Bob', email: '[e-mail]' },
  ...,
]

and I’d like the matching to occur whenever either username or email matches the query.

Currently, I have to specify another field, say key: username + email, and match agains this field.

But now the same key is being shown for selected items! That’s ugly, I don’t want that, I just want to show the username, but then the matching won’t work properly.

Another way to solve my particular use-case would be to provide an option for custom rendering (or at least allowing to choose the rendered text) for selected items.

[ericgio]

@carlodicelico: I agree that what you’re suggesting is a bit more convenient for some narrow set of use cases. However, given that what you ultimately want — to use your own matching algorithm — is currently possible, I’m not sure it’s worth the effort. A lot of the code in defaultFilterBy is just checking the data format to understand how it should apply the comparison. It doesn’t seem to me like you need that anyway, since I would assume you already know how your data is structured.

[ericgio]

As of v0.9.0, you can use the filterBy prop to customize how the results are filtered.