@tanstack/vue-query 4.13.0 → 4.13.2

package/build/umd/index.development.js

@@ -3121,6 +3121,9 @@
   function isQueryKey(value) {
     return Array.isArray(value);
   }
+  function isMutationKey(value) {
+    return Array.isArray(value);
+  }
   function updateState(state, update) {
     Object.keys(state).forEach(key => {
       state[key] = update[key];
@@ -4727,12 +4730,13 @@
   }
 
   function useMutation(arg1, arg2, arg3) {
-    var _options$queryClient;
+    var _options$value$queryC;
 
-    const options = parseMutationArgs(arg1, arg2, arg3);
-    const queryClient = (_options$queryClient = options.queryClient) != null ? _options$queryClient : useQueryClient(options.queryClientKey);
-    const defaultedOptions = queryClient.defaultMutationOptions(options);
-    const observer = new MutationObserver(queryClient, defaultedOptions);
+    const options = vueDemi.computed(() => {
+      return parseMutationArgs(arg1, arg2, arg3);
+    });
+    const queryClient = (_options$value$queryC = options.value.queryClient) != null ? _options$value$queryC : useQueryClient(options.value.queryClientKey);
+    const observer = new MutationObserver(queryClient, queryClient.defaultMutationOptions(options.value));
     const state = vueDemi.reactive(observer.getCurrentResult());
     const unsubscribe = observer.subscribe(result => {
       updateState(state, result);
@@ -4743,8 +4747,8 @@
       });
     };
 
-    vueDemi.watch([() => arg1, () => arg2, () => arg3], () => {
-      observer.setOptions(queryClient.defaultMutationOptions(parseMutationArgs(arg1, arg2, arg3)));
+    vueDemi.watch(options, () => {
+      observer.setOptions(queryClient.defaultMutationOptions(options.value));
     }, {
       deep: true
     });
@@ -4759,24 +4763,27 @@
     };
   }
   function parseMutationArgs(arg1, arg2, arg3) {
-    let options = arg1;
-
-    if (isQueryKey(arg1)) {
-      if (typeof arg2 === 'function') {
-        options = { ...arg3,
-          mutationKey: arg1,
-          mutationFn: arg2
+    const plainArg1 = vueDemi.isRef(arg1) ? arg1.value : arg1;
+    const plainArg2 = vueDemi.isRef(arg2) ? arg2.value : arg2;
+    let options = plainArg1;
+
+    if (isMutationKey(plainArg1)) {
+      if (typeof plainArg2 === 'function') {
+        const plainArg3 = vueDemi.isRef(arg3) ? arg3.value : arg3;
+        options = { ...plainArg3,
+          mutationKey: plainArg1,
+          mutationFn: plainArg2
         };
       } else {
-        options = { ...arg2,
-          mutationKey: arg1
+        options = { ...plainArg2,
+          mutationKey: plainArg1
         };
       }
     }
 
-    if (typeof arg1 === 'function') {
-      options = { ...arg2,
-        mutationFn: arg1
+    if (typeof plainArg1 === 'function') {
+      options = { ...plainArg2,
+        mutationFn: plainArg1
       };
     }