mirror of
https://github.com/tabler/tabler.git
synced 2026-10-12 05:06:55 +04:00
26 lines
782 B
Plaintext
26 lines
782 B
Plaintext
---
|
|
import Icon from './Icon.astro'
|
|
|
|
/** core/scss/ui/_badges.scss `.badge-{size}` modifier classes */
|
|
type BadgeSize = 'sm' | 'lg'
|
|
|
|
interface Props {
|
|
text?: string
|
|
color?: string
|
|
size?: BadgeSize | undefined
|
|
/** -lt soft colour variant */
|
|
light?: boolean
|
|
class?: string
|
|
icon?: string
|
|
iconEnd?: string
|
|
/** remaining attributes (id, data-*, aria-*, …) are forwarded to the root element */
|
|
[key: string]: unknown
|
|
}
|
|
|
|
const { text, color, size, light, class: className, icon, iconEnd, ...rest } = Astro.props
|
|
|
|
const classes = ['badge', size && `badge-${size}`, color && (light ? `bg-${color}-lt` : `bg-${color} text-${color}-fg`), className]
|
|
---
|
|
|
|
<span class:list={classes} {...rest}>{icon && <Icon name={icon} />}{text}{iconEnd && <Icon name={iconEnd} />}</span>
|