Skip to content

BadgeField

Displays a value inside a styled shadcn <Badge>. Useful for statuses or categories.

import { BadgeField } from '@/components/admin';
<BadgeField source="status" variant="secondary" />

This field type is especially useful for one-to-many relationships, e.g. to display a list of books for a given author:

<ReferenceManyField reference="books" target="author_id">
<SingleFieldList>
<BadgeField source="title" />
</SingleFieldList>
</ReferenceManyField>
PropRequiredTypeDefaultDescription
sourceRequiredstring-Field name
recordOptionalobjectRecord from contextExplicit record
defaultValueOptionalany-Fallback value
emptyOptionalReactNode-Placeholder when value missing
variantOptional"default" | "outline" | "secondary" | "destructive"outlineBadge style

Remaining props are passed to the underlying <Badge> component (e.g., className).