Actions

Actions execute in response to form lifecycle triggers.

Triggers

Form Triggers

  • form_mount - Form initialization
  • form_change - Any field change
  • form_submit - Form submission initiated

Submit Lifecycle

  • form_submit_start - Submit process begins
  • form_submit_success - Submit completed successfully
  • form_submit_error - Submit failed
  • form_submit_complete - Submit finished (success or failure)

Step Triggers

  • step_change - Navigation between steps
  • step_enter - Entering a step
  • step_leave - Leaving a step
  • step_view - Step becomes visible (for analytics)

Configuring Triggers

Actions can specify default triggers in metadata or be configured per-form:

// Default triggers from registration
metadata: {
	defaultTriggers: ['form_submit', 'form_submit_success']
}
 
// Override in form config
{
	id: 'custom-action',
	$type: 'submit',
	triggers: ['form_change']
}

Built-in Plugins

Submit

Submit form data to an endpoint:

{
	"id": "submit-form",
	"$type": "submit",
	"endpoint": "/api/forms",
	"method": "POST",
	"successMessage": "Form submitted successfully!",
	"redirectUrl": "/thank-you"
}

Auto-save

Automatically save form progress with debouncing:

{
	"id": "auto-save",
	"$type": "auto-save",
	"storageKey": "contact-form-draft",
	"debounceMs": 1000,
	"triggers": ["form_change"]
}

Notification

Display user notifications for form events:

{
	"id": "success-notification",
	"$type": "notification",
	"message": "Form submitted successfully!",
	"variant": "success",
	"triggers": ["form_submit_success"]
}

GTM

Track form events in Google Tag Manager:

{
	"id": "track-submit",
	"$type": "gtm",
	"event": "form_submit",
	"data": {
		"formId": "contact-form",
		"category": "engagement"
	},
	"triggers": ["form_submit"]
}

Reset

Reset form to initial state:

{
	"id": "reset-form",
	"$type": "reset",
	"triggers": ["manual_reset"]
}

Creating Custom Actions

See the Actions package for creating domain-agnostic actions.