Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

ErrorPill

The ErrorPill component displays the number of validation errors associated with a field or group of fields. It returns null when the count is zero.

Import

1
import { ErrorPill, useTranslation } from '@payloadcms/ui'

Counts

Loading component example…

Pass the i18n object from useTranslation. Add withMessage when the count needs a localized “error” or “errors” label.

Common props

These are the props most commonly used with this component. See its exported types in @payloadcms/ui for the complete list.

Prop

Type

Default

Description

count *

number

Number of errors. Renders nothing when set to 0.

i18n *

I18nClient

Supplies localized error labels.

withMessage

boolean

false

Displays “error” or “errors” after the count.

className

string

Adds a custom class to the element.

* An asterisk denotes that a prop is required.

Was this page helpful?

Next

Gutter