@s-ui/react-molecule-badge-counter
v1.17.0
Published
`MoleculeBadgeCounter` is a component used for warning the user about new content or updates
Downloads
7,670
Maintainers
Keywords
Readme
MoleculeBadgeCounter
MoleculeBadgeCounter
is a component used for warning the user about new content or updates
Installation
$ npm install @s-ui/react-molecule-badge-counter --save
Usage
import MoleculeBadgeCounter, {
moleculeBadgeCounterVariants,
moleculeBadgeCounterSizes
} from '@s-ui/react-molecule-badge-counter'
Basic (Small)
<MoleculeBadgeCounter />
Dot Variant
<MoleculeBadgeCounter variant={moleculeBadgeCounterVariants.DOT} />
With Text
<MoleculeBadgeCounter>Text</MoleculeBadgeCounter>
With Icon
<MoleculeBadgeCounter>
<Icon />
</MoleculeBadgeCounter>
Medium Size
<MoleculeBadgeCounter size="medium" />
Exclamation Variant
<MoleculeBadgeCounter
variant={moleculeBadgeCounterVariants.EXCLAMATION}
size={moleculeBadgeCounterSizes.MEDIUM}
/>
Extended Variant
<MoleculeBadgeCounter
variant={moleculeBadgeCounterVariants.EXTENDED}
size={moleculeBadgeCounterSizes.MEDIUM}
/>
Labels
<MoleculeBadgeCounter label="4" />
<MoleculeBadgeCounter label="42" />
<MoleculeBadgeCounter label="142" />
Find full description and more examples in the demo page.