検索入力SearchInput
Experimental

検索アイコンとクリア操作を備えた検索入力欄です。

プレビュー

状態とバリエーション

クリア可能

入力済みの時だけクリアボタンを表示します。

検索語: "バナー"

クリアボタンなし

候補やフィルター側でリセットする検索欄では、クリアボタンを非表示にできます。

検索語: "画像"

無効化

検索できない理由はツールチップと補足文で伝えます。

更新が完了すると検索できます。

プロパティ

表は横にスクロールできます
プロパティ初期値説明
valuestring-外部から渡す検索語です。
onValueChange(value: string) => void-検索語が変わった時に呼ばれます。
clearablebooleantrue入力済みの時にクリアボタンを表示します。
clearLabelstring'Clear search'クリアボタンの支援技術向けラベルです。
placeholderstring'Search...'未入力時に表示する補助テキストです。

使い方

Loading...

使用コンポーネント