CurrencyInput

金額を入力するためのコンポーネントです。入力値が整数であった場合、入力欄からフォーカスを外したときに3桁ごとにカンマが入った値で表示されます。

使用上の注意

<Input type="number">の代わりに、金額入力にはCurrencyInputを使用してください。

通貨記号や単位はprefixまたはsuffixで補足してください。一般的に内容に対して前方に置かれる単位（例: 米ドル）にはprefixを、後方に置かれる単位（例: 日本円）にはsuffixを用いてください。

placeholder非推奨

string

@deprecated placeholder属性は非推奨です。別途ヒント用要素を設置するか、それらの領域を確保出来ない場合はTooltipコンポーネントの利用を検討してください。

value

string

通貨の値

width

string number

コンポーネントの幅

defaultValue

string

デフォルトで表示する通貨の値

autoFocus

false true

オートフォーカスを行うかどうか

prefix

string number false true ReactElement<any, string | JSXElementConstructor<any>> Iterable<ReactNode> ReactPortal

コンポーネント内の先頭に表示する内容

error

false true

フォームにエラーがあるかどうか

suffix

string number false true ReactElement<any, string | JSXElementConstructor<any>> Iterable<ReactNode> ReactPortal

コンポーネント内の末尾に表示する内容

bgColor

"BACKGROUND" "COLUMN" "BASE_GREY" "OVER_BACKGROUND" "HEAD" "BORDER" "ACTION_BACKGROUND"

背景色。readOnly を下地の上に載せる場合に使う

onFormatValue

(value: string) => void

入力値がフォーマットされたときに発火するコールバック関数