Field Validation

Overview

Description....

Interactive demo

The demo below allows you to preview the component. You can play with its props, variations, configuration options and dive into its events and even see them trigger in the event log tab.

MedKit Field Validation

Oh no! There seems to be a little bit of a problem.

Props Help

For each property in a component you can see:

• value-type
  that it supports
• The default
  value
• If the prop is
  required

Id

string

Required

The id of the input field related to the validation.

 

Value

string

Array<string>

The error message to display.

Value 

Multiline message

Length is never an issue with this helper. Your message can be as long as you need. Note: Error messages wrap

Label (optional)

Length is never an issue with this helper. Your message can be as long as you need and wraps to the size of the field it is attached to.

Multiple messages

The message also supports arrays of values and can present them neatly to the user.

Label (optional)

1. Firstly it is misspelt
2. Secondly it is not enough of an explanation
3. Thirdly the validator doesn't like it.

Figma Library

You can find the component in our MedKit Figma library.