vee-validate
vee-validate copied to clipboard
Keep generic aspect of SubmissionHandler in FormSlotProps
Is your feature request related to a problem? Please describe.
In the following scenario:
<script setup lang="ts">
import type { MyGenericObject } from '@/types' // MyGenericObject extends GenericObject
function onSubmit(values: MyGenericObject) {}
</script>
<template>
<Form v-slot="{ handleSubmit }">
<form @submit.prevent="handleSubmit($event, onSubmit)"></form>
</Form>
</template>
My type checker doesn't agree with me defining the values param of the onSubmit function param as anything else than GenericObject and this because FormSlotProps is not generic and its property handleSubmit is defined strictly as SubmissionHandler (with no generic params)
Describe the solution you'd like
I would like to be able to define my submission handler as previously described without type checker error.
Describe alternatives you've considered
I think redefining
type FormSlotProps = UnwrapRef<Pick<FormContext, 'meta' | 'errors' | 'errorBag' | 'values' | 'isSubmitting' | 'isValidating' | 'submitCount' | 'validate' | 'validateField' | 'handleReset' | 'setErrors' | 'setFieldError' | 'setFieldValue' | 'setValues' | 'setFieldTouched' | 'setTouched' | 'resetForm' | 'resetField' | 'controlledValues'>> & {
handleSubmit: (evt: Event | SubmissionHandler, onSubmit?: SubmissionHandler) => Promise<unknown>;
submitForm(evt?: Event): void;
getValues<TValues extends GenericObject = GenericObject>(): TValues;
getMeta<TValues extends GenericObject = GenericObject>(): FormMeta<TValues>;
getErrors<TValues extends GenericObject = GenericObject>(): FormErrors<TValues>;
};
to include generic params should do the trick