Feature request: Native filter API for select

[shinebayar-g]

Hi, just trying out the new @inquirer/prompts package. Looks much more easy to use. :clap:

I wish there was a native support for filtering values based on typed characters? I found this package was mentioned on previous issues https://github.com/mokkabonna/inquirer-autocomplete-prompt, but wouldn't it make sense to implement this in @inquirer/select?

const answer = await select({
  message: 'Select a package manager',
  choices: [
    {
      name: 'npm',
      value: 'npm',
      description: 'npm is the most popular package manager',
    },
    {
      name: 'yarn',
      value: 'yarn',
      description: 'yarn is an awesome package manager',
    },
    {
      name: 'jspm',
      value: 'jspm',
      disabled: true,
    },
    {
      name: 'pnpm',
      value: 'pnpm',
      disabled: '(pnpm is not available)',
    },
  ],
});

If user starts typing out some letters, list of choices would be filtered out or highlighted.

Follow up suggestion. If there was an another selection like Other in the list, user could select that option and type out their input.

[SBoudrias]

Hey! I'm not really open to add a Other type API; I think it might complicate the prompt for a not super common use case (an "other" option can be a follow-up input prompt.)

But I think searching by typing would be a nice feature to add. I would try to keep the UX as close to the native <select> component on the web as possible.

[xavdid]

Being able to filter long lists would be great! Right now you can scroll alphabetically, but being able to type to filter (and then select) would be an awesome prompt.

[anran758]

🙏 This requirement is very common; hope to continue following up.

[SBoudrias]

If anyone wants to give #1367 a try, it'd be great to get your feedback!

[bombillazo]

Hey @SBoudrias how can I incorporate that example to my current select ? I am trying to filter out as people type options.

[SBoudrias]

Hey @bombillazo, nothing to do it is a default behavior. As long as you use the new Inquirer (#1214 - the @inquirer/*** packages), and a recent enough version.