feat: offer both modes of destructuring

logaretm · Nov 25, 2023 · b25ace4 · b25ace4
1 parent 830b636
commit b25ace4
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 5 deletions.
diff --git a/packages/vee-validate/src/types/forms.ts b/packages/vee-validate/src/types/forms.ts
@@ -326,5 +326,5 @@ export interface FormContext<TValues extends GenericObject = GenericObject, TOut
   >(
     path: MaybeRefOrGetter<TPath>,
     config?: Partial<InputBindsConfig<TValue, TExtras>> | LazyInputBindsConfig<TValue, TExtras>,
-  ): [Ref<TValue>, Ref<BaseFieldProps & TExtras>];
+  ): { model: Ref<TValue>; props: Ref<BaseFieldProps & TExtras> } & [Ref<TValue>, Ref<BaseFieldProps & TExtras>];
 }
diff --git a/packages/vee-validate/src/useForm.ts b/packages/vee-validate/src/useForm.ts
@@ -62,6 +62,7 @@ import {
   normalizeErrorItem,
   omit,
   debounceNextTick,
+  makeDestructurable,
 } from './utils';
 import { FormContextKey } from './symbols';
 import { validateTypedSchema, validateObjectSchema } from './validate';
@@ -1010,10 +1011,15 @@ export function useForm<
       return base as BaseFieldProps & TExtras;
     });
 
-    return [createModel(path, () => evalConfig().validateOnModelUpdate ?? true), props] as [
-      Ref<TValue>,
-      Ref<BaseFieldProps & TExtras>,
-    ];
+    const model = createModel(path, () => evalConfig().validateOnModelUpdate ?? true);
+
+    return makeDestructurable(
+      {
+        model,
+        props,
+      },
+      [model, props] as [Ref<TValue>, Ref<BaseFieldProps & TExtras>],
+    );
   }
 
   return {

diff --git a/packages/vee-validate/src/utils/common.ts b/packages/vee-validate/src/utils/common.ts
@@ -359,3 +359,27 @@ export function debounceNextTick<
     return new Promise<TResult>(resolve => resolves.push(resolve));
   };
 }
+
+// https://github.com/vueuse/vueuse/blob/main/packages/shared/makeDestructurable/index.ts
+export function makeDestructurable<T extends Record<string, unknown>, A extends readonly any[]>(obj: T, arr: A): T & A {
+  if (typeof Symbol !== 'undefined') {
+    const clone = { ...obj };
+
+    Object.defineProperty(clone, Symbol.iterator, {
+      enumerable: false,
+      value() {
+        let index = 0;
+        return {
+          next: () => ({
+            value: arr[index++],
+            done: index > arr.length,
+          }),
+        };
+      },
+    });
+
+    return clone as T & A;
+  } else {
+    return Object.assign([...arr], obj) as unknown as T & A;
+  }
+}