fix Handler component typing

Author: dbssman

src/ErrorMessage.vue

@@ -1,4 +1,3 @@
-
 <template>
   <template v-if="error">
     <span>{{ error }}</span>
@@ -11,10 +10,10 @@ import { DeepReadonly, computed } from '@vue/runtime-core'
 import { FormState, InjectionKey } from './types'
 
 const props = defineProps<{
-  name:string;
-  formState?: DeepReadonly<FormState<Record<string,any>>>;
-  injectionKey?: InjectionKey;
-}>();
+  name: string
+  formState?: DeepReadonly<FormState<Record<string, any>>>
+  injectionKey?: InjectionKey
+}>()
 
 const usableFormState = computed(() =>
   props.formState
@@ -25,6 +24,4 @@ const usableFormState = computed(() =>
 const error = computed(() => usableFormState.value?.errors[props.name])
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

src/FormHandler.vue

@@ -1,10 +1,10 @@
 <template>
-<slot v-if="$slots['default']" v-bind="useFormHandler($props)"></slot>
+  <slot v-if="$slots['default']" v-bind="useFormHandler($props)"></slot>
 </template>
 
 <script setup lang="ts">
-import { FormHandlerParams } from './types';
-import {useFormHandler} from './useFormHandler'
+import { FormHandlerParams } from './types'
+import { useFormHandler } from './useFormHandler'
 
-defineProps<FormHandlerParams<Record<string,any>>>()
-</script>
+defineProps<FormHandlerParams>()
+</script>

src/types/formHandler.ts

@@ -97,7 +97,10 @@ export type SubmitValidation = (
 
 export type InjectionKey = string | Symbol
 
-export interface FormHandlerParams<TForm, TInitial> {
+export interface FormHandlerParams<
+  TForm extends Record<string, any> = Record<string, any>,
+  TInitial extends Record<string, any> = Record<string, any>,
+> {
   /** Values to initialize the form */
   initialValues?: ComputableUnion<TInitial>