@juleshry/vue-animejs 1.0.1 → 1.2.0

package/README.md

@@ -2,14 +2,20 @@
   <img src="./docs/src/public/icon-animated.svg" alt="vue-animejs" width="120" />
 
   <h1 align="center">vue-animejs</h1>
-  <p align="center">Vue 3 composables for <a href="https://animejs.com/">Anime.js</a> v4 — reactive animations that integrate naturally with Vue's reactivity system and component lifecycle.</p>
-  <p align="center"><a href="https://vue-animejs.juleshry.dev">📖 Documentation</a></p>
-  <p align="center"><a href="https://app.netlify.com/projects/vue-animejs/deploys"><img src="https://api.netlify.com/api/v1/badges/8017f5b4-47b7-45e4-a5d6-269d638a71ab/deploy-status" alt="Netlify Status" style="vertical-align: middle" /></a>&nbsp;&nbsp;<a href="https://ko-fi.com/C7O720SP29"><img src="https://ko-fi.com/img/githubbutton_sm.svg" alt="ko-fi" style="vertical-align: middle" /></a></p>
+  <p align="center">Vue 3 composables and directives for <a href="https://animejs.com/">Anime.js</a> v4 — reactive animations that integrate naturally with Vue's reactivity system and component lifecycle.</p>
+  <p align="center">
+    <a href="https://www.npmjs.com/package/@juleshry/vue-animejs"><img src="https://img.shields.io/npm/v/%40juleshry%2Fvue-animejs?label=npm&color=a1b858" alt="npm version" /></a>
+    <a href="https://www.npmjs.com/package/@juleshry/vue-animejs"><img src="https://img.shields.io/npm/dm/%40juleshry%2Fvue-animejs?color=50a36f" alt="npm downloads" /></a>
+    <a href="https://vue-animejs.juleshry.dev"><img src="https://img.shields.io/badge/docs%20%26%20demos-vue--animejs-4fc08d" alt="docs & demos" /></a>
+    <a href="https://github.com/juleshry/vue-animejs"><img src="https://img.shields.io/github/stars/juleshry/vue-animejs?style=flat&color=yellow" alt="GitHub stars" /></a>
+  </p>
+  <p align="center"><a href="https://app.netlify.com/projects/vue-animejs/deploys"><img src="https://api.netlify.com/api/v1/badges/8017f5b4-47b7-45e4-a5d6-269d638a71ab/deploy-status" alt="Netlify Status" /></a></p>
+  <p align="center"><a href="https://ko-fi.com/C7O720SP29"><img src="https://ko-fi.com/img/githubbutton_sm.svg" alt="ko-fi" /></a></p>
 </div>
 
 ## 🚀 Overview
 
-**vue-animejs** wraps Anime.js v4 as idiomatic Vue 3 composables. It integrates with Vue's reactivity system — pass a `ref` as a target or option and the animation updates automatically. Lifecycle cleanup is handled for you.
+**vue-animejs** wraps Anime.js v4 as idiomatic Vue 3 composables. It integrates with Vue's reactivity system — pass a `ref` as a target or option and the animation updates automatically. Lifecycle cleanup is handled for you, and every composable is safe to call during SSR (Nuxt, `@vue/server-renderer`) — Anime.js instances are only created once mounted in a browser.
 
 **Before** — raw Anime.js in a Vue component:
 
@@ -63,7 +69,7 @@ useAnimate(el, { translateX: 250, duration: 800 })
 - Anime.js 4+
 - @vueuse/core 14+
 
-## 🦄 Composables
+## 🦄 Composables & Directives
 
 | Composable       | Description                                       |
 |------------------|---------------------------------------------------|
@@ -80,306 +86,19 @@ useAnimate(el, { translateX: 250, duration: 800 })
 | `useSvgDrawable` | Animate SVG stroke drawing with the `draw` property |
 | `useText`        | Split text into animatable lines, words, and chars |
 
