Text Field

Single-line text input for collecting short answers.

Preview

What is your full name?

As shown on your passport

JSON definition

{
  "type": "TextField",
  "name": "fieldName",
  "title": "Question title",
  "hint": "",
  "shortDescription": "",
  "options": {},
  "schema": {}
}

Properties

Property	Type	Required	Description
`hint`	`string`	No	Hint text displayed below the field label to help the user answer the question.
`shortDescription`	`string`	No	A short description of the field used in the check-your-answers summary.

Options

Property	Type	Required	Description
`autocomplete`	`string`	No	Value for the HTML `autocomplete` attribute (e.g. `'given-name'`, `'email'`).
`classes`	`string`	No	Additional CSS classes applied to the component.
`condition`	`string`	No	Name of a condition that controls whether this component is shown.
`customValidationMessage`	`string`	No	A single custom message shown for any validation error on this field.
`customValidationMessages`	`object`	No	A map of Joi error codes to custom error messages.
`instructionText`	`string`	No	Alternative text read by screen readers in place of the field title.
`optionalText`	`boolean`	No	When `true`, appends '(optional)' to the field label.
`required`	`boolean`	No	Whether the field must be filled in. Defaults to `true`.

Schema constraints

Property	Type	Description
`max`	`number`	Maximum value, character length, word count, or file count.
`min`	`number`	Minimum value, character length, word count, or file count.
`length`	`number`	Exact character length required.
`regex`	`string`	Regular expression pattern the value must match.