Badge
A compact label for neutral or low-emphasis status metadata.
Try it
Warning badge
A compact review-state label.
Use it
Working invocation
This code creates the configuration shown above. Copy the template and the required Python context together.
{% load brickwork_components %}
{% bw_badge label=label variant=variant icon=icon %}context = {'variant': 'warning', 'icon': 'alert-triangle', 'label': 'Needs review'}Guide
Add it to your project
- Load `brickwork_components`.
- Call `{% bw_badge %}` with visible label text.
Options
Public API
| Option | Type | Default | Required | Description |
|---|---|---|---|---|
| label | str | Not set | Yes | Badge text. Constraint: Use concise visible text that identifies the control or measurement. |
| variant | str | neutral | No | Semantic colour treatment. Allowed: neutral, success, warning, danger, info. Constraint: Use one of the documented variants; use `danger`, not an invented `error` severity. |
| icon | str | Empty string | No | Optional decorative leading icon. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
| dismissible | bool | False | No | Enables enhanced removal. Constraint: No additional package-level validation is documented beyond this option's stated type and its role in the component. |
Behaviour
Accessibility and responsive behaviour
- Accessibility
- The label conveys status, with icons decorative; the optional dismiss button has a translated name.
- Responsive
- No breakpoint switch.
- Without JavaScript
- The badge works as static content. Its removal control is hidden until enhancement initialises.
Need help?
Troubleshooting
Contract check: tag's dismissible=True the root gains x-data="bwDismissible()" (semver-public,
For `dismissible=True`, initialise Brickwork on the host Alpine instance; the built-in close control calls `bwDismissible`, emits `bw:dismiss`, and visual dismissal does not persist state.
Explore next