-## 🚀 Usage
-
-### `useAnimate`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useAnimate } from '@juleshry/vue-animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-const { play, pause } = useAnimate(el, {
-  translateX: 250,
-  duration: 800,
-  easing: 'easeInOutQuad',
-})
-</script>
-
-<template>
-  <div ref="el" />
-  <button @click="play">Play</button>
-  <button @click="pause">Pause</button>
-</template>
-```
-
-### `useTimer`
-
-```vue
-<script setup lang="ts">
-import { useTimer } from '@juleshry/vue-animejs'
-
-const { play, pause } = useTimer({
-  duration: 3000,
-  onUpdate: (self) => console.log(self.currentTime),
-})
-</script>
-```
-
-### `useTimeline`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useTimeline } from '@juleshry/vue-animejs'
-
-const box = useTemplateRef<HTMLElement>('box')
-
-const { add, play } = useTimeline({ loop: true })
-
-add(box, { translateX: 100 })
-add(box, { translateY: 50 }, '+=200')
-play()
-</script>
-```
-
-### `useRawAnimate`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useRawAnimate } from '@juleshry/vue-animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-// Returns the raw Anime.js JSAnimation instance directly
-const animation = useRawAnimate(el, { translateX: 250, duration: 800 })
-</script>
-
-<template>
-  <div ref="el" />
-</template>
-```
-
-### `useAnimatable`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useAnimatable } from '@juleshry/vue-animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-const { animatable } = useAnimatable(el, {
-  x: 0,
-  opacity: 1,
-})
-</script>
-```
-
-### `useWaapi`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useWaapi } from '@juleshry/vue-animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-const { play, pause } = useWaapi(el, {
-  translateX: 250,
-  duration: 800,
-  easing: 'easeInOutQuad',
-})
-</script>
-
-<template>
-  <div ref="el" />
-  <button @click="play">Play</button>
-  <button @click="pause">Pause</button>
-</template>
-```
-
-### `useSvg`
-
-> **Note:** `morphTo` requires a live DOM element. Add each target as a hidden `<path>`, pass the ref directly to `morphTo`, and wrap in a `computed` — `useTimeline.add()` accepts `MaybeRef<AnimationParams>` and resolves the computed after mount, when the target elements are available.
-
-```vue
-<script setup lang="ts">
-import { computed, useTemplateRef } from 'vue'
-import { useSvg, useTimeline } from '@juleshry/vue-animejs'
-
-const shape = useTemplateRef<SVGPathElement>('shape')
-const t_circle = useTemplateRef<SVGPathElement>('t-circle')
-const t_diamond = useTemplateRef<SVGPathElement>('t-diamond')
-
-const { morphTo } = useSvg()
-
-const { add } = useTimeline({
-  loop: true,
-  defaults: { duration: 1200, easing: 'easeInOutCubic' },
-  loopDelay: 500,
-})
-
-add(shape, computed(() => ({ d: morphTo(t_circle) })))
-  .add(shape, computed(() => ({ d: morphTo(t_diamond) })), '+=500')
-</script>
-
-<template>
-  <svg viewBox="0 0 100 100">
-    <path ref="shape" d="M 50 15 C 78 8, 95 28, 90 52 C 85 76, 68 90, 50 88 C 32 90, 15 76, 10 52 C 5 28, 22 8, 50 15 Z" />
-    <path ref="t-circle" d="M 50 10 C 72 10, 90 28, 90 50 C 90 72, 72 90, 50 90 C 28 90, 10 72, 10 50 C 10 28, 28 10, 50 10 Z" visibility="hidden" />
-    <path ref="t-diamond" d="M 50 5 C 54 32, 68 32, 95 50 C 68 68, 54 68, 50 95 C 46 68, 32 68, 5 50 C 32 32, 46 32, 50 5 Z" visibility="hidden" />
-  </svg>
-</template>
-```
-
-### `useSvgDrawable`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useAnimate, useSvgDrawable } from '@juleshry/vue-animejs'
-
-const circle_el = useTemplateRef<SVGCircleElement>('circle')
-
-const { drawable } = useSvgDrawable(circle_el)
-
-// draw values are normalised: 0 = hidden, 1 = fully drawn
-useAnimate(drawable, {
-  draw: ['0 0', '0.5 1', '0 1'],
-  duration: 1200,
-  easing: 'easeInOutQuad',
-})
-</script>
-
-<template>
-  <svg viewBox="0 0 100 100">
-    <circle ref="circle" cx="50" cy="50" r="40" fill="none" stroke="currentColor" stroke-width="4" />
-  </svg>
-</template>
-```
-
-### `useDraggable`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useDraggable } from '@juleshry/vue-animejs'
+**Directives** — declarative alternatives for element-bound animations:
 
-const el = useTemplateRef<HTMLElement>('el')
-
-const { disable, enable } = useDraggable(el, {
-  onGrab: () => console.log('grabbed'),
-  onDrag: () => console.log('dragging'),
-  onRelease: () => console.log('released'),
-})
-</script>
-
-<template>
-  <div ref="el" />
-  <button @click="disable">Disable</button>
-  <button @click="enable">Enable</button>
-</template>
-```
-
-### `useLayout`
-
-> **Note:** Vue's DOM updates are asynchronous. Use `await nextTick()` between the state change and `animate()` so Anime.js reads the updated positions.
-
-```vue
-<script setup lang="ts">
-import { nextTick, ref, useTemplateRef } from 'vue'
-import { useLayout } from '@juleshry/vue-animejs'
-
-const list = useTemplateRef<HTMLElement>('list')
-const { record, animate } = useLayout(list, {})
-
-const items = ref([1, 2, 3, 4, 5])
-
-async function shuffle() {
-  record()
-  items.value = [...items.value].sort(() => Math.random() - 0.5)
-  await nextTick()
-  animate({ duration: 600 })
-}
-</script>
-
-<template>
-  <ul ref="list">
-    <li v-for="item in items" :key="item">{{ item }}</li>
-  </ul>
-  <button @click="shuffle">Shuffle</button>
-</template>
-```
+| Directive        | Description                                      |
+|------------------|--------------------------------------------------|
+| `v-animate`      | Animate an element declaratively via template attribute |
+| `v-draggable`    | Make an element draggable declaratively |
+| `v-svg-drawable` | Animate SVG stroke drawing declaratively via the `draw` property |
+| `v-waapi`        | Animate via WAAPI declaratively |
+| `v-text-split`   | Split text into animatable lines, words, and chars declaratively |
 
-When you mutate the DOM directly with `classList.toggle`, the change is synchronous — no `nextTick` needed:
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useLayout } from '@juleshry/vue-animejs'
-
-const container = useTemplateRef<HTMLElement>('container')
-const { update } = useLayout(container, {})
-
-function toggleLayout() {
-  update(() => {
-    container.value!.classList.toggle('grid')
-  }, { duration: 600 })
-}
-</script>
-
-<template>
-  <div ref="container" class="grid">
-    <div v-for="i in 6" :key="i" class="item" />
-  </div>
-  <button @click="toggleLayout">Toggle layout</button>
-</template>
-```
-
-### `useScope`
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useAnimate, useScope } from '@juleshry/vue-animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-const { add, revert } = useScope({ mediaQuery: '(prefers-reduced-motion: no-preference)' })
-
-// Animations added via add() are automatically reverted when the scope reverts
-// or when the component unmounts
-add(scope => {
-  useAnimate(el, { translateX: 250, duration: 800 })
-})
-</script>
-
-<template>
-  <div ref="el" />
-  <button @click="revert">Revert</button>
-</template>
-```
-
-### `useText`
-
-> **Note:** `words`, `chars`, and `lines` are `ComputedRef<HTMLElement[]>` — they populate after mount and can be passed directly to `useAnimate`.
-
-```vue
-<script setup lang="ts">
-import { useTemplateRef } from 'vue'
-import { useAnimate, useText } from '@juleshry/vue-animejs'
-import { stagger } from 'animejs'
-
-const el = useTemplateRef<HTMLElement>('el')
-
-const { words, chars } = useText(el, { words: true, chars: true })
-
-// words and chars are ComputedRef<HTMLElement[]> — pass them directly as targets
-useAnimate(words, {
-  y: ['100%', '0%'],
-  duration: 600,
-  delay: stagger(50),
-})
-</script>
+## 🚀 Usage
 
