Search documentation of phoenix_kit

# PhoenixKitWeb.Components.Dashboard.Badge (phoenix_kit v1.7.87)

Copy Markdown View Source

Badge component for dashboard tab indicators.

Renders various badge types with support for:

- Count badges (numeric)
- Dot indicators
- Status badges
- "New" indicators
- Custom text badges
- Pulse and other animations

## Summary

### Functions

compound_badge(assigns)

Renders a compound badge with multiple colored segments.

count_badge(assigns)

Renders a count badge with optional max value display.

dashboard_badge(assigns)

Renders a dashboard badge.

dot_badge(assigns)

Renders a dot indicator badge.

new_badge(assigns)

Renders a "New" indicator badge.

presence_indicator(assigns)

Renders a presence indicator showing user count.

status_badge(assigns)

Renders a status badge with value and color.

text_badge(assigns)

Renders a custom text badge.

## Functions

# compound_badge(assigns)

Renders a compound badge with multiple colored segments.

Supports three styles:

- `:text` - Colored text values with separator (default)
- `:blocks` - Colored background pills side by side
- `:dots` - Colored dots with numbers

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.

# count_badge(assigns)

Renders a count badge with optional max value display.

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.

# dashboard_badge(assigns)

Renders a dashboard badge.

## Attributes

- `badge` - The Badge struct or nil
- `class` - Additional CSS classes

## Examples

    <.dashboard_badge badge={@tab.badge} />
    <.dashboard_badge badge={Badge.count(5)} />

## Attributes

- `badge` (`:any`) - Defaults to `nil`.
- `class` (`:string`) - Defaults to `""`.

# dot_badge(assigns)

Renders a dot indicator badge.

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.

# new_badge(assigns)

Renders a "New" indicator badge.

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.

# presence_indicator(assigns)

Renders a presence indicator showing user count.

## Attributes

- `count` (`:integer`) - Defaults to `0`.
- `show_text` (`:boolean`) - Defaults to `false`.
- `class` (`:string`) - Defaults to `""`.

# status_badge(assigns)

Renders a status badge with value and color.

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.

# text_badge(assigns)

Renders a custom text badge.

## Attributes

- `badge` (`:any`) (required)
- `class` (`:string`) - Defaults to `""`.