@synapse-ui/badge

Lightweight Angular badge component for status labels, counts, and tags.

Installation

npm install @synapse-ui/badge

Usage

import { Badge } from '@synapse-ui/badge';

@Component({
  imports: [Badge],
  template: `
    <synapse-badge variant="success">Active</synapse-badge>
    <synapse-badge variant="error" [dot]="true" />
  `,
})
export class MyComponent {}

Inputs

| Input | Type | Default | Description | | --------- | ---------------------------------------------------------------------- | ----------- | --------------------------- | | variant | 'default' \| 'success' \| 'warning' \| 'error' \| 'info' \| 'accent' | 'default' | Color variant | | size | 'sm' \| 'md' | 'md' | Badge size | | dot | boolean | false | Renders as a small dot only |

Running unit tests

Run nx test badge to execute the unit tests.