Badge

A small label used to display status or category information.

Import


import { Badge } from '@grannyshot/ui'

Usage


<Badge variant="success">Active</Badge>

Variants


<Badge variant="success">Success</Badge>
<Badge variant="warning">Warning</Badge>
<Badge variant="error">Error</Badge>
<Badge variant="info">Info</Badge>
<Badge variant="neutral">Neutral</Badge>

Sizes


<Badge size="sm">Small</Badge>
<Badge size="md">Medium</Badge>

Props

Prop	Type	Default	Description
`variant`	`'success' \| 'warning' \| 'error' \| 'info' \| 'neutral'`	`'neutral'`	Visual style
`size`	`'sm' \| 'md'`	`'md'`	Badge size
`className`	`string`	—	Additional CSS classes

Extends all native <span> HTML attributes.