docs: added useAnimations docs

docs/.vitepress/config.ts

@@ -63,7 +63,10 @@ export default defineConfig({
           { text: 'Introduction', link: '/cientos/' },
           {
             text: 'Abstractions',
-            items: [{ text: 'Text3D', link: '/cientos/abstractions/text-3d' }],
+            items: [
+              { text: 'Text3D', link: '/cientos/abstractions/text-3d' },
+              { text: 'useAnimations', link: '/cientos/abstractions/use-animations' },
+            ],
           },
           {
             text: 'Controls',

docs/cientos/abstractions/use-animations.md

@@ -0,0 +1,21 @@
+# useAnimations <Badge type="warning" text="^1.5.0" />
+
+`useAnimation` is a composable that returns a `shallowReactive` with all the models actions based on the animations provided. It is a wrapper around the [AnimationMixer](https://threejs.org/docs/#api/en/animation/AnimationMixer) class.
+
+<StackBlitzEmbed projectId="tresjs-use-animations" />
+
+## Usage
+
+```ts
+import { useAnimations } from '@tresjs/cientos'
+
+const { scene: model, animations } = await useGLTF('/models/ugly-naked-bunny.gltf')
+
+// Animations [ { name: 'Greeting'}, { name: 'Idle' } ]
+
+const { actions, mixer } = useAnimations(animations, model)
+
+let currentAction = actions.Greeting
+
+currentAction.play()
+```