inquirer-sortable-list

A custom prompt for Inquirer.js which displays a sortable list

This prompt supports navigation using arrow keys and reordering with Ctrl + Up/Down. Enter submits the changes or Escape to abort and return the original unchanged array.

Inspired by inquirer-sortable-checkbox.

Installation

Install the package using npm or yarn:

1npm install inquirer-sortable-list

or

1yarn add inquirer-sortable-list

Usage

Use the list prompt in your project by importing and configuring it:

1import sortablePrompt from 'inquirer-sortable-list';
2
3const choices = ['Option 1', 'Option 2', 'Option 3', 'Option 4'];
4
5sortablePrompt(
6  {
7    message: 'Reorder the items:',
8    choices,
9  },
10  (result) => {
11    console.log('Final order:', result);
12  }
13);

Or using await:

1import sortablePrompt from 'inquirer-sortable-list';
2
3const choices = ['Option 1', 'Option 2', 'Option 3', 'Option 4'];
4
5const result = await sortablePrompt({
6  message: 'Reorder the items:',
7  choices,
8});
9
10console.log('Final order:', result);

API Reference

The list prompt accepts a configuration object with the following properties:

Parameter	Type	Required	Description
message	string	Yes	The message to display above the list.
choices	string[]	Yes	An array of strings representing the items in the list.
pageSize	number	No	The maximum number of items to display at a time (default: 7).
theme	Partial<Theme>	No	An optional theme object to customize the appearance of the prompt styles.

The theme object allows customizing the appearance of the pointer and highlighted items.

Property	Type	Description
icon.cursor	string	The string used for the cursor/pointer (default: ❯).
style.highlight	(text: string) => string	A function to style the active item (default: bold ).

Example Output

Before Reordering:

? Reorder the items:
  ❯ Option 1
    Option 2
    Option 3
    Option 4
(Use arrow keys to navigate, ctrl+up/down to reorder, enter to confirm, escape to cancel)

After Reordering (Ctrl + Down on "Option 1"):

? Reorder the items:
    Option 2
  ❯ Option 1
    Option 3
    Option 4

License Information

Licensed under the Apache License, Version 2.0:

http://www.apache.org/licenses/LICENSE-2.0