Foundation
SearchInput
Pill search field built on Input — magnifier glyph leading, ⌘K hint or × clear button trailing.
Examples
Default
<SearchInput bind:value placeholder="Search · try author:turing" />Custom shortcut
<SearchInput shortcutLabel="Ctrl+F" />Without shortcut hint
<SearchInput showShortcut={false} />Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | '' | Bindable search string. |
showShortcut | boolean | true | Show the ⌘K hint when value is empty. |
shortcutLabel | string | '⌘K' | Label for the shortcut hint. |
onclear | () => void | — | Called when the × clear button is pressed. |
...rest | HTMLInputAttributes | — | Spread onto the underlying <input>. |
Install
CLI
npx @a3tai/mittsu add search-input