fix: use toRaw when cloning proxy object (#221)

vueuse · Aug 28, 2024 · 47ad58d · 47ad58d
1 parent a33c5b9
commit 47ad58d
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/src/directive/index.ts b/src/directive/index.ts
@@ -1,6 +1,6 @@
 import type { Directive, DirectiveBinding, Ref, VNode } from 'vue'
 import defu from 'defu'
-import { ref, unref } from 'vue'
+import { ref, toRaw, unref } from 'vue'
 import { motionState } from '../features/state'
 import type { MotionInstance, MotionVariants } from '../types'
 import { useMotion } from '../useMotion'
@@ -21,7 +21,7 @@ export function directive<T extends string>(
       motionState[key].stop()
 
     // We deep copy presets to prevent global mutation
-    const variantsObject = isPreset ? structuredClone(variants || {}) : variants || {}
+    const variantsObject = isPreset ? structuredClone(toRaw(variants) || {}) : variants || {}
 
     // Initialize variants with argument
     const variantsRef = ref(variantsObject) as Ref<MotionVariants<T>>