@rax-ui/badge NPM | npm.io

1.0.0-beta.62 • Published 3 years ago

Install

Weekly downloads

55

License

-

Repository

Last release

3 years ago

display: Badge

family: Data Display

Badge

图标右上角的红点、数字或者文字。用于告知用户，该区域的状态变化或者待处理任务的数量。

API

Props

名称	说明	类型	默认值
count	展示的数字，可以为文字，大于 `max` 时显示为 `${max}+`，为 0 时隐藏	number
max	展示封顶的数字值	number	99
type	类型可选值: `normal`, `dot`, `unread`	enum	normal
renderBadge	自定义的badge渲染函数	(): node
children	被包裹的元素，当 children 存在时，badge将出现在元素的右上方	any

CSS API

名称	说明
badge	bage 样式
badge__content	badge 内容样式
badge__text	badge 文字样式
badge--auto	badge 存在 children 时的样式
badge--auto__content	badge 存在 children 时的内容样式
badge--dot	`type="dot"` 时的样式
badge--dot__content	`type="dot"` 时的内容样式
badge--unread	`type="unread"` 时的样式
badge--unread__content	`type="unread"` 时的内容样式

Rax rax-component

@rax-ui/styles rax-text rax-view

@infinitebrahmanuniverse/nolb-_rax @everything-registry/sub-chunk-760 @zalastax/nolb-_rax

3 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

4 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago