Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[EuiComboBox] Custom matcher requested #2199

Closed
flash1293 opened this issue Aug 6, 2019 · 9 comments · Fixed by #7709
Closed

[EuiComboBox] Custom matcher requested #2199

flash1293 opened this issue Aug 6, 2019 · 9 comments · Fixed by #7709
Assignees

Comments

@flash1293
Copy link
Contributor

The combo box component matches items strictly by checking whether the typed string appears as a substring in the label of one of the options. In same cases it would be beneficial to overwrite this behavior with a custom matching function if that makes sense for the options shown in the combo box.

Example: Combo box with field names - here it would be nice to match by prefix per dot-separated part of the field name, typing r.b.by should match http.response.body.bytes. Especially for ECS like data with long field names and a lot of fields in a single index this makes selecting the right field much easier.

Another example (even though I don't have a specific use case for that) would be a fuzzy search which allows small typing errors like missing characters or swapped characters.

@thompsongl
Copy link
Contributor

Makes sense to me. I think initially we can just allow for consumers to provide their own matching function. Fuzzy search would be a reasonable thing for EUI to eventually expose in something like the combo box, but rolling your own will likely get you what you want faster.

@anishagg17
Copy link
Contributor

anishagg17 commented Mar 25, 2020

i tried implementing It but got this as an error
Screenshot 2020-03-25 at 4 27 55 PM

even when I used

options.filter(({ label }) => {
      return label.includes('a'); })

as a custom matcher, This might be because functions in JS are not same and hence ComponentDidUpdate gets repeatedly called.

@cchaos cchaos changed the title Custom matcher for combo box [EuiComboBox] Custom matcher requested Sep 20, 2020
@github-actions
Copy link

👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.

@flash1293
Copy link
Contributor Author

Bump - this is still valid.

@github-actions
Copy link

👋 Hey there. This issue hasn't had any activity for 180 days. We'll automatically close it if that trend continues for another week. If you feel this issue is still valid and needs attention please let us know with a comment.

@balthild
Copy link

balthild commented Jan 7, 2022

Currently there's a workaround. According to the source code, the built-in filter is turned off for async comboboxes. So you could just give the filtered options rather than all options to the EuiComboBox component and set async={true}.

@daveyholler
Copy link
Contributor

Due to the age of the issue we're closing this as not-planned. There is a valid workaround provided by @balthild. If additional functionality is required, please feel free to open an PR.

@cee-chen
Copy link
Contributor

cee-chen commented Apr 15, 2024

Re-opening due to recent Kibana need (#7661)

Also note to self when working on this: we should add support to both EuiComboBox and EuiSelectable

@tkajtoch
Copy link
Member

We've added a new optional optionMatcher prop in this PR. It will be available in the next version of EUI, which will be released later this week.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants