FR: list item previews

[dotcarmen]

somewhat related to #77

I'd like to show previews of items when using select. for example:

import { select } from '@inquirer/prompts';

const items: { [name: string]: string } = {
  foo: `This is a foo item.`
  bar: `This is
a
multiline
bar item.
`,
}

const selection = await select({
  message: `Please select an item`,
  choices: Object.keys(items),
  getPreview(item) {
    assert(item in items);
    return items[item];
  },
});

Might render as:

? Please select an item
  foo                       | This is 
❯ bar                       | a
                            | multiline
                            | bar item.

I'm not sure how the spacing would work out, but i'm sure theming can be used to influence how the preview is shown

[SBoudrias]

Would using description on the choice object work for this case?

A side-by-side view I think adds a lot of complexity and UX questions.

[dotcarmen]

Would using description on the choice object work for this case?

Unfortunately not. My script is for interacting with directories, and i'd like to show a preview of the directories before selecting them

[dotcarmen]

i'd also like to add that i'm interested in the same preview functionality for search, and checkbox is another candidate for this functionality :)

[SBoudrias]

I'm not sure that's a great match for the default prompts VS making a custom prompt you could release and maintain on npm.

The use case and the UI appears quite specific to be great cases for the default libs.