-<template>
-  <p ref="el">Hello, world!</p>
-</template>
-```
+For full API docs and live demos, see **[the doc here](https://vue-animejs.juleshry.dev)**.
 
 ## 👨‍🚀 Contributors
 
@@ -399,9 +118,7 @@ See the [Contributing Guide](./CONTRIBUTING.md).
 ## 🗺️ TODO
 
 - [ ] Allow reactive refs inside option objects
-- [ ] Finish doc website
 - [ ] Add components
-- [ ] Add directives
 
 ## 📄 License
 

package/dist/composables/use-animatable.d.ts

@@ -1,11 +1,17 @@
-import { type AnimatableObject, type AnimatableParams } from "animejs";
-import { type DeepReadonly, type MaybeRef, type ShallowRef } from "vue";
+import { type Animatable, type AnimatableParams, type AnimatableProperty, type AnimatablePropertyParamsOptions } from "animejs";
+import { type MaybeRef, type ShallowRef } from "vue";
 import { type AnimationTargets } from "@src/utils/resolve-target.ts";
-export interface UseAnimatableReturn {
+/** The keys of `T` that represent animatable properties, excluding Anime.js's reserved config keys (`ease`, `duration`, `unit`, `modifier`, `composition`). */
+export type AnimatablePropertyKeys<T extends AnimatableParams> = Exclude<keyof T, keyof AnimatablePropertyParamsOptions>;
+/** An `AnimatableObject` narrowed to only the property setters/getters implied by `T`. */
+export type TypedAnimatableObject<T extends AnimatableParams> = Animatable & {
+    [K in AnimatablePropertyKeys<T>]: AnimatableProperty;
+};
+export interface UseAnimatableReturn<T extends AnimatableParams = AnimatableParams> {
     /** The underlying Anime.js animatable instance. `undefined` until the target is available. */
-    animatable: DeepReadonly<ShallowRef<AnimatableObject | undefined>>;
+    animatable: Readonly<ShallowRef<TypedAnimatableObject<T> | undefined>>;
     /** Cancels the animatable and restores all animated properties to their original values. */
-    revert: () => AnimatableObject | undefined;
+    revert: () => TypedAnimatableObject<T> | undefined;
 }
 /**
  * Wraps Anime.js `createAnimatable()` into a Vue composable. Reactively re-creates the animatable when the target or options change, and reverts it automatically on unmount.
@@ -13,5 +19,5 @@ export interface UseAnimatableReturn {
  * @param targets - The element(s) to make animatable. Accepts a template ref, a CSS selector, a DOM element, or a reactive ref to any of these.
  * @param options - Anime.js animatable parameters. Accepts a plain object or a reactive ref / computed. Defaults to `{}`.
  */
-export declare function useAnimatable(targets: AnimationTargets, options?: MaybeRef<AnimatableParams>): UseAnimatableReturn;
+export declare function useAnimatable<T extends AnimatableParams = AnimatableParams>(targets: AnimationTargets, options?: MaybeRef<T>): UseAnimatableReturn<T>;
 //# sourceMappingURL=use-animatable.d.ts.map

package/dist/composables/use-animatable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-animatable.d.ts","sourceRoot":"","sources":["../../src/composables/use-animatable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,gBAAgB,EAAuC,MAAM,SAAS,CAAA;AAC3G,OAAO,EAEL,KAAK,YAAY,EAEjB,KAAK,QAAQ,EAEb,KAAK,UAAU,EAIhB,MAAM,KAAK,CAAA;AAEZ,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,MAAM,WAAW,mBAAmB;IAClC,8FAA8F;IAC9F,UAAU,EAAE,YAAY,CAAC,UAAU,CAAC,gBAAgB,GAAG,SAAS,CAAC,CAAC,CAAA;IAClE,4FAA4F;IAC5F,MAAM,EAAE,MAAM,gBAAgB,GAAG,SAAS,CAAA;CAC3C;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAC3B,OAAO,EAAE,gBAAgB,EACzB,OAAO,GAAE,QAAQ,CAAC,gBAAgB,CAAM,GACvC,mBAAmB,CAkCrB"}
+{"version":3,"file":"use-animatable.d.ts","sourceRoot":"","sources":["../../src/composables/use-animatable.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,UAAU,EACf,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,EACvB,KAAK,+BAA+B,EAGrC,MAAM,SAAS,CAAA;AAChB,OAAO,EAIL,KAAK,QAAQ,EAEb,KAAK,UAAU,EAIhB,MAAM,KAAK,CAAA;AAEZ,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,+JAA+J;AAC/J,MAAM,MAAM,sBAAsB,CAAC,CAAC,SAAS,gBAAgB,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,+BAA+B,CAAC,CAAA;AAExH,0FAA0F;AAC1F,MAAM,MAAM,qBAAqB,CAAC,CAAC,SAAS,gBAAgB,IAAI,UAAU,GAAG;KAC1E,CAAC,IAAI,sBAAsB,CAAC,CAAC,CAAC,GAAG,kBAAkB;CACrD,CAAA;AAED,MAAM,WAAW,mBAAmB,CAAC,CAAC,SAAS,gBAAgB,GAAG,gBAAgB;IAChF,8FAA8F;IAC9F,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,CAAC,CAAA;IACtE,4FAA4F;IAC5F,MAAM,EAAE,MAAM,qBAAqB,CAAC,CAAC,CAAC,GAAG,SAAS,CAAA;CACnD;AAED;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,CAAC,SAAS,gBAAgB,GAAG,gBAAgB,EACzE,OAAO,EAAE,gBAAgB,EACzB,OAAO,GAAE,QAAQ,CAAC,CAAC,CAAW,GAC7B,mBAAmB,CAAC,CAAC,CAAC,CAkCxB"}

package/dist/composables/use-animate.d.ts

@@ -1,9 +1,9 @@
-import { type DeepReadonly, type MaybeRef, type ShallowRef } from "vue";
+import { type MaybeRef, type ShallowRef } from "vue";
 import { type JSAnimation, type AnimationParams } from "animejs";
 import { type AnimationTargets } from "@src/utils/resolve-target.ts";
 export interface UseAnimateReturn {
     /** The underlying Anime.js animation instance. `undefined` until the target is available. */
-    animation: DeepReadonly<ShallowRef<JSAnimation | undefined>>;
+    animation: Readonly<ShallowRef<JSAnimation | undefined>>;
     /** Starts or resumes the animation. */
     play: () => JSAnimation | undefined;
     /** Reverses playback direction. */
@@ -34,7 +34,7 @@ export interface UseAnimateReturn {
 /**
  * Wraps Anime.js `animate()` into a Vue composable. Reactively re-creates the animation when the target or options change, and cancels it automatically on unmount.
  *
- * @param _target - The element(s) to animate. Accepts a template ref, a CSS selector, a DOM element, or a reactive ref to any of these.
+ * @param _target - The element(s) to animate. Accepts a template ref, a CSS selector, a DOM element, a reactive ref to any of these, or an array of them.
  * @param _options - Anime.js animation parameters. Accepts a plain object or a reactive ref / computed. Defaults to `{}`.
  */
 export declare function useAnimate(_target: AnimationTargets, _options?: MaybeRef<AnimationParams>): UseAnimateReturn;

package/dist/composables/use-animate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-animate.d.ts","sourceRoot":"","sources":["../../src/composables/use-animate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,QAAQ,EAAE,KAAK,UAAU,EAA6C,MAAM,KAAK,CAAA;AAClH,OAAO,EAAE,KAAK,WAAW,EAA8B,KAAK,eAAe,EAAE,MAAM,SAAS,CAAA;AAE5F,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,MAAM,WAAW,gBAAgB;IAC/B,6FAA6F;IAC7F,SAAS,EAAE,YAAY,CAAC,UAAU,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC,CAAA;IAC5D,uCAAuC;IACvC,IAAI,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACnC,mCAAmC;IACnC,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACtC,oDAAoD;IACpD,KAAK,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACpC,iDAAiD;IACjD,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACtC,qDAAqD;IACrD,SAAS,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACxC,mCAAmC;IACnC,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,qDAAqD;IACrD,QAAQ,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACvC,mEAAmE;IACnE,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,2FAA2F;IAC3F,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,gHAAgH;IAChH,KAAK,EAAE,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,WAAW,GAAG,SAAS,CAAA;IACvD,wCAAwC;IACxC,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,KAAK,WAAW,GAAG,SAAS,CAAA;IACpH,sDAAsD;IACtD,OAAO,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,WAAW,GAAG,SAAS,CAAA;IACzD,uEAAuE;IACvE,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;CACvC;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,gBAAgB,EAAE,QAAQ,GAAE,QAAQ,CAAC,eAAe,CAAM,GAAG,gBAAgB,CAgGhH"}
+{"version":3,"file":"use-animate.d.ts","sourceRoot":"","sources":["../../src/composables/use-animate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAC/G,OAAO,EAAE,KAAK,WAAW,EAA8B,KAAK,eAAe,EAAE,MAAM,SAAS,CAAA;AAE5F,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,MAAM,WAAW,gBAAgB;IAC/B,6FAA6F;IAC7F,SAAS,EAAE,QAAQ,CAAC,UAAU,CAAC,WAAW,GAAG,SAAS,CAAC,CAAC,CAAA;IACxD,uCAAuC;IACvC,IAAI,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACnC,mCAAmC;IACnC,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACtC,oDAAoD;IACpD,KAAK,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACpC,iDAAiD;IACjD,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACtC,qDAAqD;IACrD,SAAS,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACxC,mCAAmC;IACnC,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,qDAAqD;IACrD,QAAQ,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACvC,mEAAmE;IACnE,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,2FAA2F;IAC3F,MAAM,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;IACrC,gHAAgH;IAChH,KAAK,EAAE,CAAC,SAAS,CAAC,EAAE,OAAO,KAAK,WAAW,GAAG,SAAS,CAAA;IACvD,wCAAwC;IACxC,IAAI,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,EAAE,cAAc,CAAC,EAAE,OAAO,GAAG,MAAM,KAAK,WAAW,GAAG,SAAS,CAAA;IACpH,sDAAsD;IACtD,OAAO,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,WAAW,GAAG,SAAS,CAAA;IACzD,uEAAuE;IACvE,OAAO,EAAE,MAAM,WAAW,GAAG,SAAS,CAAA;CACvC;AAED;;;;;GAKG;AACH,wBAAgB,UAAU,CAAC,OAAO,EAAE,gBAAgB,EAAE,QAAQ,GAAE,QAAQ,CAAC,eAAe,CAAM,GAAG,gBAAgB,CAgGhH"}

package/dist/composables/use-draggable.d.ts

@@ -1,9 +1,9 @@
-import { type DeepReadonly, type MaybeRef, type ShallowRef } from "vue";
+import { type MaybeRef, type ShallowRef } from "vue";
 import { type Draggable, type DraggableParams, type EasingParam } from "animejs";
 import { type AnimationTargets } from "@src/utils/resolve-target.ts";
 export interface UseDraggableReturn {
     /** The underlying Anime.js draggable instance. `undefined` until the target is available. */
-    draggable: DeepReadonly<ShallowRef<Draggable | undefined>>;
+    draggable: Readonly<ShallowRef<Draggable | undefined>>;
     /** Disables drag interactions without destroying the instance. */
     disable: () => void;
     /** Re-enables drag interactions after `disable()`. */

package/dist/composables/use-draggable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-draggable.d.ts","sourceRoot":"","sources":["../../src/composables/use-draggable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAS,KAAK,QAAQ,EAAY,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAElH,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,eAAe,EAAmB,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AACjG,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,MAAM,WAAW,kBAAkB;IACjC,6FAA6F;IAC7F,SAAS,EAAE,YAAY,CAAC,UAAU,CAAC,SAAS,GAAG,SAAS,CAAC,CAAC,CAAA;IAC1D,kEAAkE;IAClE,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,sDAAsD;IACtD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,gGAAgG;IAChG,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,kBAAkB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACvD,gGAAgG;IAChG,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,kBAAkB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACvD,wDAAwD;IACxD,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC5E,uDAAuD;IACvD,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC3E,wDAAwD;IACxD,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,4EAA4E;IAC5E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,wDAAwD;IACxD,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,gBAAgB,EAAE,OAAO,GAAE,QAAQ,CAAC,eAAe,CAAM,GAAG,kBAAkB,CA6EnH"}
+{"version":3,"file":"use-draggable.d.ts","sourceRoot":"","sources":["../../src/composables/use-draggable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAE/G,OAAO,EAAE,KAAK,SAAS,EAAE,KAAK,eAAe,EAAmB,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AACjG,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,MAAM,WAAW,kBAAkB;IACjC,6FAA6F;IAC7F,SAAS,EAAE,QAAQ,CAAC,UAAU,CAAC,SAAS,GAAG,SAAS,CAAC,CAAC,CAAA;IACtD,kEAAkE;IAClE,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,sDAAsD;IACtD,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,gGAAgG;IAChG,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,kBAAkB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACvD,gGAAgG;IAChG,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,kBAAkB,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IACvD,wDAAwD;IACxD,aAAa,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC5E,uDAAuD;IACvD,YAAY,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,GAAG,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;IAC3E,wDAAwD;IACxD,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,IAAI,CAAA;IACjB,4EAA4E;IAC5E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,wDAAwD;IACxD,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,gBAAgB,EAAE,OAAO,GAAE,QAAQ,CAAC,eAAe,CAAM,GAAG,kBAAkB,CA6EnH"}

package/dist/composables/use-layout.d.ts

@@ -1,9 +1,9 @@
 import { type MaybeComputedElementRef } from "@vueuse/core";
 import { type AutoLayout, type AutoLayoutParams, type DOMTargetSelector, type LayoutAnimationParams, type Timeline } from "animejs";
-import { type DeepReadonly, type MaybeRef, type ShallowRef } from "vue";
+import { type MaybeRef, type ShallowRef } from "vue";
 export interface UseLayoutReturn {
     /** The underlying Anime.js `AutoLayout` instance. `undefined` until the root element is available. */
-    layout: DeepReadonly<ShallowRef<AutoLayout | undefined>>;
+    layout: Readonly<ShallowRef<AutoLayout | undefined>>;
     /** Snapshots the current positions of all tracked children so the next layout change can be animated. */
     record: () => void;
     /** Animates all children from their recorded positions to their new positions. */

package/dist/composables/use-layout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-layout.d.ts","sourceRoot":"","sources":["../../src/composables/use-layout.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AAE3E,OAAO,EACL,KAAK,UAAU,EACf,KAAK,gBAAgB,EAErB,KAAK,iBAAiB,EACtB,KAAK,qBAAqB,EAC1B,KAAK,QAAQ,EACd,MAAM,SAAS,CAAA;AAChB,OAAO,EAAE,KAAK,YAAY,EAAS,KAAK,QAAQ,EAAY,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAElH,MAAM,WAAW,eAAe;IAC9B,sGAAsG;IACtG,MAAM,EAAE,YAAY,CAAC,UAAU,CAAC,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACxD,yGAAyG;IACzG,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,kFAAkF;IAClF,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,qBAAqB,KAAK,QAAQ,GAAG,SAAS,CAAA;IACjE,oGAAoG;IACpG,MAAM,EAAE,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,EAAE,MAAM,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACxF,oFAAoF;IACpF,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CACvB,IAAI,EAAE,QAAQ,CAAC,iBAAiB,CAAC,GAAG,uBAAuB,EAC3D,MAAM,GAAE,QAAQ,CAAC,gBAAgB,CAAM,GACtC,eAAe,CAyCjB"}
+{"version":3,"file":"use-layout.d.ts","sourceRoot":"","sources":["../../src/composables/use-layout.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AAErF,OAAO,EACL,KAAK,UAAU,EACf,KAAK,gBAAgB,EAErB,KAAK,iBAAiB,EACtB,KAAK,qBAAqB,EAC1B,KAAK,QAAQ,EACd,MAAM,SAAS,CAAA;AAChB,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAE/G,MAAM,WAAW,eAAe;IAC9B,sGAAsG;IACtG,MAAM,EAAE,QAAQ,CAAC,UAAU,CAAC,UAAU,GAAG,SAAS,CAAC,CAAC,CAAA;IACpD,yGAAyG;IACzG,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,kFAAkF;IAClF,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,qBAAqB,KAAK,QAAQ,GAAG,SAAS,CAAA;IACjE,oGAAoG;IACpG,MAAM,EAAE,CAAC,QAAQ,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK,IAAI,EAAE,MAAM,CAAC,EAAE,qBAAqB,KAAK,IAAI,CAAA;IACxF,oFAAoF;IACpF,MAAM,EAAE,MAAM,IAAI,CAAA;CACnB;AAED;;;;;GAKG;AACH,wBAAgB,SAAS,CACvB,IAAI,EAAE,QAAQ,CAAC,iBAAiB,CAAC,GAAG,uBAAuB,EAC3D,MAAM,GAAE,QAAQ,CAAC,gBAAgB,CAAM,GACtC,eAAe,CAyCjB"}

package/dist/composables/use-raw-animatable.d.ts

@@ -0,0 +1,17 @@
+import { type AnimatableObject, type AnimatableParams } from "animejs";
+import { type MaybeRef } from "vue";
+import { type AnimationTargets } from "@src/utils/resolve-target.ts";
+/** The Anime.js `AnimatableObject` instance returned by `useRawAnimatable`. */
+export type UseRawAnimatableReturn = AnimatableObject;
+/**
+ * Thin wrapper around Anime.js `createAnimatable()`. Resolves the target (unwrapping refs and Vue
+ * component refs via `.$el`) and immediately creates the animatable.
+ *
+ * SSR-safety is the caller's responsibility: invoke this from inside your own `onMounted` (it runs
+ * unconditionally and immediately, with no client-only guard), never at `setup()` top level.
+ *
+ * @param targets - The element(s) to make animatable. Accepts a template ref, a Vue component ref, a CSS selector, a DOM element, or a reactive ref to any of these.
+ * @param options - Anime.js animatable parameters. Accepts a plain object or a reactive ref / computed. Defaults to `{}`.
+ */
+export declare function useRawAnimatable(targets: AnimationTargets, options?: MaybeRef<AnimatableParams>): UseRawAnimatableReturn;
+//# sourceMappingURL=use-raw-animatable.d.ts.map

package/dist/composables/use-raw-animatable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-raw-animatable.d.ts","sourceRoot":"","sources":["../../src/composables/use-raw-animatable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,gBAAgB,EAAoB,MAAM,SAAS,CAAA;AACxF,OAAO,EAAE,KAAK,QAAQ,EAAS,MAAM,KAAK,CAAA;AAC1C,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,+EAA+E;AAC/E,MAAM,MAAM,sBAAsB,GAAG,gBAAgB,CAAA;AAErD;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,gBAAgB,EACzB,OAAO,GAAE,QAAQ,CAAC,gBAAgB,CAAM,GACvC,sBAAsB,CAQxB"}

package/dist/composables/use-raw-animate.d.ts

@@ -7,6 +7,9 @@ export type UseRawAnimateReturn = JSAnimation;
  * Thin wrapper around Anime.js `animate()`. Resolves the target (unwrapping refs and Vue component
  * refs via `.$el`) and immediately starts the animation.
  *
+ * SSR-safety is the caller's responsibility: invoke this from inside your own `onMounted` (it runs
+ * unconditionally and immediately, with no client-only guard), never at `setup()` top level.
+ *
  * @param _target - The element(s) to animate. Accepts a template ref, a Vue component ref, a CSS selector, a DOM element, or a reactive ref to any of these.
  * @param _options - Anime.js animation parameters. Accepts a plain object or a reactive ref / computed. Defaults to `{}`.
  */

package/dist/composables/use-raw-animate.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-raw-animate.d.ts","sourceRoot":"","sources":["../../src/composables/use-raw-animate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,eAAe,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AACzE,OAAO,EAAE,KAAK,QAAQ,EAAS,MAAM,KAAK,CAAA;AAC1C,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,uEAAuE;AACvE,MAAM,MAAM,mBAAmB,GAAG,WAAW,CAAA;AAE7C;;;;;;GAMG;AACH,wBAAgB,aAAa,CAC3B,OAAO,EAAE,gBAAgB,EACzB,QAAQ,GAAE,QAAQ,CAAC,eAAe,CAAM,GACvC,mBAAmB,CAQrB"}
+{"version":3,"file":"use-raw-animate.d.ts","sourceRoot":"","sources":["../../src/composables/use-raw-animate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,eAAe,EAAE,KAAK,WAAW,EAAE,MAAM,SAAS,CAAA;AACzE,OAAO,EAAE,KAAK,QAAQ,EAAS,MAAM,KAAK,CAAA;AAC1C,OAAO,EAAE,KAAK,gBAAgB,EAAiB,MAAM,8BAA8B,CAAA;AAEnF,uEAAuE;AACvE,MAAM,MAAM,mBAAmB,GAAG,WAAW,CAAA;AAE7C;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAC3B,OAAO,EAAE,gBAAgB,EACzB,QAAQ,GAAE,QAAQ,CAAC,eAAe,CAAM,GACvC,mBAAmB,CAQrB"}

package/dist/composables/use-scope.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-scope.d.ts","sourceRoot":"","sources":["../../src/composables/use-scope.ts"],"names":[],"mappings":"AACA,OAAO,EAAe,KAAK,KAAK,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,KAAK,QAAQ,EAAE,MAAM,SAAS,CAAA;AACpG,OAAO,EAAS,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAEtG,MAAM,WAAW,cAAc;IAC7B,gDAAgD;IAChD,KAAK,EAAE,QAAQ,CAAC,UAAU,CAAC,KAAK,GAAG,SAAS,CAAC,CAAC,CAAA;IAC9C,+FAA+F;IAC/F,GAAG,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IAClC,0IAA0I;IAC1I,cAAc,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IACjE,2GAA2G;IAC3G,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IACtC,qFAAqF;IACrF,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,QAAQ,KAAK,IAAI,CAAA;IACtD,0EAA0E;IAC1E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yEAAyE;IACzE,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,WAAW,CAAC,GAAG,cAAc,CA2EtE"}
+{"version":3,"file":"use-scope.d.ts","sourceRoot":"","sources":["../../src/composables/use-scope.ts"],"names":[],"mappings":"AACA,OAAO,EAAe,KAAK,KAAK,EAAE,KAAK,WAAW,EAAE,KAAK,WAAW,EAAE,KAAK,QAAQ,EAAE,MAAM,SAAS,CAAA;AACpG,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAE/G,MAAM,WAAW,cAAc;IAC7B,gDAAgD;IAChD,KAAK,EAAE,QAAQ,CAAC,UAAU,CAAC,KAAK,GAAG,SAAS,CAAC,CAAC,CAAA;IAC9C,+FAA+F;IAC/F,GAAG,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IAClC,0IAA0I;IAC1I,cAAc,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IACjE,2GAA2G;IAC3G,OAAO,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;IACtC,qFAAqF;IACrF,QAAQ,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,QAAQ,KAAK,IAAI,CAAA;IACtD,0EAA0E;IAC1E,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,yEAAyE;IACzE,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;;GAMG;AACH,wBAAgB,QAAQ,CAAC,MAAM,EAAE,QAAQ,CAAC,WAAW,CAAC,GAAG,cAAc,CA2EtE"}

package/dist/composables/use-svg-drawable.d.ts

@@ -1,12 +1,12 @@
 import { type DrawableSVGGeometry, type DOMTargetSelector } from "animejs";
 import { type MaybeComputedElementRef } from "@vueuse/core";
-import { type MaybeRef, type DeepReadonly, type ShallowRef } from "vue";
+import { type MaybeRef, type ShallowRef } from "vue";
 export interface UseSvgDrawableReturn {
     /**
      * The Anime.js drawable Proxy for the target element. `undefined` until the element is available.
      * Pass this ref — not the original template ref — as the `useAnimate` target to animate the `draw` property.
      */
-    drawable: DeepReadonly<ShallowRef<DrawableSVGGeometry | undefined>>;
+    drawable: Readonly<ShallowRef<DrawableSVGGeometry | undefined>>;
 }
 /**
  * Wraps an SVG geometry element in Anime.js's drawable Proxy. The proxy intercepts `setAttribute('draw', …)` calls and translates normalised `draw` values (`0`–`1`) into the correct `stroke-dasharray` / `stroke-dashoffset` updates. Pass the returned `drawable` ref as the target to `useAnimate`.

package/dist/composables/use-svg-drawable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-svg-drawable.d.ts","sourceRoot":"","sources":["../../src/composables/use-svg-drawable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,mBAAmB,EAAE,KAAK,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAC/E,OAAO,EAAE,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AAC3E,OAAO,EAAS,KAAK,QAAQ,EAAY,KAAK,YAAY,EAAE,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAGlH,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,QAAQ,EAAE,YAAY,CAAC,UAAU,CAAC,mBAAmB,GAAG,SAAS,CAAC,CAAC,CAAA;CACpE;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC,GAAG,uBAAuB,EAC7D,KAAK,GAAE,QAAQ,CAAC,MAAM,CAAK,EAC3B,GAAG,GAAE,QAAQ,CAAC,MAAM,CAAK,GACxB,oBAAoB,CAsBtB"}
+{"version":3,"file":"use-svg-drawable.d.ts","sourceRoot":"","sources":["../../src/composables/use-svg-drawable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,mBAAmB,EAAE,KAAK,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAC/E,OAAO,EAAY,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AACrF,OAAO,EAAkB,KAAK,QAAQ,EAAmB,KAAK,UAAU,EAA4B,MAAM,KAAK,CAAA;AAG/G,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,QAAQ,EAAE,QAAQ,CAAC,UAAU,CAAC,mBAAmB,GAAG,SAAS,CAAC,CAAC,CAAA;CAChE;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAC5B,MAAM,EAAE,QAAQ,CAAC,iBAAiB,CAAC,GAAG,uBAAuB,EAC7D,KAAK,GAAE,QAAQ,CAAC,MAAM,CAAK,EAC3B,GAAG,GAAE,QAAQ,CAAC,MAAM,CAAK,GACxB,oBAAoB,CAsBtB"}

package/dist/composables/use-svg.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-svg.d.ts","sourceRoot":"","sources":["../../src/composables/use-svg.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,aAAa,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AACpE,OAAO,EAAE,KAAK,QAAQ,EAAS,MAAM,KAAK,CAAA;AAE1C,MAAM,WAAW,YAAY;IAC3B,+IAA+I;IAC/I,OAAO,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,aAAa,CAAA;IACtF,yKAAyK;IACzK,gBAAgB,EAAE,CAChB,IAAI,EAAE,QAAQ,CAAC,YAAY,GAAG,IAAI,CAAC,EACnC,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KACtB,UAAU,CAAC,OAAO,GAAG,CAAC,gBAAgB,CAAC,CAAA;CAC7C;AAED;;;;GAIG;AACH,wBAAgB,MAAM,IAAI,YAAY,CAkBrC"}
+{"version":3,"file":"use-svg.d.ts","sourceRoot":"","sources":["../../src/composables/use-svg.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,KAAK,aAAa,EAAE,KAAK,YAAY,EAAE,MAAM,SAAS,CAAA;AACpE,OAAO,EAAE,KAAK,QAAQ,EAAS,MAAM,KAAK,CAAA;AAE1C,MAAM,WAAW,YAAY;IAC3B,+IAA+I;IAC/I,OAAO,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,YAAY,CAAC,EAAE,SAAS,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,aAAa,CAAA;IACtF,yKAAyK;IACzK,gBAAgB,EAAE,CAChB,IAAI,EAAE,QAAQ,CAAC,YAAY,GAAG,IAAI,CAAC,EACnC,MAAM,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KACtB,UAAU,CAAC,OAAO,GAAG,CAAC,gBAAgB,CAAC,CAAA;CAC7C;AAED;;;;GAIG;AACH,wBAAgB,MAAM,IAAI,YAAY,CAoBrC"}

package/dist/composables/use-text.d.ts

@@ -1,9 +1,9 @@
 import { type TextSplitter, type TextSplitterParams } from "animejs";
 import { type MaybeComputedElementRef } from "@vueuse/core";
-import { type ComputedRef, type DeepReadonly, type MaybeRef, type ShallowRef } from "vue";
+import { type ComputedRef, type MaybeRef, type ShallowRef } from "vue";
 export interface UseTextReturn {
     /** The underlying Anime.js `TextSplitter` instance. `undefined` until the target is available. */
-    splitter: DeepReadonly<ShallowRef<TextSplitter | undefined>>;
+    splitter: Readonly<ShallowRef<TextSplitter | undefined>>;
     /** Reactive array of `<span>` elements representing each line after splitting. */
     lines: ComputedRef<HTMLElement[]>;
     /** Reactive array of `<span>` elements representing each word after splitting. */

package/dist/composables/use-text.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-text.d.ts","sourceRoot":"","sources":["../../src/composables/use-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,YAAY,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAC/E,OAAO,EAAE,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AAE3E,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,QAAQ,EACb,KAAK,UAAU,EAChB,MAAM,KAAK,CAAA;AAEZ,MAAM,WAAW,aAAa;IAC5B,kGAAkG;IAClG,QAAQ,EAAE,YAAY,CAAC,UAAU,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAA;IAC5D,kFAAkF;IAClF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,kFAAkF;IAClF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,uFAAuF;IACvF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,kFAAkF;IAClF,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,qGAAqG;IACrG,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CACrB,OAAO,EAAE,QAAQ,CAAC,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,WAAW,EAAE,CAAC,GAAG,uBAAuB,EAC5F,OAAO,CAAC,EAAE,QAAQ,CAAC,kBAAkB,CAAC,GACrC,aAAa,CA0Cf"}
+{"version":3,"file":"use-text.d.ts","sourceRoot":"","sources":["../../src/composables/use-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,KAAK,YAAY,EAAE,KAAK,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAC/E,OAAO,EAAY,KAAK,uBAAuB,EAAkB,MAAM,cAAc,CAAA;AAErF,OAAO,EAQL,KAAK,WAAW,EAChB,KAAK,QAAQ,EACb,KAAK,UAAU,EAChB,MAAM,KAAK,CAAA;AAEZ,MAAM,WAAW,aAAa;IAC5B,kGAAkG;IAClG,QAAQ,EAAE,QAAQ,CAAC,UAAU,CAAC,YAAY,GAAG,SAAS,CAAC,CAAC,CAAA;IACxD,kFAAkF;IAClF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,kFAAkF;IAClF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,uFAAuF;IACvF,KAAK,EAAE,WAAW,CAAC,WAAW,EAAE,CAAC,CAAA;IACjC,kFAAkF;IAClF,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,qGAAqG;IACrG,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CACrB,OAAO,EAAE,QAAQ,CAAC,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,WAAW,EAAE,CAAC,GAAG,uBAAuB,EAC5F,OAAO,CAAC,EAAE,QAAQ,CAAC,kBAAkB,CAAC,GACrC,aAAa,CA0Cf"}