@teamnovu/kit-vue-forms 0.1.16 → 0.1.18

package/src/composables/useSubmitHandler.ts

@@ -0,0 +1,29 @@
+import type { Awaitable, MaybeRef } from '@vueuse/core'
+import { unref } from 'vue'
+import type { Form, FormDataDefault } from '../types/form'
+import type { ValidationStrategy } from '../types/validation'
+
+interface SubmitHandlerOptions {
+  validationStrategy?: MaybeRef<ValidationStrategy>
+}
+
+export function useSubmitHandler<T extends FormDataDefault>(
+  form: Omit<Form<T>, 'submitHandler'>,
+  options: SubmitHandlerOptions,
+) {
+  return (onSubmit: (data: T) => Awaitable<void>) => {
+    return async (event: SubmitEvent) => {
+      event.preventDefault()
+
+      if (unref(options.validationStrategy) !== 'none') {
+        await form.validateForm()
+      }
+
+      if (!form.isValid.value) {
+        return
+      }
+
+      await onSubmit(form.data.value)
+    }
+  }
+}

package/src/types/form.ts

@@ -80,5 +80,5 @@ export interface Form<T extends FormDataDefault> {
   getSubForm: <P extends EntityPaths<T>>(
     path: P,
     options?: SubformOptions<PickEntity<T, P>>,
-  ) => Form<PickEntity<T, P>>
+  ) => Omit<Form<PickEntity<T, P>>, 'submitHandler'>
 }

package/src/utils/path.ts

@@ -1,21 +1,21 @@
-import { computed, isRef, unref, type MaybeRef } from "vue";
-import type { Paths, PickProps, SplitPath } from "../types/util";
-import type { ErrorBag, ValidationErrors } from "../types/validation";
-import type { FormField } from "../types/form";
+import { computed, isRef, unref, type MaybeRef } from 'vue'
+import type { Paths, PickProps, SplitPath } from '../types/util'
+import type { ErrorBag, ValidationErrors } from '../types/validation'
+import type { FormField } from '../types/form'
 
 export function splitPath(path: string): string[] {
-  if (path === "") {
-    return [];
+  if (path === '') {
+    return []
   }
-  return path.split(/\s*\.\s*/).filter(Boolean);
+  return path.split(/\s*\.\s*/).filter(Boolean)
 }
 
 export function existsPath<T, K extends Paths<T>>(
   obj: T,
   path: K | SplitPath<K>,
 ): boolean {
-  const splittedPath = Array.isArray(path) ? path : splitPath(path) as SplitPath<K>;
-  return !!getNestedValue(obj, splittedPath.slice(0, -1) as SplitPath<K>);
+  const splittedPath = Array.isArray(path) ? path : splitPath(path) as SplitPath<K>
+  return !!getNestedValue(obj, splittedPath.slice(0, -1) as SplitPath<K>)
 }
 
 export function existsFieldPath<T, K extends Paths<T>>(field: FormField<T, K>) {
@@ -26,11 +26,11 @@ export function getNestedValue<T, K extends Paths<T>>(
   obj: T,
   path: K | SplitPath<K>,
 ) {
-  const splittedPath = Array.isArray(path) ? path : splitPath(path);
+  const splittedPath = Array.isArray(path) ? path : splitPath(path)
   return splittedPath.reduce(
     (current, key) => current?.[key],
     obj as Record<string, never>,
-  ) as PickProps<T, K>;
+  ) as PickProps<T, K>
 }
 
 export function setNestedValue<T, K extends Paths<T>>(
@@ -38,31 +38,31 @@ export function setNestedValue<T, K extends Paths<T>>(
   path: K | SplitPath<K>,
   value: PickProps<T, K>,
 ): void {
-  const keys = Array.isArray(path) ? path : splitPath(path);
+  const keys = Array.isArray(path) ? path : splitPath(path)
 
-  const lastKey = keys.at(-1)!;
+  const lastKey = keys.at(-1)!
 
   if (!lastKey) {
     if (!isRef(obj)) {
       // We cannot do anything here as we have nothing we can assign to
-      return;
+      return
     }
 
-    obj.value = value;
+    obj.value = value
   } else {
     const target = keys.slice(0, -1).reduce(
       (current, key) => {
         if (current?.[key] === undefined) {
           // Create the nested object if it doesn't exist
-          current[key] = {};
+          current[key] = {}
         }
-        return current?.[key];
+        return current?.[key]
       },
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       unref(obj) as Record<string, any>,
-    );
+    )
 
-    target[lastKey] = value;
+    target[lastKey] = value
   }
 }
 
@@ -72,58 +72,57 @@ export const getLens = <T, K extends Paths<T>>(
 ) => {
   return computed({
     get() {
-      return getNestedValue(unref(data), unref(key));
+      return getNestedValue(unref(data), unref(key))
     },
     set(value: PickProps<T, K>) {
-      setNestedValue(data, unref(key), value);
+      setNestedValue(data, unref(key), value)
     },
-  });
-};
+  })
+}
 
 type JoinPath<
   Base extends string,
   Sub extends string,
-> = `${Base}${Base extends "" ? "" : Sub extends "" ? "" : "."}${Sub}`;
+> = `${Base}${Base extends '' ? '' : Sub extends '' ? '' : '.'}${Sub}`
 export function joinPath<Base extends string, Sub extends string>(
   basePath: Base,
   subPath: Sub,
 ): JoinPath<Base, Sub> {
   if (!basePath && !subPath) {
-    return "" as JoinPath<Base, Sub>;
+    return '' as JoinPath<Base, Sub>
   }
 
   if (!basePath && subPath) {
-    return subPath as JoinPath<Base, Sub>;
+    return subPath as JoinPath<Base, Sub>
   }
 
   if (!subPath && basePath) {
-    return basePath as JoinPath<Base, Sub>;
+    return basePath as JoinPath<Base, Sub>
   }
 
-  return `${basePath}.${subPath}` as JoinPath<Base, Sub>;
+  return `${basePath}.${subPath}` as JoinPath<Base, Sub>
 }
 
 export function filterErrorsForPath(errors: ErrorBag, path: string): ErrorBag {
   // Handle empty path - return all errors
   if (!path) {
-    return errors;
+    return errors
   }
 
-  const pathPrefix = `${path}.`;
-  const filteredPropertyErrors: Record<string, ValidationErrors> =
-    Object.fromEntries(
-      Object.entries(errors.propertyErrors)
-        .filter(([errorPath]) => {
-          return errorPath.startsWith(pathPrefix);
-        })
-        .map(([errorPath, errorMessages]) => [
-          errorPath.slice(pathPrefix.length),
-          errorMessages,
-        ]),
-    );
+  const pathPrefix = `${path}.`
+  const filteredPropertyErrors: Record<string, ValidationErrors> = Object.fromEntries(
+    Object.entries(errors.propertyErrors)
+      .filter(([errorPath]) => {
+        return errorPath.startsWith(pathPrefix)
+      })
+      .map(([errorPath, errorMessages]) => [
+        errorPath.slice(pathPrefix.length),
+        errorMessages,
+      ]),
+  )
 
   return {
     general: errors.general, // Keep general errors
     propertyErrors: filteredPropertyErrors,
-  };
+  }
 }