diff --git a/content/docs/blocks/forms.mdx b/content/docs/blocks/forms.mdx index c299981c10..da9be706f2 100644 --- a/content/docs/blocks/forms.mdx +++ b/content/docs/blocks/forms.mdx @@ -39,19 +39,58 @@ Customize form blocks for your application: ### Add Validation +The blocks on this page are built from plain `input` nodes, and an `input` +declares its own validation keys — `required`, `pattern`, `maxLength`, `min`, +`max` and `step` — which the renderer forwards to the native HTML input +attributes: + ```json { "type": "input", "name": "email", "inputType": "email", "required": true, - "validation": { - "pattern": "^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,}$", - "message": "Please enter a valid email address" - } + "pattern": "^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,}$" +} +``` + +`inputType: "email"` already gets the browser's own email check; `pattern` +tightens it. The browser enforces these constraints when the input is submitted +inside a `