Allow fuzzy search on searchable Select component

[matheusvellone]

I think a fuzzy-search feature on a searchable Select component would help a lot
Maybe integrating with a already implemented lib (like Fuse.js) or writing onne from scratch.

A prop like fuzzy to enable it would be a very simple API to enable a powerful feature

<Select
  data={options}
  value={selected}
  searchable
  fuzzy // this could be a boolean only or a boolean/number value to specifi the "sensivity" of the algorithm
  fuzzy={3} // or this to calibrate the algorithm
/>

If this sounds to complex or you want to keep it simple on Mantine, receiving a search prop to handle the search would open a door to allow users to implement fuzzy-search (or any other search feature) by their own

[matheusvellone]

Nevermind, just found the filter prop on Select. This solves my current problem, but the idea might still be viable

[matheusvellone]

Just sharing my solution, in case someone needs

<Select
  data={options}
  value={selected}
  searchable
  filter={(value, item) => {
    if (!item.label) {
      return false
    }
          
    return new RegExp(value.split('').join('.*'), 'i').test(item.label)
  }}
/>

This creates an effect similar to most IDEs file finder, where searching for scidx would match src/index.js

[liesislukas]

was looking for fuzzy option, in many places fuzzy would be great addition w/o the custom code as in sample above. Sample above is not real fuzzy. Also "filter" seems to not be available anymore

would like to see

https://www.npmjs.com/package/fast-fuzzy
or
https://www.fusejs.io/

as an option, or at least some easy way to plug it in

[rtivital]

https://help.mantine.dev/q/select-fuzzy