Markup Hooks - Raykoi

Written by Raykoi at runtime, not by you — place the containers, and style the classes/attributes in your own CSS. Don’t hardcode them into your generated markup.

Selector	When
`[data-raykoi-error="fieldName"]`	A container for one field’s validation message — you place it, Raykoi fills it.
`[data-raykoi-status]`	The success/error message container — omit it and Raykoi creates one automatically.
`.raykoi-field-error`	Added to a field error container once it has content.
`[data-raykoi-error-type]`	`required` \| `pattern` \| `minLength` \| `maxLength` \| `min` \| `max` — style different failure kinds differently without parsing message text.
`.raykoi-message`	Added to the status container once it has content.
`[data-raykoi-state="success"\|"error"]`	On the status container, reflecting the outcome.
`[data-raykoi-state]` on the `<form>` itself	The full lifecycle state — `idle` → `validating` → `uploading` → `submitting` → `success` \| `error` \| `aborted`.

See Customizations for a before/after example and CSS.