Badge

Badgeコンポーネントは、件数などの数値を視覚的に表すためのコンポーネントです。

種類

件数を表すものと、単に視覚情報をドットで表すものの2種類があります。

アイコンなどの右肩にも表示できます。

特に意味は持たせずに4種類の色を用意しています。

アクセシビリティ

ドット表示の場合には視覚情報しか持たないため、何らかの形で必ずアクセシブルな名前を与えてください。

Props

count
number

件数

overflowCount
number

最大表示件数。この数を超えた場合は{最大表示件数+}と表示される

showZero
false true

0値を表示するかどうか

type
"grey" "blue" "red" "yellow"

色の種類

dot
false true

ドット表示するかどうか