Forms

Field

A composable label with linked help and error text.

components.Field · FieldProps

Use a short, clear name.

Use it well.

Spread ControlAttributes on one raw control. Use a unique ID. Required and aria-invalid are connected to actual rendered descriptions.

Explore the full demo →

This is the source compiled for the preview. Select the text to copy it, or download the file. Change the package name and demo routes for your application.

package examples

import "github.com/Tend-Stack/TendUI/v2026/components"

templ ExampleField() {
	{{ field := components.FieldProps{ID: "sample-title", Label: "Project title", Description: "Use a short, clear name.", Required: true} }}
	@components.Field(field) {
		<input type="text" name="title" { field.ControlAttributes()... }/>
	}
}