# ink-select-input

**Repository Path**: mirrors_kevva/ink-select-input

## Basic Information

- **Project Name**: ink-select-input
- **Description**: Select input component for Ink
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-09-25
- **Last Updated**: 2026-05-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# ink-select-input [![Build Status](https://travis-ci.org/vadimdemedes/ink-select-input.svg?branch=master)](https://travis-ci.org/vadimdemedes/ink-select-input)

> Select input component for [Ink](https://github.com/vadimdemedes/ink)


## Install

```
$ npm install ink-select-input
```


## Usage

```jsx
const {h, render, Component} = require('ink');
const SelectInput = require('ink-select-input');

const Demo = () => {
	const handleSelect = item => {
		// `item` = { label: 'First', value: 'first' }
	};

	const items = [{
		label: 'First',
		value: 'first'
	}, {
		label: 'Second',
		value: 'second'
	}, {
		label: 'Third',
		value: 'third'
	}];

	return <SelectInput items={items} onSelect={handleSelect}/>
};

render(<Demo/>);
```

<img src="media/demo.gif" width="508">


## Props

### items

Type: `array`<br>
Default: `[]`

Items to display in a list. Each item must be an object and have `label` and `value` props.

### focus

Type: `boolean`<br>
Default: `true`

Listen to user's input. Useful in case there are multiple input components at the same time and input must be "routed" to a specific component.

### onSelect

Type: `function`

Function to call when user selects an item. Item object is passed to that function as an argument.

### indicatorComponent

Type: `Component`

Custom component to override the default indicator component.

### itemComponent

Type: `Component`

Custom component to override the default item component.


## License

MIT © [Vadim Demedes](http://github.com/vadimdemedes)