@payfit/unity-components
Version:
56 lines (55 loc) • 2.22 kB
TypeScript
import { ValidationLogicFn } from '@tanstack/form-core';
type ValidationEvent = 'blur' | 'change' | 'submit';
export interface FieldRevalidateLogicProps {
/** Event to trigger onDynamic when observed fields have not been blurred yet (default: 'blur') */
whenPristine?: ValidationEvent;
/** Event to trigger onDynamic after the first blur (default: 'change') */
whenDirty?: ValidationEvent;
/** Fields observed by this validation logic */
fields: string[];
}
/**
* A `ValidationLogicFn` that controls when `onDynamic` / `onDynamicAsync`
* validators fire based on per-field blur state.
*
* Before the first blur → `onDynamic` fires on `whenPristine` (default: `'blur'`).
* After the first blur → `onDynamic` fires on `whenDirty` (default: `'change'`).
*
* **Important**: Fields listed in `fields` **must** use `onDynamic` (or
* `onDynamicAsync`) as their sole validation mechanism and be **excluded**
* from form-level validation schemas (e.g. `onBlur`, `onChange`).
* Mixing `onDynamic` with other validators on the same field leads to
* stale errors because standard validators are not re-run outside their
* original event.
*
* Validators without `onDynamic` (e.g. other fields validated via
* form-level `onBlur` schemas) are delegated to `defaultValidationLogic`.
* @example
* ```tsx
* const form = useTanstackUnityForm({
* defaultValues: { password: '', email: '' },
* validationLogic: fieldRevalidateLogic({
* whenPristine: 'blur',
* whenDirty: 'change',
* fields: ['password'],
* }),
* // Form-level schema validates non-dynamic fields only.
* // The password field is excluded — it uses onDynamic instead.
* validators: { onBlur: z.object({ email: z.string().email() }) },
* })
*
* <form.AppField
* name="password"
* validators={{
* onDynamic: ({ value }) => {
* const result = passwordSchema.safeParse(value)
* return result.success ? undefined : result.error.issues[0].message
* },
* }}
* >
* {field => <field.PasswordField label="Password" />}
* </form.AppField>
* ```
*/
export declare const fieldRevalidateLogic: (config: FieldRevalidateLogicProps) => ValidationLogicFn;
export {};