clack
clack copied to clipboard
feat: Inactive group headers for `GroupMultiSelectPrompt`
Closes #197
By default, group headers are selectable, allowing you to quickly select all of the options within that group. Setting the new option, selectableGroups, to false will disable them, making the group headers inactive.
the following code snippet:
import { groupMultiselect } from "@clack/prompts";
await groupMultiselect({
message: "Which libraries would you like to setup?",
selectableGroups: false,
cursorAt: "Bootstrap",
options: {
CSS: [
{ label: "Bootstrap", value: "Bootstrap" },
{ label: "TailwindCSS", value: "TailwindCSS" },
{ label: "UnoCSS", value: "UnoCSS" },
{ label: "Bulma", value: "Bulma" },
],
Testing: [
{ label: "Playwright", value: "Playwright" },
{ label: "Vitest", value: "Vitest" },
],
Database: [
{ label: "Drizzle", value: "Drizzle" },
{ label: "Prisma", value: "Prisma" },
],
Auth: [
{ label: "Lucia", value: "Lucia" },
{ label: "Auth.js", value: "Auth.js" },
],
},
});
will now produce this prompt:

Vertical spacing can also be adjusted with a spacedGroups option as well:

Hey @AdrianGonz97, great work!
I just wanted to point out that the first group shouldn't have an empty line before it. In my opinion, this option should only add empty lines between the groups, not before or after. It looks a bit odd compared to the other prompts.
Personally I think it would look weird to put a space before all items except the first one.
We ended up not using this (https://github.com/bombshell-dev/clack/issues/197#issuecomment-2489764465), but feel free to merge it still if you think folks would find it useful. We do have some other changes though that we had to fork the library for and could merge those back if this library picks up again.
Hey @benmccann, thanks for the update! I am picking up steam again here and would love to get changes merged back upstream! 🧡
I agree that the changes in this PR are great to have in general tho! Will likely merge for those who want it.