S

useSubmitActionTriggers

Fires submit actions automatically on field change, field blur, step transitions, and idle timeout.

useSubmitActionTriggers

Manages automatic execution of submit actions based on non-submit triggers like field changes, blur events, step transitions, and idle timeouts. This is what powers real-time features like auto-saving on field change or sending analytics on step exit.

You probably don’t need this directly. useFormState handles it internally when your config has actions with non-onSubmit triggers. Use it when building custom trigger logic.


Signature

import { useSubmitActionTriggers } from '@saastro/forms';

const { triggerFieldChange, triggerFieldBlur, triggerManual, hasActionsForTrigger } =
  useSubmitActionTriggers({
    config,
    values,
    currentStep,
    onActionExecuted,
    onActionError,
    enabled,
  });

Parameters

ParameterTypeRequiredDescription
configFormConfigYesForm configuration with submit actions
valuesRecord<string, unknown>YesCurrent form values
currentStepstringYesActive step ID
onActionExecuted(result) => voidNoCalled after an action completes
onActionError(error, actionName) => voidNoCalled when an action fails
enabledbooleanNoEnable/disable all triggers (default: true)

Return Value

PropertyTypeDescription
triggerFieldChange(fieldName, value) => voidTrigger onFieldChange actions (debounced)
triggerFieldBlur(fieldName) => voidTrigger onFieldBlur actions (immediate)
triggerManual(actionIds?) => Promise<SubmitActionsResult>Manually trigger specific actions
hasActionsForTrigger(triggerType, triggerValue?) => booleanCheck if any actions exist for a trigger type

Trigger Types

TriggerWhen It FiresBehavior
onFieldChangeUser changes a field valueDebounced (default 300ms per field)
onFieldBlurUser leaves a fieldImmediate
onStepEnterUser navigates to a stepAutomatic (via step change detection)
onStepExitUser leaves a stepAutomatic (via step change detection)
onDelayUser is idle for N millisecondsAutomatic (listens to mousedown, keydown, touchstart, scroll)
manualProgrammatic triggerVia triggerManual() call

Example: Manual Trigger

const { triggerManual, hasActionsForTrigger } = useSubmitActionTriggers({
  config,
  values: methods.getValues(),
  currentStep: currentStepId,
});

// Check if there are manual actions available
if (hasActionsForTrigger('manual')) {
  const result = await triggerManual(['save-draft']);
  console.log('Draft saved:', result.allSuccessful);
}