Repeater

Default

Use the default Repeater in situations where the user may need to repeat a single component or field, e.g. for multiple phone number entries.

With separator

Use the Repeater with separator when the user may need to repeat a set of components or fields, e.g. for multiple sets of credit card or account details.

Usage examples

User experience

The text “Add another item” is configurable but must be used with the “Add Circle” icon in order to be discoverable and appear as an affordance.

A remove button appears once another instance has been added.

The “Add another item” button must always be left aligned in order to maximise discoverability.

Dos and don'ts

• For accessibility reasons, the “Add Circle” icon must be used