import type { PartialDeep, Prettify } from '@inquirer/type'; import type { Separator, Theme } from '@inquirer/core'; export type SelectOption = { name?: string; value: Value; disabled?: boolean | string; }; /** * @internal */ export type SelectedOption = SelectOption & { focused?: boolean }; export enum SelectStatus { UNLOADED = 'unloaded', FILTERING = 'filtering', LOADED = 'loaded', SUBMITTED = 'submitted', } export type SelectItem = Separator | SelectOption; /** * @internal */ export type InternalSelectItem = | Separator | (SelectOption & { checked?: boolean }); export type SelectTheme = { icon: { checked: string; unchecked: string; cursor: string; inputCursor: string; }; style: { disabledOption: (text: string) => string; renderSelectedOptions: ( selectedOptions: ReadonlyArray>, allOptions: ReadonlyArray>, ) => string; emptyText: (text: string) => string; placeholder: (text: string) => string; }; helpMode: 'always' | 'never' | 'auto'; }; export type SelectValue = Multiple extends true ? Value[] : Value | null; export type SelectFilterItems = ( input?: string, ) => | Promise>> | ReadonlyArray>; /** * Options of useSelect */ export interface UseSelectOptions { /** * The options displayed can be an array or an async function. */ options: ReadonlyArray> | SelectFilterItems; /** * Whether to enable the filter function * * @defaultValue * `true` */ filter?: boolean; /** * Clear the filter input when the option is selected (also causes the option list to change) * * @defaultValue * `false` */ clearInputWhenSelected?: boolean; /** * Only valid when multiple is true, confirmation is required when deleting selectable options * * @defaultValue * `false` */ confirmDelete?: boolean; /** * Enable toggle all options * * @defaultValue * `false` */ canToggleAll?: boolean; /** * The user's input is debounced, and the default debounce delay is 200ms. * * @defaultValue * `200` ms */ inputDelay?: number; /** * display options in a loop * * @defaultValue * `false` */ loop?: boolean; /** * Determine whether two options are equivalent, * * @defaultValue * `(a, b) => (a === b)`; */ equals?: (a: Value, b: Value) => boolean; /** * Default selected options */ defaultValue?: SelectValue; /** * triggered after the user completes the selection (or skips) */ onSubmitted?: (value: SelectValue) => void; /** * Required(true), or skip(false) * * @defaultValue * `false` */ required?: boolean; /** * select multiple options * * @defaultValue * `true` */ multiple?: Multiple; /** * Select the currently focused option when submitting (press enter), if no other options are already selected. * * @defaultValue * `false` */ selectFocusedOnSubmit?: boolean; /** * validate when submitting (press enter). Only when true is returned will the validation pass. * * @defaultValue * `() => true` */ validate?: ( options: ReadonlyArray>, ) => boolean | string | Promise; } export interface SelectBehaviors { submit: boolean; select: boolean; deselect: boolean; setCursor: boolean; filter: boolean; deleteOption: boolean; blur: boolean; } export interface UseSelectReturnValue { selections: SelectOption[]; focusedSelection: number; confirmDelete: boolean; filterInput: string; displayItems: ReadonlyArray>; cursor: number; status: SelectStatus; error: string; loop: boolean; multiple: boolean; enableFilter: boolean; canToggleAll: boolean; required: boolean; behaviors: SelectBehaviors; } /** * @internal */ export interface SelectContext extends UseSelectReturnValue { theme: Prettify>; pageSize: number; instructions: SelectProps['instructions']; emptyText: string; placeholder: string; } export interface SelectProps extends UseSelectOptions { /** * prompt message */ message: string; /** * page size */ pageSize?: number; /** * Pass in false to directly close the instructions. * If you need to display dynamic instructions based on the state of the select, * you can also use the function. */ instructions?: boolean | ((context: SelectContext) => string); /** * The text displayed when the search results are empty * * @defaultValue * `"No results."` */ emptyText?: string; /** * filter input placeholder * * @defaultValue * `"Type to search"` */ placeholder?: string; /** * theming */ theme?: PartialDeep>; }