diff --git a/.changeset/dirty-areas-sin.md b/.changeset/dirty-areas-sin.md new file mode 100644 index 00000000..3d40032f --- /dev/null +++ b/.changeset/dirty-areas-sin.md @@ -0,0 +1,5 @@ +--- +"@clack/prompts": patch +--- + +Change styling of disabled multi-select options to have strikethrough. diff --git a/packages/prompts/src/multi-select.ts b/packages/prompts/src/multi-select.ts index 491b7218..62f30ae3 100644 --- a/packages/prompts/src/multi-select.ts +++ b/packages/prompts/src/multi-select.ts @@ -42,7 +42,7 @@ export const multiselect = (opts: MultiSelectOptions) => { ) => { const label = option.label ?? String(option.value); if (state === 'disabled') { - return `${color.gray(S_CHECKBOX_INACTIVE)} ${computeLabel(label, color.gray)}${ + return `${color.gray(S_CHECKBOX_INACTIVE)} ${computeLabel(label, (str) => color.strikethrough(color.gray(str)))}${ option.hint ? ` ${color.dim(`(${option.hint ?? 'disabled'})`)}` : '' }`; } diff --git a/packages/prompts/test/__snapshots__/multi-select.test.ts.snap b/packages/prompts/test/__snapshots__/multi-select.test.ts.snap index 0a064065..109218e5 100644 --- a/packages/prompts/test/__snapshots__/multi-select.test.ts.snap +++ b/packages/prompts/test/__snapshots__/multi-select.test.ts.snap @@ -245,9 +245,9 @@ exports[`multiselect (isCI = false) > renders disabled options 1`] = ` "", "│ ◆ foo -│ ◻ opt0 +│ ◻ opt0 │ ◻ opt1 -│ ◻ opt2 (Hint 2) +│ ◻ opt2 (Hint 2) └ ", "", @@ -979,9 +979,9 @@ exports[`multiselect (isCI = true) > renders disabled options 1`] = ` "", "│ ◆ foo -│ ◻ opt0 +│ ◻ opt0 │ ◻ opt1 -│ ◻ opt2 (Hint 2) +│ ◻ opt2 (Hint 2) └ ", "",