Loader example

[1forh]

Heyo! Great idea for a lib. Trying it out in my project.

I was wondering what the intention was for the documentation examples. Are we meant to just copy this and use it in our own project? If I copy this, it just outputs 1 circle that does the animation. If I copy it 3 times, it just does the animation at the same time for all 3. How do I make it stagger as you have in the example? Is there a repo for the Tinymotion website?

<template>
    <Motion
        :auto="[
            'scale-0 opacity-0',
            'scale-100 opacity-100'
        ]"
        :options="{
            repeat: true,
            duration: 500,
            factor: 4,
            skip: 1,
            instantRollback: true,
        }"
        class="h-6 w-6 bg-indigo-600 rounded-full"
    />
</template>

I definitely understand that the documentation is a work in progress. I would be grateful for any pointers. Thanks so much!

[lishangqiu]

A bit late, but for me, what worked was putting elements inside the motion block as children.

<template>
    <Motion :click="['scale-100','scale-110']" :options="{delay: 0,duration: 900}">
      <button class="rounded-full border-4 border-red-800 mx-1 w-16 h-16 bg-red-300">
      </button>
    </Motion>
</template>