ComboBox

Props

MultiComboBox props

Name	Required	Type	Description
items	true	`ComboBoxItem<T>[]`	選択可能なアイテムのリスト
selectedItems	true	`(ComboBoxItem<T> & { deletable?: boolean; })[]`	選択されているアイテムのリスト
name	-	`string`	input 要素の `name` 属性の値
disabled	-	`false`, `true`	input 要素の `disabled` 属性の値
error	-	`false`, `true`	`true` のとき、コンポーネントの外枠が `DANGER` カラーになる
creatable	-	`false`, `true`	`true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
placeholder	-	`string`	input 要素の `placeholder` 属性の値
dropdownHelpMessage	-	`string`, `number`, `false`, `true`, `ReactElement<any, string \| JSXElementConstructor<any>>`, `ReactFragment`, `ReactPortal`	ドロップダウンリスト内に表示するヘルプメッセージ
isLoading	-	`false`, `true`	`true` のとき、ドロップダウンリスト内にローダーを表示する
selectedItemEllipsis	-	`false`, `true`	選択されているアイテムのラベルを省略表示するかどうか
width	-	`string`, `number`	input 要素の `width` スタイルに適用する値
dropdownWidth	-	`string`, `number`	ドロップダウンリストの `width` スタイルに適用する値
inputValue	-	`string`	テキストボックスの `value` 属性の値。 `onChangeInput` と併せて設定することで、テキストボックスの挙動が制御可能になる。
className	-	`string`	コンポーネント内の一番外側の要素に適用するクラス名
onChange	-	`(e: ChangeEvent<HTMLInputElement>) => void`	input 要素の `value` が変わった時に発火するコールバック関数 @deprecated `onChange` は非推奨なため、代わりに `onChangeInput` を使用してください。
onChangeInput	-	`(e: ChangeEvent<HTMLInputElement>) => void`	input 要素の `value` が変わった時に発火するコールバック関数
onAdd	-	`(label: string) => void`	`items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
onDelete	-	`(item: ComboBoxItem<T>) => void`	選択されているアイテムの削除ボタンがクリックされた時に発火するコールバック関数
onSelect	-	`(item: ComboBoxItem<T>) => void`	アイテムが選択された時に発火するコールバック関数
onChangeSelected	-	`(selectedItems: ComboBoxItem<T>[]) => void`	選択されているアイテムのリストが変わった時に発火するコールバック関数
onFocus	-	`() => void`	コンポーネントがフォーカスされたときに発火するコールバック関数
onBlur	-	`() => void`	コンポーネントからフォーカスが外れた時に発火するコールバック関数
decorator	-	`{ noResultText?: (text: string) => ReactNode; destroyButtonIconAlt?: (text: string) => string; selectedListAriaLabel?: (text: string) => string; }`	コンポーネント内のテキストを変更する関数/

SingleComboBox props

Name	Required	Type	Description
items	true	`ComboBoxItem<T>[]`	選択可能なアイテムのリスト
selectedItem	true	`ComboBoxItem<T>`	選択されているアイテム
defaultItem	-	`ComboBoxItem<T>`	デフォルトで選択されるアイテム
name	-	`string`	input 要素の `name` 属性の値
disabled	-	`false`, `true`	input 要素の `disabled` 属性の値
prefix	-	`string`, `number`, `false`, `true`, `ReactElement<any, string \| JSXElementConstructor<any>>`, `ReactFragment`, `ReactPortal`	コンポーネント内の先頭に表示する内容
error	-	`false`, `true`	`true` のとき、コンポーネントの外枠が `DANGER` カラーになる
creatable	-	`false`, `true`	`true` のとき、 `items` 内に存在しないアイテムを新しく追加できるようになる
placeholder	-	`string`	input 要素の `placeholder` 属性の値
dropdownHelpMessage	-	`string`, `number`, `false`, `true`, `ReactElement<any, string \| JSXElementConstructor<any>>`, `ReactFragment`, `ReactPortal`	ドロップダウンリスト内に表示するヘルプメッセージ
isLoading	-	`false`, `true`	`true` のとき、ドロップダウンリスト内にローダーを表示する
width	-	`string`, `number`	input 要素の `width` スタイルに適用する値
dropdownWidth	-	`string`, `number`	ドロップダウンリストの `width` スタイルに適用する値
className	-	`string`	コンポーネント内の一番外側の要素に適用するクラス名
onChange	-	`(e: ChangeEvent<HTMLInputElement>) => void`	input 要素の `value` が変わった時に発火するコールバック関数 @deprecated `onChange` は非推奨なため、代わりに `onChangeInput` を使用してください。
onChangeInput	-	`(e: ChangeEvent<HTMLInputElement>) => void`	input 要素の `value` が変わった時に発火するコールバック関数
onAdd	-	`(label: string) => void`	`items` 内に存在しないアイテムが追加されたときに発火するコールバック関数
onSelect	-	`(item: ComboBoxItem<T>) => void`	アイテムが選択された時に発火するコールバック関数
onClear	-	`() => void`	選択されているアイテムがクリアされた時に発火するコールバック関数
onChangeSelected	-	`(selectedItem: ComboBoxItem<T>) => void`	選択されているアイテムのリストが変わった時に発火するコールバック関数
decorator	-	`{ noResultText?: (text: string) => ReactNode; destroyButtonIconAlt?: (text: string) => string; }`	コンポーネント内のテキストを変更する関数/