メインコンテンツへスキップ
BlueAI
ホーム/コンポーネント/フォームと入力/検索入力 SearchInput

SearchInput

検索アイコン付きの入力フィールド。入力中はクリアボタンを表示。

|
import { SearchInput } from "@blueai/ui"

Examples

Default
const [value, setValue] = useState("");
<SearchInput value={value} onChange={setValue} />
Small size
<SearchInput value={value} onChange={setValue} size="sm" placeholder="メンバーを検索..." />

Props

PropTypeDefaultDescription
value*string入力値
onChange*(value: string) => void値変更コールバック
placeholderstringプレースホルダー(デフォルト: 検索...)
onClear() => voidクリア時の追加コールバック
size"sm" | "md"サイズ(デフォルト: md)
classNamestring追加CSSクラス