@tanstack/vue-query 4.13.0 → 4.13.1

package/build/umd/index.development.js

@@ -3121,6 +3121,9 @@
   function isQueryKey(value) {
     return Array.isArray(value);
   }
+  function isMutationKey(value) {
+    return Array.isArray(vueDemi.isRef(value) ? value.value : 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
     });
@@ -4761,11 +4765,14 @@
   function parseMutationArgs(arg1, arg2, arg3) {
     let options = arg1;
 
-    if (isQueryKey(arg1)) {
-      if (typeof arg2 === 'function') {
-        options = { ...arg3,
+    if (isMutationKey(arg1)) {
+      const plainFn = vueDemi.isRef(arg2) ? arg2.value : arg2;
+      const plainOptions = vueDemi.isRef(arg3) ? arg3.value : arg3;
+
+      if (typeof plainFn === 'function') {
+        options = { ...plainOptions,
           mutationKey: arg1,
-          mutationFn: arg2
+          mutationFn: plainFn
         };
       } else {
         options = { ...arg2,
@@ -4774,9 +4781,12 @@
       }
     }
 
-    if (typeof arg1 === 'function') {
-      options = { ...arg2,
-        mutationFn: arg1
+    const plainFn = vueDemi.isRef(arg1) ? arg1.value : arg1;
+    const plainOptions = vueDemi.isRef(arg2) ? arg2.value : arg2;
+
+    if (typeof plainFn === 'function') {
+      options = { ...plainOptions,
+        mutationFn: plainFn
       };
     }