Form Caption

qtm-form-caption element is a message (hint, error message, counter value, etc) that appears below the inputs.

This is some placeholder help text

<qtm-form-caption>This is some placeholder help text</qtm-form-caption>

Sizes

Control the size of a form caption setting size attribute to small, medium or large value. By default, the caption has size="medium".

This is some placeholder help text

This is some placeholder help text

This is some placeholder help text

<qtm-form-caption size="small"
  >This is some placeholder help text</qtm-form-caption
>
<qtm-form-caption size="medium"
  >This is some placeholder help text</qtm-form-caption
>
<qtm-form-caption size="large"
  >This is some placeholder help text</qtm-form-caption
>

Disabled

Add disabled attribute in form caption to disable the element.

This is some placeholder help text

<qtm-form-caption disabled>This is some placeholder help text</qtm-form-caption>

Validation states

Error

Add state="error" in caption to changer its color in error state.

The field is required

<qtm-form-caption state="error">The field is required</qtm-form-caption>

Warning

Add state="warning" in caption to changer its color in warning state.

Enter a valid input

<qtm-form-caption state="warning">Enter a valid input</qtm-form-caption>

API

qtm-form-caption

Property	Type	Default	Description
classes	string		list of classes to override or extend the styles applied to the component. You can use available utility classes by importing
disabled	boolean	false	If true, the component is disabled.
size	"large" | "medium" | "small"	'medium'	The size of element
state	"error" | "success" | "warning"