Documentation
¶
Overview ¶
templ: version: v0.3.977
Index ¶
- func Description(props ...DescriptionProps) templ.Component
- func Error(signal string) templ.Component
- func ErrorStatic(signal string) templ.Component
- func Field(props ...FieldProps) templ.Component
- func Form(props Props) templ.Component
- func FormError(formID string) templ.Component
- func Handler(signals any, validate SubmitFunc, ...) http.HandlerFunc
- func Label(props ...LabelProps) templ.Component
- func Submit(props SubmitProps) templ.Component
- func Success(signal string) templ.Component
- type DescriptionProps
- type FieldError
- type FieldProps
- type FormSignals
- type LabelProps
- type Props
- type SubmitFunc
- type SubmitProps
Constants ¶
This section is empty.
Variables ¶
This section is empty.
Functions ¶
func Description ¶
func Description(props ...DescriptionProps) templ.Component
Description renders helper text below a form field.
func Error ¶
Error renders an error message that shows when a signal is non-empty. The signal parameter is the full Datastar signal reference (e.g. "$login.email_error").
func ErrorStatic ¶
ErrorStatic renders a static error message that shows when a signal is truthy. Use this when the error text is known at render time, not from a signal.
func Field ¶
func Field(props ...FieldProps) templ.Component
Field wraps a label + input + error into a fieldset group.
func Form ¶
Form renders a <form> that submits via Datastar SSE. The backend responds with signal patches (validation errors, success state, etc.).
Usage:
type LoginSignals struct {
Email string `json:"email"`
Password string `json:"password"`
}
@form.Form(form.Props{
ID: "login",
Action: "/api/auth/login",
Signals: LoginSignals{},
}) {
@form.Field() {
@form.Label("login", "email") { Email }
<input class="input" { ds.Bind("$login.email")... } />
@form.Error("login", "email_error") { Invalid email }
}
@form.Submit("login") { Sign In }
}
func FormError ¶
FormError renders a form-level error banner. Shows when the form's "error" signal is non-empty.
func Handler ¶
func Handler(signals any, validate SubmitFunc, onSuccess func(formID string, sse *datastar.ServerSentEventGenerator)) http.HandlerFunc
Handler returns an http.HandlerFunc that processes form submissions via SSE. The signals parameter declares the form's field shape — error signal names are derived automatically by appending "_error" to each json tag. On every submit, all derived error fields are cleared before applying actual errors, preventing stale errors from persisting across resubmissions.
Mount at your form's Action path:
r.Post("/auth/login", form.Handler(loginFormSignals{}, loginValidator, onSuccess))
func Label ¶
func Label(props ...LabelProps) templ.Component
Label renders a <legend> label for a form field.
func Submit ¶
func Submit(props SubmitProps) templ.Component
Submit renders a submit button that shows a loading state while submitting.
Types ¶
type DescriptionProps ¶
type DescriptionProps struct {
Class string
}
DescriptionProps configures a field description.
type FieldError ¶
type FieldError struct {
// Field is the signal name (e.g. "email_error").
Field string
// Message is the error text shown to the user.
Message string
}
FieldError represents a validation error for a specific form field.
type FieldProps ¶
type FieldProps struct {
Class string
}
FieldProps configures a form field container.
type FormSignals ¶
FormSignals holds the reactive state for a form.
type Props ¶
type Props struct {
// ID uniquely identifies this form. Required for signal namespacing.
ID string
// Class adds CSS classes to the form element.
Class string
// Attributes adds arbitrary HTML attributes.
Attributes templ.Attributes
// Action is the backend endpoint for form submission.
// Uses ds.Post() with CSRF token automatically.
Action string
// Method overrides the HTTP method. Defaults to POST.
// Supported: "post", "put", "patch", "delete".
Method string
// Multipart sends the form as multipart/form-data.
// Required for file uploads. Adds enctype and tells Datastar
// to use contentType: 'form'.
Multipart bool
// Signals is the initial form signal state (your custom signals struct).
// The form merges FormSignals (submitting, error) with your struct.
Signals any
}
Props configures a Datastar-powered form.
type SubmitFunc ¶
type SubmitFunc func(formID string, r *http.Request) []FieldError
SubmitFunc processes a form submission. It receives the form ID and the raw request, and returns field errors. Return nil or empty slice for success.
type SubmitProps ¶
type SubmitProps struct {
// FormID is the form's ID for accessing its signals.
FormID string
// Variant sets the button color variant (e.g. button.VariantPrimary).
// Defaults to no variant (plain btn).
Variant button.Variant
// Class adds CSS classes to the button.
Class string
// Attributes adds arbitrary HTML attributes.
Attributes templ.Attributes
}
SubmitProps configures the form submit button.