[Request] header component or multiselect with multiple groups

[benmccann]

Is your feature request related to a problem? Please describe. I would like to group items for some organization, but I don't want to make it feel like we're sending the user through tons of different prompts.

Describe the solution you'd like Something like what's pictured below. This example is split into two prompts which each display multiple groups.

┌  Welcome to Svelte Add
│
◇  Which libraries would you like to setup?
│ Testing
│  ◻ Playwright
│  ◻ vitest
│
│ Code quality
│  ◻ prettier
│  ◻ eslint
│
│ CSS
│  ◻ Open Props
│  ◻ UnoCSS
│  ◻ TailwindCSS
│  ◻ Ant Design
│  ◻ Bootstrap
│  ◻ Bulma
│
◇  Which application functionality would you like to setup?
│ Database
│  ◻ Drizzle
│
│ Auth
│  ◻ Lucia
│  ◻ Auth.js
│
│ Markdown
│  ◻ mdsvex
│
│ Other tools
│  ◻ Storybook
└

Describe alternatives you've considered Today, as far as I'm aware, we'd need to split each of these groups into a separate prompt. It would make the user go through seven prompts in the example above, which just feels too long.

Additional context I'd like to use this for svelte-add, which can be run with npx svelte-add and is available at https://github.com/svelte-add/svelte-add

[benmccann]

We used this for an early version of the Svelte CLI, but ended up going back to the standard prompts. A lot of the reason was unrelated to the design of the prompt, which is that we had too many groups with just a single item. There was also a bit of debate over whether the UI was taking up too much vertical space though. Here's where we landed: