SearchBox

A text input with a search glyph and a result count.

import { SearchBox } from '@textui/widgets';

<SearchBox value="" count={12} onChange={(value) => console.log(value)} />

Props

| Prop | Type | Default | | | — | — | — | — | | count | number | | Result count, shown after the field. |

Role: searchbox.

Everything TextInput takes except search, which is already on. count prints the number of matches in the field, which is the one piece of feedback a filter needs and the one most often left to a label somewhere else.

Filtering is not its job. It reports what was typed; what that matches is the screen’s business.

See also

• Editing keys and selection - the keys, the selection and the clipboard
• The clipboard - copy and paste belong to the terminal
• TextInput - the full prop list
• List, Table - what a search box usually filters