pathLength doesn't work

[imfenghuang]

System info

Mac Chrome v130.0.6723.117
@vueuse/motion: ^2.2.6"

Reproduction

https://stackblitz.com/edit/vitejs-vite-lpx42y?file=src%2FApp.vue

Describe the bug

<svg
      xmlns="http://www.w3.org/2000/svg"
      viewBox="0 0 100 60"
      fill="none"
      stroke="currentColor"
      stroke-width="2"
      stroke-linecap="round"
      stroke-linejoin="round"
      stroke-dasharray="10"
    >
      
      <path
        v-motion
        d="M 0,20 h100"
        strokeDasharray="10"
        :initial="{opacity: 0.1, pathLength: 10}"
        :hovered="{
          opacity: 1,
          pathLength: 100,
          transition: {
            duration: 1000,
          },
        }"
      />
</svg>

the opacity animation can work, however the pathLength animation doesn't work.

Additional context

No response

Logs

No response