@teamnovu/kit-vue-forms 0.1.19 → 0.1.21

package/src/composables/useForm.ts

@@ -1,4 +1,3 @@
-import type { Awaitable } from "@vueuse/core";
 import {
   computed,
   reactive,
@@ -9,86 +8,88 @@ import {
   type MaybeRef,
   type MaybeRefOrGetter,
   type Ref,
-} from "vue";
-import type { Form, FormDataDefault } from "../types/form";
-import type { EntityPaths, PickEntity } from "../types/util";
-import type { ValidationStrategy } from "../types/validation";
-import { cloneRefValue } from "../utils/general";
-import { useFieldRegistry } from "./useFieldRegistry";
-import { useFormState } from "./useFormState";
-import { createSubformInterface, type SubformOptions } from "./useSubform";
-import { useValidation, type ValidationOptions } from "./useValidation";
-import { useSubmitHandler } from "./useSubmitHandler";
+} from 'vue'
+import type { Form, FormDataDefault } from '../types/form'
+import type { EntityPaths, PickEntity } from '../types/util'
+import type { ValidationStrategy } from '../types/validation'
+import { cloneRefValue } from '../utils/general'
+import { useFieldRegistry } from './useFieldRegistry'
+import { useFormState } from './useFormState'
+import { createSubformInterface, type SubformOptions } from './useSubform'
+import { useSubmitHandler } from './useSubmitHandler'
+import { useValidation, type ValidationOptions } from './useValidation'
 
 export interface UseFormOptions<T extends FormDataDefault>
   extends ValidationOptions<T> {
-  initialData: MaybeRefOrGetter<T>;
-  validationStrategy?: MaybeRef<ValidationStrategy>;
-  keepValuesOnUnmount?: MaybeRef<boolean>;
+  initialData: MaybeRefOrGetter<T>
+  validationStrategy?: MaybeRef<ValidationStrategy>
+  keepValuesOnUnmount?: MaybeRef<boolean>
 }
 
-export function useForm<T extends FormDataDefault>(options: UseFormOptions<T>) {
-  const initialData = computed(() => cloneRefValue(options.initialData));
+export function useForm<T extends FormDataDefault>(
+  options: UseFormOptions<T>,
+): Form<T> {
+  const initialData = computed(() => cloneRefValue(options.initialData))
 
-  const data = ref<T>(cloneRefValue(initialData)) as Ref<T>;
+  const data = ref<T>(cloneRefValue(initialData)) as Ref<T>
 
   const state = reactive({
     initialData,
     data,
-  });
+  })
 
   watch(
     initialData,
     (newValue) => {
-      state.data = cloneRefValue(newValue);
+      state.data = cloneRefValue(newValue)
     },
-    { flush: "sync" },
-  );
+    { flush: 'sync' },
+  )
 
-  const validationState = useValidation(state, options);
+  const validationState = useValidation(state, options)
   const fieldRegistry = useFieldRegistry(state, validationState, {
     keepValuesOnUnmount: options.keepValuesOnUnmount,
     onBlur: async (path: string) => {
-      if (unref(options.validationStrategy) === "onTouch") {
-        validationState.validateField(path);
+      if (unref(options.validationStrategy) === 'onTouch') {
+        validationState.validateField(path)
       }
     },
-  });
-  const formState = useFormState(fieldRegistry);
+  })
+  const formState = useFormState(fieldRegistry)
 
   const reset = () => {
-    data.value = cloneRefValue(initialData);
-    validationState.reset();
+    data.value = cloneRefValue(initialData)
+    validationState.reset()
     for (const field of fieldRegistry.fields.value) {
-      field.reset();
+      field.reset()
     }
-  };
+  }
 
   function getSubForm<K extends EntityPaths<T>>(
     path: K,
     subformOptions?: SubformOptions<PickEntity<T, K>>,
   ): Form<PickEntity<T, K>> {
-    return createSubformInterface(formInterface, path, options, subformOptions);
+    return createSubformInterface(formInterface, path, options, subformOptions)
   }
 
-  const formInterface: Omit<Form<T>, "submitHandler"> = {
+  const formInterface: Omit<Form<T>, 'submitHandler'> = {
     ...fieldRegistry,
     ...validationState,
     ...formState,
     reset,
     getSubForm,
-    initialData: toRef(state, "initialData") as Form<T>["initialData"],
-    data: toRef(state, "data") as Form<T>["data"],
-  };
+    initialData: toRef(state, 'initialData') as Form<T>['initialData'],
+    data: toRef(state, 'data') as Form<T>['data'],
+  }
 
-  const submitHandler = useSubmitHandler(formInterface, options);
+  const submitHandler = useSubmitHandler(formInterface, options)
 
-  if (unref(options.validationStrategy) === "onFormOpen") {
-    validationState.validateForm();
+  if (unref(options.validationStrategy) === 'onFormOpen') {
+    validationState.validateForm()
   }
 
   return {
     ...formInterface,
     submitHandler,
-  };
+  }
 }