how coul i throw validations to a composable function vue 3 - vuejs3

Question

I am using vuelidate to validate my forms but seeing that the code is repetitive I wanted to make a composable function that validates a data object and the rules, but when I use the same ass function to compare the passwords, I get the following error
UserForm.vue:124 Uncaught (in promise) ReferenceError: Cannot access 'form' before initialization
certainly form is started after its invocation, I can't think how to send the rules to validate the passwords or any other field in the future.
this my vue 3 form component
<template>
<form #submit.prevent="submitForm" class="w-full">
<!-- nombre de usuario y nickname -->
<div class="main-box">
<div class="input-box">
<label class="label-item" for="grid-nick-name">
nombre de usuario
</label>
<input :class="[ !v$.nickname.$error ?'input-item' : 'input-item-error']" id="grid-nick-name" type="text" placeholder="user"
v-model="form.nickname">
<p class="error-msg" v-if="v$.nickname.$error">Porfavor rellena el campo</p>
</div>
<div class="input-box">
<label class="label-item" for="grid-name">
nombre
</label>
<input :class="[ !v$.name.$error ?'input-item' : 'input-item-error']" id="grid-name" type="text" placeholder="name lastname"
v-model="form.name">
<p class="error-msg" v-if="v$.name.$error">Porfavor rellena el campo</p>
</div>
</div>
<!-- document -->
<div class="main-box">
<div class="input-box-full">
<label class="label-item" for="grid-document">
Documento
</label>
<input :class="[ !v$.document.$error ?'input-item' : 'input-item-error']" id="grid-document" type="text" placeholder="00000000"
v-model="form.document">
<p class="error-msg" v-if="v$.document.$error">Campo vacio / datos invalidos</p>
</div>
</div>
<!-- password y password re -->
<div class="main-box">
<div class="input-box">
<label class="label-item" for="grid-password">
contraseña
</label>
<input :class="[ !v$.password.$error ?'input-item' : 'input-item-error']" id="grid-password" type="password" placeholder="*********"
v-model="form.password">
<p class="error-msg" v-if="v$.password.$error">Porfavor rellena el campo</p>
</div>
<div class="input-box">
<label class="label-item" for="grid-re-password">
repetir contraseña
</label>
<input :class="[ !v$.repassword.$error ?'input-item' : 'input-item-error']" id="grid-re-password" type="password" placeholder="*********"
v-model="form.repassword">
<p class="error-msg" v-if="v$.repassword.$error">Las Contraseñas deben coincidir</p>
</div>
</div>
<div class="main-box">
<div class="input-box">
<label class="label-item" for="grid-entity">
Entidad
</label>
<div class="relative">
<select :class="[ !v$.entity.$error ?'input-item' : 'input-item-error']" id="grid-entity" v-model="form.entity">
<option v-bind:value="'Hardware'">Hardware</option>
<option>Software</option>
<option>Red</option>
</select>
<div class="icon-item">
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
</div>
</div>
</div>
<div class="input-box">
<label class="label-item" for="grid-position">
Cargo
</label>
<div class="relative">
<select :class="[ !v$.position.$error ?'input-item' : 'input-item-error']" id="grid-position" v-model="form.position">
<option selected>Baja</option>
<option>Media</option>
<option>Alta</option>
</select>
<div class="icon-item">
<svg class="fill-current h-4 w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"><path d="M9.293 12.95l.707.707L15.657 8l-1.414-1.414L10 10.828 5.757 6.586 4.343 8z"/></svg>
</div>
</div>
</div>
</div>
<div>
<button type="submit"
class="submit-button">Guardar</button>
</div>
</form>
</template>
and this is the script vue 3 form component
<script setup>
import { required, numeric, alphaNum, sameAs, minLength } from '#vuelidate/validators';
import { useFormValidator } from "#/composables/useFormValidator.js";
const initialState = {
nickname:'',
name:'',
document:'',
password:'',
repassword:'',
entity:'',
position:'',
}
const validations = {
nickname: { required },
name: { required, alphaNum },
document: { required, numeric },
password: { required, minLength: minLength(6) },
repassword: { required, samePassword: sameAs(form.password)},
entity: { required },
position: { required },
}
const {
form,
v$,
submitForm
} = useFormValidator(initialState,validations);
</script>
here's my composable function validation
import { reactive } from '#vue/reactivity';
import useVuelidate from '#vuelidate/core';
import { computed, inject } from 'vue';
export const useFormValidator = (initialValue,validations) => {
const swal = inject('$swal');
const form = reactive({...initialValue});
const rules = computed(() => {
return {
...validations
}
});
const v$ = useVuelidate(rules,form);
const submitForm = async () => {
const isvalidForm = await v$.value.$validate();
if(!isvalidForm) return ;
else{
//aler succes
swal("Guardado!","el usuario a sido guardado correctamente","success");
//object initial state
Object.assign(form,initialValue);
//validations reset form
v$.value.$reset();
}
}
return {
form,
v$,
submitForm,
}
}
i need to passt diferent validation rules every time i use the composable