diff --git a/.changeset/quiet-options-render.md b/.changeset/quiet-options-render.md new file mode 100644 index 00000000..a2d7b345 --- /dev/null +++ b/.changeset/quiet-options-render.md @@ -0,0 +1,5 @@ +--- +'@clack/prompts': patch +--- + +Render falsy primitive options through the `limitOptions` style callback instead of leaving blank rows. diff --git a/packages/prompts/src/limit-options.ts b/packages/prompts/src/limit-options.ts index 72507d34..40de15af 100644 --- a/packages/prompts/src/limit-options.ts +++ b/packages/prompts/src/limit-options.ts @@ -149,7 +149,7 @@ export const limitOptions = ({ for (let i = slidingWindowLocationWithEllipsis; i < slidingWindowLocationEndWithEllipsis; i++) { const option = options[i]; - const styledOption = option ? style(option, i === cursor) : ''; + const styledOption = option !== undefined ? style(option, i === cursor) : ''; const wrappedLines = wrapAnsi(styledOption, maxWidth, { hard: true, trim: false, diff --git a/packages/prompts/test/limit-options.test.ts b/packages/prompts/test/limit-options.test.ts index 2cfc350b..cc6d78ef 100644 --- a/packages/prompts/test/limit-options.test.ts +++ b/packages/prompts/test/limit-options.test.ts @@ -93,6 +93,16 @@ describe('limitOptions', () => { expect(result).toEqual([]); }); + test('styles falsy primitive options and identifies the active option', () => { + const result = limitOptions({ + output, + options: [0, false, '', 1], + cursor: 1, + style: (option, active) => `${active ? '> ' : ''}[${String(option)}]`, + }); + expect(result).toEqual(['[0]', '> [false]', '[]', '[1]']); + }); + test('if items exceed output height, clamp to fit', async () => { options.options = [ { value: 'Item 1' },