Skip to content

@inquirer/expand

Compact single select prompt. Every option is assigned a shortcut key, and selecting h will expand all the choices and their descriptions.

Expand prompt closedExpand prompt expanded

Special Thanks

Installation

npmyarn
sh
npm install @inquirer/prompts
sh
yarn add @inquirer/prompts
Or
sh
npm install @inquirer/expand
sh
yarn add @inquirer/expand

Usage

js
import { expand } from '@inquirer/prompts';
// Or
// import expand from '@inquirer/expand';

const answer = await expand({
  message: 'Conflict on file.js',
  default: 'y',
  choices: [
    {
      key: 'y',
      name: 'Overwrite',
      value: 'overwrite',
    },
    {
      key: 'a',
      name: 'Overwrite this one and all next',
      value: 'overwrite_all',
    },
    {
      key: 'd',
      name: 'Show diff',
      value: 'diff',
    },
    {
      key: 'x',
      name: 'Abort',
      value: 'abort',
    },
  ],
});

Options

PropertyTypeRequiredDescription
messagestringyesThe question to ask
choicesChoice[]yesArray of the different allowed choices. The h/help option is always provided by default
defaultstringnoDefault choices to be selected. (value must be one of the choices key)
expandedbooleannoExpand the choices by default
themeSee ThemingnoCustomize look of the prompt.

Separator objects can be used in the choices array to render non-selectable lines in the choice list. By default it'll render a line, but you can provide the text as argument (new Separator('-- Dependencies --')). This option is often used to add labels to groups within long list of options.

Choice object

The Choice object is typed as

ts
type Choice<Value> = {
  value: Value;
  name?: string;
  key: string;
};

Here's each property:

  • value: The value is what will be returned by await expand().
  • name: The string displayed in the choice list. It'll default to the stringify value.
  • key: The input the use must provide to select the choice. Must be a lowercase single alpha-numeric character string.

Theming

You can theme a prompt by passing a theme object option. The theme object only need to includes the keys you wish to modify, we'll fallback on the defaults for the rest.

ts
type Theme = {
  prefix: string | { idle: string; done: string };
  spinner: {
    interval: number;
    frames: string[];
  };
  style: {
    answer: (text: string) => string;
    message: (text: string, status: 'idle' | 'done' | 'loading') => string;
    error: (text: string) => string;
    defaultAnswer: (text: string) => string;
    highlight: (text: string) => string;
  };
};

许可

Copyright (c) 2023 Simon Boudrias (twitter: @vaxilart)
Licensed under the MIT license.

最后更新于: