use-scroll-animate 6.0.1 → 6.1.1

package/dist/solid.js

@@ -1,12 +1,13 @@
 import { createRenderEffect, onMount, onCleanup } from 'solid-js';
-import { c as createScrollAnimate } from './chunks/core-mV_TPgG_.js';
-import { s as staggerChildren } from './chunks/stagger-BFAhKknX.js';
+import { c as createScrollAnimate } from './chunks/core-D7cVumUu.js';
+import { s as staggerChildren } from './chunks/stagger-DtMKo2SK.js';
+import './chunks/presets-BYBVJVeP.js';
 
 /**
- * use-scroll-animate - Solid integration
+ * motionary - Solid integration
  *
  * ```tsx
- * import { scrollAnimate, scrollStagger, useScrollAnimate } from 'use-scroll-animate/solid';
+ * import { scrollAnimate, scrollStagger, useScrollAnimate } from 'motionary/solid';
  * false && scrollAnimate; // keep the directive import (TypeScript)
  *
  * <div use:scrollAnimate={{ animation: 'zoom-in' }}>…</div>

package/dist/solid.js.map

@@ -1 +1 @@
-{"version":3,"file":"solid.js","sources":["../src/solid.ts"],"sourcesContent":["/**\n * use-scroll-animate - Solid integration\n *\n * ```tsx\n * import { scrollAnimate, scrollStagger, useScrollAnimate } from 'use-scroll-animate/solid';\n * false && scrollAnimate; // keep the directive import (TypeScript)\n *\n * <div use:scrollAnimate={{ animation: 'zoom-in' }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * <div ref={useScrollAnimate({ animation: 'fade-in-up' })}>…</div>\n * ```\n *\n * `solid-js` is an optional peer dependency (only needed for this entry).\n */\n\nimport { createRenderEffect, onCleanup, onMount } from 'solid-js';\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface SolidScrollAnimateOptions extends AnimateOptions {\n  instance?: ScrollAnimateInstance;\n}\nexport interface SolidScrollStaggerOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\ndeclare module 'solid-js' {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface Directives {\n      scrollAnimate: SolidScrollAnimateOptions | true;\n      scrollStagger: SolidScrollStaggerOptions | true;\n    }\n  }\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nfunction read<T>(accessor?: () => T | true | undefined): T {\n  const v = accessor?.();\n  return (v && v !== true ? v : {}) as T;\n}\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest options' version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Directive: `<div use:scrollAnimate={{ animation: 'fade-in' }} />`.\n * 4.0.1: the accessor is tracked — when signals it reads change, callbacks\n * update right away and the other options are re-applied if the element has\n * not animated yet (no manual `refresh()` needed).\n */\nexport function scrollAnimate(el: Element, accessor?: () => SolidScrollAnimateOptions | true | undefined): void {\n  let latest: SolidScrollAnimateOptions = {};\n  let mounted = false;\n  let sa: ScrollAnimateInstance | null = null;\n  const apply = () => {\n    const { instance, ...opts } = latest;\n    const record = sa?.getObservedElements().find((r) => r.element === el);\n    if (sa && record?.animated) return; // finished: callbacks stay live\n    sa?.unobserve(el);\n    sa = getInstance(instance);\n    sa.observe(el, liveCallbacks(opts, () => latest));\n  };\n  createRenderEffect(() => {\n    latest = read<SolidScrollAnimateOptions>(accessor);\n    if (mounted) apply();\n  });\n  // Wait until the element is in the document (directives/refs run before insertion).\n  onMount(() => {\n    mounted = true;\n    apply();\n  });\n  onCleanup(() => sa?.unobserve(el));\n}\n\n/** Directive: `<ul use:scrollStagger={{ stagger: 60, observeChildren: true }} />` */\nexport function scrollStagger(el: Element, accessor?: () => SolidScrollStaggerOptions | true | undefined): void {\n  const { instance, ...opts } = read<SolidScrollStaggerOptions>(accessor);\n  let stop: (() => void) | undefined;\n  onMount(() => {\n    stop = staggerChildren(el, opts, getInstance(instance));\n  });\n  onCleanup(() => stop?.());\n}\n\n/** Primitive returning a `ref` callback: `<div ref={useScrollAnimate({ animation: 'fade-in-up' })} />` */\nexport function useScrollAnimate(options: SolidScrollAnimateOptions = {}): (el: Element) => void {\n  let el: Element | undefined;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  onMount(() => el && sa.observe(el, opts));\n  onCleanup(() => el && sa.unobserve(el));\n  return (node: Element) => {\n    el = node;\n  };\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"solid.js","sources":["../src/solid.ts"],"sourcesContent":["/**\n * motionary - Solid integration\n *\n * ```tsx\n * import { scrollAnimate, scrollStagger, useScrollAnimate } from 'motionary/solid';\n * false && scrollAnimate; // keep the directive import (TypeScript)\n *\n * <div use:scrollAnimate={{ animation: 'zoom-in' }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * <div ref={useScrollAnimate({ animation: 'fade-in-up' })}>…</div>\n * ```\n *\n * `solid-js` is an optional peer dependency (only needed for this entry).\n */\n\nimport { createRenderEffect, onCleanup, onMount } from 'solid-js';\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface SolidScrollAnimateOptions extends AnimateOptions {\n  instance?: ScrollAnimateInstance;\n}\nexport interface SolidScrollStaggerOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\ndeclare module 'solid-js' {\n  // eslint-disable-next-line @typescript-eslint/no-namespace\n  namespace JSX {\n    interface Directives {\n      scrollAnimate: SolidScrollAnimateOptions | true;\n      scrollStagger: SolidScrollStaggerOptions | true;\n    }\n  }\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nfunction read<T>(accessor?: () => T | true | undefined): T {\n  const v = accessor?.();\n  return (v && v !== true ? v : {}) as T;\n}\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest options' version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Directive: `<div use:scrollAnimate={{ animation: 'fade-in' }} />`.\n * 4.0.1: the accessor is tracked — when signals it reads change, callbacks\n * update right away and the other options are re-applied if the element has\n * not animated yet (no manual `refresh()` needed).\n */\nexport function scrollAnimate(el: Element, accessor?: () => SolidScrollAnimateOptions | true | undefined): void {\n  let latest: SolidScrollAnimateOptions = {};\n  let mounted = false;\n  let sa: ScrollAnimateInstance | null = null;\n  const apply = () => {\n    const { instance, ...opts } = latest;\n    const record = sa?.getObservedElements().find((r) => r.element === el);\n    if (sa && record?.animated) return; // finished: callbacks stay live\n    sa?.unobserve(el);\n    sa = getInstance(instance);\n    sa.observe(el, liveCallbacks(opts, () => latest));\n  };\n  createRenderEffect(() => {\n    latest = read<SolidScrollAnimateOptions>(accessor);\n    if (mounted) apply();\n  });\n  // Wait until the element is in the document (directives/refs run before insertion).\n  onMount(() => {\n    mounted = true;\n    apply();\n  });\n  onCleanup(() => sa?.unobserve(el));\n}\n\n/** Directive: `<ul use:scrollStagger={{ stagger: 60, observeChildren: true }} />` */\nexport function scrollStagger(el: Element, accessor?: () => SolidScrollStaggerOptions | true | undefined): void {\n  const { instance, ...opts } = read<SolidScrollStaggerOptions>(accessor);\n  let stop: (() => void) | undefined;\n  onMount(() => {\n    stop = staggerChildren(el, opts, getInstance(instance));\n  });\n  onCleanup(() => stop?.());\n}\n\n/** Primitive returning a `ref` callback: `<div ref={useScrollAnimate({ animation: 'fade-in-up' })} />` */\nexport function useScrollAnimate(options: SolidScrollAnimateOptions = {}): (el: Element) => void {\n  let el: Element | undefined;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  onMount(() => el && sa.observe(el, opts));\n  onCleanup(() => el && sa.unobserve(el));\n  return (node: Element) => {\n    el = node;\n  };\n}\n"],"names":[],"mappings":"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"}

package/dist/svelte.cjs

@@ -1,16 +1,17 @@
 'use strict';
 
-var core = require('./chunks/core-qpECfEkb.cjs');
-var stagger = require('./chunks/stagger-CLc3j58T.cjs');
+var core = require('./chunks/core-B5T0dhFH.cjs');
+var stagger = require('./chunks/stagger-CCFyhzSw.cjs');
+require('./chunks/presets-CUHys3sK.cjs');
 
 /**
- * use-scroll-animate - Svelte integration
+ * motionary - Svelte integration
  *
  * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):
  *
  * ```svelte
  * <script>
- *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';
+ *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';
  * </script>
  * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>
  * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>

package/dist/svelte.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"svelte.cjs","sources":["../src/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate - Svelte integration\n *\n * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):\n *\n * ```svelte\n * <script>\n *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';\n * </script>\n * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * ```\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface ScrollAnimateActionOptions extends AnimateOptions {\n  /** Instance to register with (default: a shared instance created on first use) */\n  instance?: ScrollAnimateInstance;\n}\n\nexport interface ScrollStaggerActionOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\n/** Shape of a Svelte action's return value. */\nexport interface ActionReturn<P> {\n  update?: (parameter: P) => void;\n  destroy?: () => void;\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest parameter's version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Animate `node` when it scrolls into view. Changing the parameter updates the\n * callbacks right away; other options are applied if the element has not\n * animated yet.\n */\nexport function scrollAnimate(\n  node: Element,\n  options: ScrollAnimateActionOptions = {}\n): ActionReturn<ScrollAnimateActionOptions | undefined> {\n  let current = options;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  sa.observe(node, liveCallbacks(opts, () => current));\n\n  return {\n    update(next = {}) {\n      current = next;\n      const record = sa.getObservedElements().find((r) => r.element === node);\n      if (record && !record.animated) {\n        const { instance: _ignored, ...nextOpts } = next;\n        sa.unobserve(node);\n        sa.observe(node, liveCallbacks(nextOpts, () => current));\n      }\n    },\n    destroy() {\n      sa.unobserve(node);\n    },\n  };\n}\n\n/** Stagger the children of `node` when it scrolls into view (`observeChildren: true` also animates children added later). */\nexport function scrollStagger(\n  node: Element,\n  options: ScrollStaggerActionOptions = {}\n): ActionReturn<ScrollStaggerActionOptions | undefined> {\n  const { instance, ...opts } = options;\n  const stop = staggerChildren(node, opts, getInstance(instance));\n  return { destroy: stop };\n}\n"],"names":["createScrollAnimate","staggerChildren"],"mappings":";;;;;AAAA;;;;;;;;;;;;AAYG;AAqBH,IAAI,MAAM,GAAiC,IAAI;AAC/C,MAAM,WAAW,GAAG,CAAC,GAA2B,KAAK,GAAG,IAAI,MAAM,KAAK,MAAM,GAAGA,wBAAmB,EAAE,CAAC;AAEtG,MAAM,SAAS,GAAG,CAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,CAAU;AAExF;AACA,SAAS,aAAa,CAAC,IAAoB,EAAE,MAA4B,EAAA;AACvE,IAAA,MAAM,GAAG,GAAmB,EAAE,GAAG,IAAI,EAAE;AACvC,IAAA,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACzB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,UAAU;YAAG,GAAW,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAe,KAAM,MAAM,EAAE,CAAC,IAAI,CAAS,GAAG,GAAG,IAAI,CAAC;AACvH,IAAA,CAAC,CAAC;AACF,IAAA,OAAO,GAAG;AACZ;AAEA;;;;AAIG;SACa,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,IAAI,OAAO,GAAG,OAAO;IACrB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,EAAE,GAAG,WAAW,CAAC,QAAQ,CAAC;AAChC,IAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,EAAE,MAAM,OAAO,CAAC,CAAC;IAEpD,OAAO;QACL,MAAM,CAAC,IAAI,GAAG,EAAE,EAAA;YACd,OAAO,GAAG,IAAI;YACd,MAAM,MAAM,GAAG,EAAE,CAAC,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,KAAK,IAAI,CAAC;AACvE,YAAA,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;gBAC9B,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,GAAG,IAAI;AAChD,gBAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,CAAC;YAC1D;QACF,CAAC;QACD,OAAO,GAAA;AACL,YAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;QACpB,CAAC;KACF;AACH;AAEA;SACgB,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,IAAI,GAAGC,uBAAe,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAC1B;;;;;"}
+{"version":3,"file":"svelte.cjs","sources":["../src/svelte.ts"],"sourcesContent":["/**\n * motionary - Svelte integration\n *\n * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):\n *\n * ```svelte\n * <script>\n *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';\n * </script>\n * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * ```\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface ScrollAnimateActionOptions extends AnimateOptions {\n  /** Instance to register with (default: a shared instance created on first use) */\n  instance?: ScrollAnimateInstance;\n}\n\nexport interface ScrollStaggerActionOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\n/** Shape of a Svelte action's return value. */\nexport interface ActionReturn<P> {\n  update?: (parameter: P) => void;\n  destroy?: () => void;\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest parameter's version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Animate `node` when it scrolls into view. Changing the parameter updates the\n * callbacks right away; other options are applied if the element has not\n * animated yet.\n */\nexport function scrollAnimate(\n  node: Element,\n  options: ScrollAnimateActionOptions = {}\n): ActionReturn<ScrollAnimateActionOptions | undefined> {\n  let current = options;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  sa.observe(node, liveCallbacks(opts, () => current));\n\n  return {\n    update(next = {}) {\n      current = next;\n      const record = sa.getObservedElements().find((r) => r.element === node);\n      if (record && !record.animated) {\n        const { instance: _ignored, ...nextOpts } = next;\n        sa.unobserve(node);\n        sa.observe(node, liveCallbacks(nextOpts, () => current));\n      }\n    },\n    destroy() {\n      sa.unobserve(node);\n    },\n  };\n}\n\n/** Stagger the children of `node` when it scrolls into view (`observeChildren: true` also animates children added later). */\nexport function scrollStagger(\n  node: Element,\n  options: ScrollStaggerActionOptions = {}\n): ActionReturn<ScrollStaggerActionOptions | undefined> {\n  const { instance, ...opts } = options;\n  const stop = staggerChildren(node, opts, getInstance(instance));\n  return { destroy: stop };\n}\n"],"names":["createScrollAnimate","staggerChildren"],"mappings":";;;;;;AAAA;;;;;;;;;;;;AAYG;AAqBH,IAAI,MAAM,GAAiC,IAAI;AAC/C,MAAM,WAAW,GAAG,CAAC,GAA2B,KAAK,GAAG,IAAI,MAAM,KAAK,MAAM,GAAGA,wBAAmB,EAAE,CAAC;AAEtG,MAAM,SAAS,GAAG,CAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,CAAU;AAExF;AACA,SAAS,aAAa,CAAC,IAAoB,EAAE,MAA4B,EAAA;AACvE,IAAA,MAAM,GAAG,GAAmB,EAAE,GAAG,IAAI,EAAE;AACvC,IAAA,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACzB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,UAAU;YAAG,GAAW,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAe,KAAM,MAAM,EAAE,CAAC,IAAI,CAAS,GAAG,GAAG,IAAI,CAAC;AACvH,IAAA,CAAC,CAAC;AACF,IAAA,OAAO,GAAG;AACZ;AAEA;;;;AAIG;SACa,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,IAAI,OAAO,GAAG,OAAO;IACrB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,EAAE,GAAG,WAAW,CAAC,QAAQ,CAAC;AAChC,IAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,EAAE,MAAM,OAAO,CAAC,CAAC;IAEpD,OAAO;QACL,MAAM,CAAC,IAAI,GAAG,EAAE,EAAA;YACd,OAAO,GAAG,IAAI;YACd,MAAM,MAAM,GAAG,EAAE,CAAC,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,KAAK,IAAI,CAAC;AACvE,YAAA,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;gBAC9B,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,GAAG,IAAI;AAChD,gBAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,CAAC;YAC1D;QACF,CAAC;QACD,OAAO,GAAA;AACL,YAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;QACpB,CAAC;KACF;AACH;AAEA;SACgB,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,IAAI,GAAGC,uBAAe,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAC1B;;;;;"}

package/dist/svelte.d.cts

@@ -1,9 +1,15 @@
 /**
- * use-scroll-animate - Core Type Definitions
+ * motionary - Core Type Definitions
  * A lightweight, high-performance scroll animation library
  */
-/** Built-in animation presets */
-type AnimationPreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/** The 33 core presets (always available in `PRESETS`). */
+type CorePreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/**
+ * Every built-in preset name: the core set plus the 6.1 extended set, which is
+ * available once `motionary/presets/extended` is loaded (or after
+ * `registerPresets(EXTENDED_PRESETS)`).
+ */
+type AnimationPreset = CorePreset | ExtendedPreset;
 /**
  * How `onProgress` / `progressVar` progress is measured.
  * - `'ratio'` (default): the element's visible ratio (IntersectionObserver `intersectionRatio`).
@@ -22,16 +28,24 @@ type ProgressMode = 'ratio' | 'scroll';
  *   since those only mean something for a time-based animation.
  */
 type ScrollEngine = 'auto' | 'js' | 'css';
+/** The 6.1 extended presets (`motionary/presets/extended`). */
+type ExtendedPreset = 'fade-in-up-sm' | 'fade-in-down-sm' | 'fade-in-left-sm' | 'fade-in-right-sm' | 'fade-in-up-lg' | 'fade-in-down-lg' | 'fade-in-left-lg' | 'fade-in-right-lg' | 'fade-in-up-left' | 'fade-in-up-right' | 'fade-in-down-left' | 'fade-in-down-right' | 'fade-in-scale' | 'fade-in-half' | 'zoom-in-up' | 'zoom-in-down' | 'zoom-in-left' | 'zoom-in-right' | 'zoom-out-up' | 'zoom-out-down' | 'zoom-out-left' | 'zoom-out-right' | 'zoom-in-big' | 'zoom-out-big' | 'zoom-bounce' | 'zoom-in-rotate' | 'scale-x-left' | 'scale-x-right' | 'scale-y-top' | 'scale-y-bottom' | 'stretch-x' | 'stretch-y' | 'flip-x-reverse' | 'flip-y-reverse' | 'flip-y-full' | 'flip-diagonal' | 'flip-diagonal-reverse' | 'flip-left' | 'flip-right' | 'unfold-down' | 'unfold-up' | 'door-open-left' | 'door-open-right' | 'fold-in' | 'flip-x-bounce' | 'flip-y-bounce' | 'swing-in-top' | 'swing-in-bottom' | 'swing-in-left' | 'swing-in-right' | 'slide-up-spring' | 'slide-down-spring' | 'slide-left-spring' | 'slide-right-spring' | 'slide-up-sm' | 'slide-down-sm' | 'back-in-up' | 'back-in-down' | 'back-in-left' | 'back-in-right' | 'light-speed-in-left' | 'light-speed-in-right' | 'rise-in' | 'sink-in' | 'float-in-up' | 'float-in-down' | 'roll-in-left' | 'roll-in-right' | 'spiral-in' | 'spiral-in-reverse' | 'spin-in' | 'rotate-in-up-left' | 'rotate-in-up-right' | 'rotate-in-down-left' | 'rotate-in-down-right' | 'skew-in-left' | 'skew-in-y' | 'shear-in' | 'shear-in-reverse' | 'twist-in' | 'tilt-in-left' | 'tilt-in-right' | 'blur-in-down' | 'blur-in-left' | 'blur-in-right' | 'blur-in-strong' | 'blur-in-zoom' | 'blur-in-scale' | 'blur-in-x' | 'mask-up' | 'mask-down' | 'mask-left' | 'mask-right' | 'blur-mask-up' | 'clip-circle-top' | 'clip-circle-bottom' | 'clip-circle-left' | 'clip-circle-right' | 'clip-circle-corner' | 'clip-ellipse' | 'clip-diamond' | 'clip-split-x' | 'clip-split-y' | 'clip-box' | 'clip-pill' | 'clip-blinds' | 'clip-blinds-x' | 'clip-diagonal' | 'clip-diagonal-reverse' | 'clip-slant-right' | 'clip-slant-left' | 'bounce-in' | 'bounce-in-up' | 'bounce-in-down' | 'bounce-in-left' | 'bounce-in-right' | 'elastic-in' | 'elastic-in-x' | 'rubber-in' | 'jello-in' | 'wobble-in' | 'tada-in' | 'heartbeat-in' | 'drop-in' | 'pop-in' | 'squash-in' | 'shake-in' | 'swing-in' | 'brightness-in' | 'darken-in' | 'color-in' | 'saturate-in' | 'hue-in' | 'sepia-in' | 'invert-in' | 'contrast-in' | 'exposure-in' | 'vintage-in' | 'blur-bright-in' | 'shadow-lift' | 'neon-glow-in' | 'glow-in' | 'perspective-in-up' | 'perspective-in-down' | 'perspective-in-left' | 'perspective-in-right' | 'depth-push' | 'depth-pull' | 'depth-in-up' | 'swoop-in-left' | 'swoop-in-right' | 'card-tilt-in' | 'glitch-in' | 'glitch-in-color' | 'typewriter' | 'typewriter-lines' | 'hinge-in' | 'flicker-in' | 'scan-in' | 'materialize' | 'teleport-in' | 'stagger-fade-up' | 'stagger-pop' | 'stagger-rise' | 'stagger-slide' | 'stagger-flip' | 'stagger-blur' | 'stagger-zoom' | 'stagger-drop' | 'scrub-parallax-up' | 'scrub-parallax-down' | 'scrub-rotate' | 'scrub-spin' | 'scrub-scale' | 'scrub-shrink' | 'scrub-pan-left' | 'scrub-pan-right' | 'scrub-tilt' | 'scrub-fade-through' | 'scrub-blur-through' | 'scrub-reveal-x';
 /** Easing function types */
 type EasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'spring' | 'soft-spring' | 'heavy-bounce' | [number, number, number, number] | ((t: number) => number) | string;
 /** Keyframe definition for custom animations */
 interface AnimationKeyframe {
     [property: string]: string | number;
 }
+/** One intermediate keyframe of a preset: `offset` is 0 < offset < 1. */
+interface AnimationFrame extends AnimationKeyframe {
+    offset: number;
+}
 /** Custom animation definition */
 interface CustomAnimation {
     from: AnimationKeyframe;
     to: AnimationKeyframe;
+    /** Optional intermediate keyframes (overshoot, bounce, …), played between `from` and `to`. */
+    frames?: AnimationFrame[];
 }
 /** Per-element animation options */
 interface AnimateOptions {
@@ -173,7 +187,7 @@ interface ScrollAnimateInstance {
 }
 
 /**
- * use-scroll-animate - Staggered children
+ * motionary - Staggered children
  * Reveal a container's children one after another when the container scrolls
  * into view, optionally also animating children that are added later.
  */
@@ -191,13 +205,13 @@ interface StaggerOptions extends AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Svelte integration
+ * motionary - Svelte integration
  *
  * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):
  *
  * ```svelte
  * <script>
- *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';
+ *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';
  * </script>
  * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>
  * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>

package/dist/svelte.d.ts

@@ -1,9 +1,15 @@
 /**
- * use-scroll-animate - Core Type Definitions
+ * motionary - Core Type Definitions
  * A lightweight, high-performance scroll animation library
  */
-/** Built-in animation presets */
-type AnimationPreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/** The 33 core presets (always available in `PRESETS`). */
+type CorePreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/**
+ * Every built-in preset name: the core set plus the 6.1 extended set, which is
+ * available once `motionary/presets/extended` is loaded (or after
+ * `registerPresets(EXTENDED_PRESETS)`).
+ */
+type AnimationPreset = CorePreset | ExtendedPreset;
 /**
  * How `onProgress` / `progressVar` progress is measured.
  * - `'ratio'` (default): the element's visible ratio (IntersectionObserver `intersectionRatio`).
@@ -22,16 +28,24 @@ type ProgressMode = 'ratio' | 'scroll';
  *   since those only mean something for a time-based animation.
  */
 type ScrollEngine = 'auto' | 'js' | 'css';
+/** The 6.1 extended presets (`motionary/presets/extended`). */
+type ExtendedPreset = 'fade-in-up-sm' | 'fade-in-down-sm' | 'fade-in-left-sm' | 'fade-in-right-sm' | 'fade-in-up-lg' | 'fade-in-down-lg' | 'fade-in-left-lg' | 'fade-in-right-lg' | 'fade-in-up-left' | 'fade-in-up-right' | 'fade-in-down-left' | 'fade-in-down-right' | 'fade-in-scale' | 'fade-in-half' | 'zoom-in-up' | 'zoom-in-down' | 'zoom-in-left' | 'zoom-in-right' | 'zoom-out-up' | 'zoom-out-down' | 'zoom-out-left' | 'zoom-out-right' | 'zoom-in-big' | 'zoom-out-big' | 'zoom-bounce' | 'zoom-in-rotate' | 'scale-x-left' | 'scale-x-right' | 'scale-y-top' | 'scale-y-bottom' | 'stretch-x' | 'stretch-y' | 'flip-x-reverse' | 'flip-y-reverse' | 'flip-y-full' | 'flip-diagonal' | 'flip-diagonal-reverse' | 'flip-left' | 'flip-right' | 'unfold-down' | 'unfold-up' | 'door-open-left' | 'door-open-right' | 'fold-in' | 'flip-x-bounce' | 'flip-y-bounce' | 'swing-in-top' | 'swing-in-bottom' | 'swing-in-left' | 'swing-in-right' | 'slide-up-spring' | 'slide-down-spring' | 'slide-left-spring' | 'slide-right-spring' | 'slide-up-sm' | 'slide-down-sm' | 'back-in-up' | 'back-in-down' | 'back-in-left' | 'back-in-right' | 'light-speed-in-left' | 'light-speed-in-right' | 'rise-in' | 'sink-in' | 'float-in-up' | 'float-in-down' | 'roll-in-left' | 'roll-in-right' | 'spiral-in' | 'spiral-in-reverse' | 'spin-in' | 'rotate-in-up-left' | 'rotate-in-up-right' | 'rotate-in-down-left' | 'rotate-in-down-right' | 'skew-in-left' | 'skew-in-y' | 'shear-in' | 'shear-in-reverse' | 'twist-in' | 'tilt-in-left' | 'tilt-in-right' | 'blur-in-down' | 'blur-in-left' | 'blur-in-right' | 'blur-in-strong' | 'blur-in-zoom' | 'blur-in-scale' | 'blur-in-x' | 'mask-up' | 'mask-down' | 'mask-left' | 'mask-right' | 'blur-mask-up' | 'clip-circle-top' | 'clip-circle-bottom' | 'clip-circle-left' | 'clip-circle-right' | 'clip-circle-corner' | 'clip-ellipse' | 'clip-diamond' | 'clip-split-x' | 'clip-split-y' | 'clip-box' | 'clip-pill' | 'clip-blinds' | 'clip-blinds-x' | 'clip-diagonal' | 'clip-diagonal-reverse' | 'clip-slant-right' | 'clip-slant-left' | 'bounce-in' | 'bounce-in-up' | 'bounce-in-down' | 'bounce-in-left' | 'bounce-in-right' | 'elastic-in' | 'elastic-in-x' | 'rubber-in' | 'jello-in' | 'wobble-in' | 'tada-in' | 'heartbeat-in' | 'drop-in' | 'pop-in' | 'squash-in' | 'shake-in' | 'swing-in' | 'brightness-in' | 'darken-in' | 'color-in' | 'saturate-in' | 'hue-in' | 'sepia-in' | 'invert-in' | 'contrast-in' | 'exposure-in' | 'vintage-in' | 'blur-bright-in' | 'shadow-lift' | 'neon-glow-in' | 'glow-in' | 'perspective-in-up' | 'perspective-in-down' | 'perspective-in-left' | 'perspective-in-right' | 'depth-push' | 'depth-pull' | 'depth-in-up' | 'swoop-in-left' | 'swoop-in-right' | 'card-tilt-in' | 'glitch-in' | 'glitch-in-color' | 'typewriter' | 'typewriter-lines' | 'hinge-in' | 'flicker-in' | 'scan-in' | 'materialize' | 'teleport-in' | 'stagger-fade-up' | 'stagger-pop' | 'stagger-rise' | 'stagger-slide' | 'stagger-flip' | 'stagger-blur' | 'stagger-zoom' | 'stagger-drop' | 'scrub-parallax-up' | 'scrub-parallax-down' | 'scrub-rotate' | 'scrub-spin' | 'scrub-scale' | 'scrub-shrink' | 'scrub-pan-left' | 'scrub-pan-right' | 'scrub-tilt' | 'scrub-fade-through' | 'scrub-blur-through' | 'scrub-reveal-x';
 /** Easing function types */
 type EasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'spring' | 'soft-spring' | 'heavy-bounce' | [number, number, number, number] | ((t: number) => number) | string;
 /** Keyframe definition for custom animations */
 interface AnimationKeyframe {
     [property: string]: string | number;
 }
+/** One intermediate keyframe of a preset: `offset` is 0 < offset < 1. */
+interface AnimationFrame extends AnimationKeyframe {
+    offset: number;
+}
 /** Custom animation definition */
 interface CustomAnimation {
     from: AnimationKeyframe;
     to: AnimationKeyframe;
+    /** Optional intermediate keyframes (overshoot, bounce, …), played between `from` and `to`. */
+    frames?: AnimationFrame[];
 }
 /** Per-element animation options */
 interface AnimateOptions {
@@ -173,7 +187,7 @@ interface ScrollAnimateInstance {
 }
 
 /**
- * use-scroll-animate - Staggered children
+ * motionary - Staggered children
  * Reveal a container's children one after another when the container scrolls
  * into view, optionally also animating children that are added later.
  */
@@ -191,13 +205,13 @@ interface StaggerOptions extends AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Svelte integration
+ * motionary - Svelte integration
  *
  * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):
  *
  * ```svelte
  * <script>
- *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';
+ *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';
  * </script>
  * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>
  * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>

package/dist/svelte.js

@@ -1,14 +1,15 @@
-import { c as createScrollAnimate } from './chunks/core-mV_TPgG_.js';
-import { s as staggerChildren } from './chunks/stagger-BFAhKknX.js';
+import { c as createScrollAnimate } from './chunks/core-D7cVumUu.js';
+import { s as staggerChildren } from './chunks/stagger-DtMKo2SK.js';
+import './chunks/presets-BYBVJVeP.js';
 
 /**
- * use-scroll-animate - Svelte integration
+ * motionary - Svelte integration
  *
  * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):
  *
  * ```svelte
  * <script>
- *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';
+ *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';
  * </script>
  * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>
  * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>

package/dist/svelte.js.map

@@ -1 +1 @@
-{"version":3,"file":"svelte.js","sources":["../src/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate - Svelte integration\n *\n * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):\n *\n * ```svelte\n * <script>\n *   import { scrollAnimate, scrollStagger } from 'use-scroll-animate/svelte';\n * </script>\n * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * ```\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface ScrollAnimateActionOptions extends AnimateOptions {\n  /** Instance to register with (default: a shared instance created on first use) */\n  instance?: ScrollAnimateInstance;\n}\n\nexport interface ScrollStaggerActionOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\n/** Shape of a Svelte action's return value. */\nexport interface ActionReturn<P> {\n  update?: (parameter: P) => void;\n  destroy?: () => void;\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest parameter's version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Animate `node` when it scrolls into view. Changing the parameter updates the\n * callbacks right away; other options are applied if the element has not\n * animated yet.\n */\nexport function scrollAnimate(\n  node: Element,\n  options: ScrollAnimateActionOptions = {}\n): ActionReturn<ScrollAnimateActionOptions | undefined> {\n  let current = options;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  sa.observe(node, liveCallbacks(opts, () => current));\n\n  return {\n    update(next = {}) {\n      current = next;\n      const record = sa.getObservedElements().find((r) => r.element === node);\n      if (record && !record.animated) {\n        const { instance: _ignored, ...nextOpts } = next;\n        sa.unobserve(node);\n        sa.observe(node, liveCallbacks(nextOpts, () => current));\n      }\n    },\n    destroy() {\n      sa.unobserve(node);\n    },\n  };\n}\n\n/** Stagger the children of `node` when it scrolls into view (`observeChildren: true` also animates children added later). */\nexport function scrollStagger(\n  node: Element,\n  options: ScrollStaggerActionOptions = {}\n): ActionReturn<ScrollStaggerActionOptions | undefined> {\n  const { instance, ...opts } = options;\n  const stop = staggerChildren(node, opts, getInstance(instance));\n  return { destroy: stop };\n}\n"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;AAYG;AAqBH,IAAI,MAAM,GAAiC,IAAI;AAC/C,MAAM,WAAW,GAAG,CAAC,GAA2B,KAAK,GAAG,IAAI,MAAM,KAAK,MAAM,GAAG,mBAAmB,EAAE,CAAC;AAEtG,MAAM,SAAS,GAAG,CAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,CAAU;AAExF;AACA,SAAS,aAAa,CAAC,IAAoB,EAAE,MAA4B,EAAA;AACvE,IAAA,MAAM,GAAG,GAAmB,EAAE,GAAG,IAAI,EAAE;AACvC,IAAA,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACzB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,UAAU;YAAG,GAAW,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAe,KAAM,MAAM,EAAE,CAAC,IAAI,CAAS,GAAG,GAAG,IAAI,CAAC;AACvH,IAAA,CAAC,CAAC;AACF,IAAA,OAAO,GAAG;AACZ;AAEA;;;;AAIG;SACa,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,IAAI,OAAO,GAAG,OAAO;IACrB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,EAAE,GAAG,WAAW,CAAC,QAAQ,CAAC;AAChC,IAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,EAAE,MAAM,OAAO,CAAC,CAAC;IAEpD,OAAO;QACL,MAAM,CAAC,IAAI,GAAG,EAAE,EAAA;YACd,OAAO,GAAG,IAAI;YACd,MAAM,MAAM,GAAG,EAAE,CAAC,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,KAAK,IAAI,CAAC;AACvE,YAAA,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;gBAC9B,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,GAAG,IAAI;AAChD,gBAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,CAAC;YAC1D;QACF,CAAC;QACD,OAAO,GAAA;AACL,YAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;QACpB,CAAC;KACF;AACH;AAEA;SACgB,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,IAAI,GAAG,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAC1B;;;;"}
+{"version":3,"file":"svelte.js","sources":["../src/svelte.ts"],"sourcesContent":["/**\n * motionary - Svelte integration\n *\n * Svelte actions (no import from `svelte` needed, works with Svelte 3, 4 and 5):\n *\n * ```svelte\n * <script>\n *   import { scrollAnimate, scrollStagger } from 'motionary/svelte';\n * </script>\n * <div use:scrollAnimate={{ animation: 'fade-in-up', duration: 800 }}>…</div>\n * <ul use:scrollStagger={{ stagger: 60 }}>…</ul>\n * ```\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\nexport interface ScrollAnimateActionOptions extends AnimateOptions {\n  /** Instance to register with (default: a shared instance created on first use) */\n  instance?: ScrollAnimateInstance;\n}\n\nexport interface ScrollStaggerActionOptions extends StaggerOptions {\n  instance?: ScrollAnimateInstance;\n}\n\n/** Shape of a Svelte action's return value. */\nexport interface ActionReturn<P> {\n  update?: (parameter: P) => void;\n  destroy?: () => void;\n}\n\nlet shared: ScrollAnimateInstance | null = null;\nconst getInstance = (own?: ScrollAnimateInstance) => own || shared || (shared = createScrollAnimate());\n\nconst CALLBACKS = ['onStart', 'onComplete', 'onEnter', 'onLeave', 'onProgress'] as const;\n\n/** Callbacks always call the latest parameter's version. */\nfunction liveCallbacks(opts: AnimateOptions, latest: () => AnimateOptions): AnimateOptions {\n  const out: AnimateOptions = { ...opts };\n  CALLBACKS.forEach((name) => {\n    if (typeof opts[name] === 'function') (out as any)[name] = (...args: unknown[]) => (latest()[name] as any)?.(...args);\n  });\n  return out;\n}\n\n/**\n * Animate `node` when it scrolls into view. Changing the parameter updates the\n * callbacks right away; other options are applied if the element has not\n * animated yet.\n */\nexport function scrollAnimate(\n  node: Element,\n  options: ScrollAnimateActionOptions = {}\n): ActionReturn<ScrollAnimateActionOptions | undefined> {\n  let current = options;\n  const { instance, ...opts } = options;\n  const sa = getInstance(instance);\n  sa.observe(node, liveCallbacks(opts, () => current));\n\n  return {\n    update(next = {}) {\n      current = next;\n      const record = sa.getObservedElements().find((r) => r.element === node);\n      if (record && !record.animated) {\n        const { instance: _ignored, ...nextOpts } = next;\n        sa.unobserve(node);\n        sa.observe(node, liveCallbacks(nextOpts, () => current));\n      }\n    },\n    destroy() {\n      sa.unobserve(node);\n    },\n  };\n}\n\n/** Stagger the children of `node` when it scrolls into view (`observeChildren: true` also animates children added later). */\nexport function scrollStagger(\n  node: Element,\n  options: ScrollStaggerActionOptions = {}\n): ActionReturn<ScrollStaggerActionOptions | undefined> {\n  const { instance, ...opts } = options;\n  const stop = staggerChildren(node, opts, getInstance(instance));\n  return { destroy: stop };\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;AAYG;AAqBH,IAAI,MAAM,GAAiC,IAAI;AAC/C,MAAM,WAAW,GAAG,CAAC,GAA2B,KAAK,GAAG,IAAI,MAAM,KAAK,MAAM,GAAG,mBAAmB,EAAE,CAAC;AAEtG,MAAM,SAAS,GAAG,CAAC,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,YAAY,CAAU;AAExF;AACA,SAAS,aAAa,CAAC,IAAoB,EAAE,MAA4B,EAAA;AACvE,IAAA,MAAM,GAAG,GAAmB,EAAE,GAAG,IAAI,EAAE;AACvC,IAAA,SAAS,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACzB,QAAA,IAAI,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,UAAU;YAAG,GAAW,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAe,KAAM,MAAM,EAAE,CAAC,IAAI,CAAS,GAAG,GAAG,IAAI,CAAC;AACvH,IAAA,CAAC,CAAC;AACF,IAAA,OAAO,GAAG;AACZ;AAEA;;;;AAIG;SACa,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,IAAI,OAAO,GAAG,OAAO;IACrB,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,EAAE,GAAG,WAAW,CAAC,QAAQ,CAAC;AAChC,IAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,IAAI,EAAE,MAAM,OAAO,CAAC,CAAC;IAEpD,OAAO;QACL,MAAM,CAAC,IAAI,GAAG,EAAE,EAAA;YACd,OAAO,GAAG,IAAI;YACd,MAAM,MAAM,GAAG,EAAE,CAAC,mBAAmB,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,OAAO,KAAK,IAAI,CAAC;AACvE,YAAA,IAAI,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,EAAE;gBAC9B,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,QAAQ,EAAE,GAAG,IAAI;AAChD,gBAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;AAClB,gBAAA,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,aAAa,CAAC,QAAQ,EAAE,MAAM,OAAO,CAAC,CAAC;YAC1D;QACF,CAAC;QACD,OAAO,GAAA;AACL,YAAA,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC;QACpB,CAAC;KACF;AACH;AAEA;SACgB,aAAa,CAC3B,IAAa,EACb,UAAsC,EAAE,EAAA;IAExC,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,GAAG,OAAO;AACrC,IAAA,MAAM,IAAI,GAAG,eAAe,CAAC,IAAI,EAAE,IAAI,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;AAC/D,IAAA,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAC1B;;;;"}

package/dist/vue.cjs

@@ -1,10 +1,11 @@
 'use strict';
 
-var core = require('./chunks/core-qpECfEkb.cjs');
-var stagger = require('./chunks/stagger-CLc3j58T.cjs');
+var core = require('./chunks/core-B5T0dhFH.cjs');
+var stagger = require('./chunks/stagger-CCFyhzSw.cjs');
+require('./chunks/presets-CUHys3sK.cjs');
 
 /**
- * use-scroll-animate - Vue 3 Integration
+ * motionary - Vue 3 Integration
  * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.
  *
  * A thin wrapper around the core engine, so it shares its behaviour: `once`,

package/dist/vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"vue.cjs","sources":["../src/vue.ts"],"sourcesContent":["/**\n * use-scroll-animate - Vue 3 Integration\n * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.\n *\n * A thin wrapper around the core engine, so it shares its behaviour: `once`,\n * `offset`, custom easing functions, progress, `prefers-reduced-motion`\n * support, and cleanup on unmount.\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\n/** Support refs on components (`$el`) as well as plain elements. */\nfunction unwrap(value: unknown): Element | null {\n  if (value && typeof Element !== 'undefined' && !(value instanceof Element) && (value as any).$el instanceof Element) {\n    return (value as any).$el as Element;\n  }\n  return (value as Element | null) || null;\n}\n\nexport function createVueComposables(Vue: {\n  ref: <T>(value: T | null) => { value: T | null };\n  onMounted: (fn: () => void) => void;\n  onUnmounted: (fn: () => void) => void;\n}) {\n  // Created lazily on the client so importing on the server is side-effect free.\n  let instance: ScrollAnimateInstance | null = null;\n  const getInstance = () => instance || (instance = createScrollAnimate());\n\n  function useScrollAnimate(options: AnimateOptions = {}) {\n    const animateRef = Vue.ref<Element>(null);\n    let el: Element | null = null;\n\n    Vue.onMounted(() => {\n      const target = unwrap(animateRef.value);\n      if (!target) return;\n      el = target;\n      getInstance().observe(el, options);\n    });\n\n    Vue.onUnmounted(() => {\n      if (el) getInstance().unobserve(el);\n      el = null;\n    });\n\n    return { animateRef };\n  }\n\n  /** Stagger the children of `staggerRef`; `observeChildren: true` also animates children added later. */\n  function useScrollStagger(options: StaggerOptions = {}) {\n    const staggerRef = Vue.ref<Element>(null);\n    let stop: (() => void) | undefined;\n\n    Vue.onMounted(() => {\n      const target = unwrap(staggerRef.value);\n      if (target) stop = staggerChildren(target, options, getInstance());\n    });\n\n    Vue.onUnmounted(() => {\n      stop?.();\n      stop = undefined;\n    });\n\n    return { staggerRef };\n  }\n\n  return { useScrollAnimate, useScrollStagger };\n}\n"],"names":["createScrollAnimate","staggerChildren"],"mappings":";;;;;AAAA;;;;;;;AAOG;AAMH;AACA,SAAS,MAAM,CAAC,KAAc,EAAA;IAC5B,IAAI,KAAK,IAAI,OAAO,OAAO,KAAK,WAAW,IAAI,EAAE,KAAK,YAAY,OAAO,CAAC,IAAK,KAAa,CAAC,GAAG,YAAY,OAAO,EAAE;QACnH,OAAQ,KAAa,CAAC,GAAc;IACtC;IACA,OAAQ,KAAwB,IAAI,IAAI;AAC1C;AAEM,SAAU,oBAAoB,CAAC,GAIpC,EAAA;;IAEC,IAAI,QAAQ,GAAiC,IAAI;AACjD,IAAA,MAAM,WAAW,GAAG,MAAM,QAAQ,KAAK,QAAQ,GAAGA,wBAAmB,EAAE,CAAC;IAExE,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;QACzC,IAAI,EAAE,GAAmB,IAAI;AAE7B,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,CAAC,MAAM;gBAAE;YACb,EAAE,GAAG,MAAM;YACX,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC;AACpC,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;AACnB,YAAA,IAAI,EAAE;AAAE,gBAAA,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,CAAC;YACnC,EAAE,GAAG,IAAI;AACX,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;;IAGA,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;AACzC,QAAA,IAAI,IAA8B;AAElC,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,MAAM;gBAAE,IAAI,GAAGC,uBAAe,CAAC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC;AACpE,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;YACnB,IAAI,IAAI;YACR,IAAI,GAAG,SAAS;AAClB,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;AAEA,IAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE;AAC/C;;;;"}
+{"version":3,"file":"vue.cjs","sources":["../src/vue.ts"],"sourcesContent":["/**\n * motionary - Vue 3 Integration\n * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.\n *\n * A thin wrapper around the core engine, so it shares its behaviour: `once`,\n * `offset`, custom easing functions, progress, `prefers-reduced-motion`\n * support, and cleanup on unmount.\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\n/** Support refs on components (`$el`) as well as plain elements. */\nfunction unwrap(value: unknown): Element | null {\n  if (value && typeof Element !== 'undefined' && !(value instanceof Element) && (value as any).$el instanceof Element) {\n    return (value as any).$el as Element;\n  }\n  return (value as Element | null) || null;\n}\n\nexport function createVueComposables(Vue: {\n  ref: <T>(value: T | null) => { value: T | null };\n  onMounted: (fn: () => void) => void;\n  onUnmounted: (fn: () => void) => void;\n}) {\n  // Created lazily on the client so importing on the server is side-effect free.\n  let instance: ScrollAnimateInstance | null = null;\n  const getInstance = () => instance || (instance = createScrollAnimate());\n\n  function useScrollAnimate(options: AnimateOptions = {}) {\n    const animateRef = Vue.ref<Element>(null);\n    let el: Element | null = null;\n\n    Vue.onMounted(() => {\n      const target = unwrap(animateRef.value);\n      if (!target) return;\n      el = target;\n      getInstance().observe(el, options);\n    });\n\n    Vue.onUnmounted(() => {\n      if (el) getInstance().unobserve(el);\n      el = null;\n    });\n\n    return { animateRef };\n  }\n\n  /** Stagger the children of `staggerRef`; `observeChildren: true` also animates children added later. */\n  function useScrollStagger(options: StaggerOptions = {}) {\n    const staggerRef = Vue.ref<Element>(null);\n    let stop: (() => void) | undefined;\n\n    Vue.onMounted(() => {\n      const target = unwrap(staggerRef.value);\n      if (target) stop = staggerChildren(target, options, getInstance());\n    });\n\n    Vue.onUnmounted(() => {\n      stop?.();\n      stop = undefined;\n    });\n\n    return { staggerRef };\n  }\n\n  return { useScrollAnimate, useScrollStagger };\n}\n"],"names":["createScrollAnimate","staggerChildren"],"mappings":";;;;;;AAAA;;;;;;;AAOG;AAMH;AACA,SAAS,MAAM,CAAC,KAAc,EAAA;IAC5B,IAAI,KAAK,IAAI,OAAO,OAAO,KAAK,WAAW,IAAI,EAAE,KAAK,YAAY,OAAO,CAAC,IAAK,KAAa,CAAC,GAAG,YAAY,OAAO,EAAE;QACnH,OAAQ,KAAa,CAAC,GAAc;IACtC;IACA,OAAQ,KAAwB,IAAI,IAAI;AAC1C;AAEM,SAAU,oBAAoB,CAAC,GAIpC,EAAA;;IAEC,IAAI,QAAQ,GAAiC,IAAI;AACjD,IAAA,MAAM,WAAW,GAAG,MAAM,QAAQ,KAAK,QAAQ,GAAGA,wBAAmB,EAAE,CAAC;IAExE,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;QACzC,IAAI,EAAE,GAAmB,IAAI;AAE7B,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,CAAC,MAAM;gBAAE;YACb,EAAE,GAAG,MAAM;YACX,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC;AACpC,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;AACnB,YAAA,IAAI,EAAE;AAAE,gBAAA,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,CAAC;YACnC,EAAE,GAAG,IAAI;AACX,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;;IAGA,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;AACzC,QAAA,IAAI,IAA8B;AAElC,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,MAAM;gBAAE,IAAI,GAAGC,uBAAe,CAAC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC;AACpE,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;YACnB,IAAI,IAAI;YACR,IAAI,GAAG,SAAS;AAClB,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;AAEA,IAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE;AAC/C;;;;"}

package/dist/vue.d.cts

@@ -1,9 +1,15 @@
 /**
- * use-scroll-animate - Core Type Definitions
+ * motionary - Core Type Definitions
  * A lightweight, high-performance scroll animation library
  */
-/** Built-in animation presets */
-type AnimationPreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/** The 33 core presets (always available in `PRESETS`). */
+type CorePreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/**
+ * Every built-in preset name: the core set plus the 6.1 extended set, which is
+ * available once `motionary/presets/extended` is loaded (or after
+ * `registerPresets(EXTENDED_PRESETS)`).
+ */
+type AnimationPreset = CorePreset | ExtendedPreset;
 /**
  * How `onProgress` / `progressVar` progress is measured.
  * - `'ratio'` (default): the element's visible ratio (IntersectionObserver `intersectionRatio`).
@@ -22,16 +28,24 @@ type ProgressMode = 'ratio' | 'scroll';
  *   since those only mean something for a time-based animation.
  */
 type ScrollEngine = 'auto' | 'js' | 'css';
+/** The 6.1 extended presets (`motionary/presets/extended`). */
+type ExtendedPreset = 'fade-in-up-sm' | 'fade-in-down-sm' | 'fade-in-left-sm' | 'fade-in-right-sm' | 'fade-in-up-lg' | 'fade-in-down-lg' | 'fade-in-left-lg' | 'fade-in-right-lg' | 'fade-in-up-left' | 'fade-in-up-right' | 'fade-in-down-left' | 'fade-in-down-right' | 'fade-in-scale' | 'fade-in-half' | 'zoom-in-up' | 'zoom-in-down' | 'zoom-in-left' | 'zoom-in-right' | 'zoom-out-up' | 'zoom-out-down' | 'zoom-out-left' | 'zoom-out-right' | 'zoom-in-big' | 'zoom-out-big' | 'zoom-bounce' | 'zoom-in-rotate' | 'scale-x-left' | 'scale-x-right' | 'scale-y-top' | 'scale-y-bottom' | 'stretch-x' | 'stretch-y' | 'flip-x-reverse' | 'flip-y-reverse' | 'flip-y-full' | 'flip-diagonal' | 'flip-diagonal-reverse' | 'flip-left' | 'flip-right' | 'unfold-down' | 'unfold-up' | 'door-open-left' | 'door-open-right' | 'fold-in' | 'flip-x-bounce' | 'flip-y-bounce' | 'swing-in-top' | 'swing-in-bottom' | 'swing-in-left' | 'swing-in-right' | 'slide-up-spring' | 'slide-down-spring' | 'slide-left-spring' | 'slide-right-spring' | 'slide-up-sm' | 'slide-down-sm' | 'back-in-up' | 'back-in-down' | 'back-in-left' | 'back-in-right' | 'light-speed-in-left' | 'light-speed-in-right' | 'rise-in' | 'sink-in' | 'float-in-up' | 'float-in-down' | 'roll-in-left' | 'roll-in-right' | 'spiral-in' | 'spiral-in-reverse' | 'spin-in' | 'rotate-in-up-left' | 'rotate-in-up-right' | 'rotate-in-down-left' | 'rotate-in-down-right' | 'skew-in-left' | 'skew-in-y' | 'shear-in' | 'shear-in-reverse' | 'twist-in' | 'tilt-in-left' | 'tilt-in-right' | 'blur-in-down' | 'blur-in-left' | 'blur-in-right' | 'blur-in-strong' | 'blur-in-zoom' | 'blur-in-scale' | 'blur-in-x' | 'mask-up' | 'mask-down' | 'mask-left' | 'mask-right' | 'blur-mask-up' | 'clip-circle-top' | 'clip-circle-bottom' | 'clip-circle-left' | 'clip-circle-right' | 'clip-circle-corner' | 'clip-ellipse' | 'clip-diamond' | 'clip-split-x' | 'clip-split-y' | 'clip-box' | 'clip-pill' | 'clip-blinds' | 'clip-blinds-x' | 'clip-diagonal' | 'clip-diagonal-reverse' | 'clip-slant-right' | 'clip-slant-left' | 'bounce-in' | 'bounce-in-up' | 'bounce-in-down' | 'bounce-in-left' | 'bounce-in-right' | 'elastic-in' | 'elastic-in-x' | 'rubber-in' | 'jello-in' | 'wobble-in' | 'tada-in' | 'heartbeat-in' | 'drop-in' | 'pop-in' | 'squash-in' | 'shake-in' | 'swing-in' | 'brightness-in' | 'darken-in' | 'color-in' | 'saturate-in' | 'hue-in' | 'sepia-in' | 'invert-in' | 'contrast-in' | 'exposure-in' | 'vintage-in' | 'blur-bright-in' | 'shadow-lift' | 'neon-glow-in' | 'glow-in' | 'perspective-in-up' | 'perspective-in-down' | 'perspective-in-left' | 'perspective-in-right' | 'depth-push' | 'depth-pull' | 'depth-in-up' | 'swoop-in-left' | 'swoop-in-right' | 'card-tilt-in' | 'glitch-in' | 'glitch-in-color' | 'typewriter' | 'typewriter-lines' | 'hinge-in' | 'flicker-in' | 'scan-in' | 'materialize' | 'teleport-in' | 'stagger-fade-up' | 'stagger-pop' | 'stagger-rise' | 'stagger-slide' | 'stagger-flip' | 'stagger-blur' | 'stagger-zoom' | 'stagger-drop' | 'scrub-parallax-up' | 'scrub-parallax-down' | 'scrub-rotate' | 'scrub-spin' | 'scrub-scale' | 'scrub-shrink' | 'scrub-pan-left' | 'scrub-pan-right' | 'scrub-tilt' | 'scrub-fade-through' | 'scrub-blur-through' | 'scrub-reveal-x';
 /** Easing function types */
 type EasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'spring' | 'soft-spring' | 'heavy-bounce' | [number, number, number, number] | ((t: number) => number) | string;
 /** Keyframe definition for custom animations */
 interface AnimationKeyframe {
     [property: string]: string | number;
 }
+/** One intermediate keyframe of a preset: `offset` is 0 < offset < 1. */
+interface AnimationFrame extends AnimationKeyframe {
+    offset: number;
+}
 /** Custom animation definition */
 interface CustomAnimation {
     from: AnimationKeyframe;
     to: AnimationKeyframe;
+    /** Optional intermediate keyframes (overshoot, bounce, …), played between `from` and `to`. */
+    frames?: AnimationFrame[];
 }
 /** Per-element animation options */
 interface AnimateOptions {
@@ -96,7 +110,7 @@ interface AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Staggered children
+ * motionary - Staggered children
  * Reveal a container's children one after another when the container scrolls
  * into view, optionally also animating children that are added later.
  */
@@ -114,7 +128,7 @@ interface StaggerOptions extends AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Vue 3 Integration
+ * motionary - Vue 3 Integration
  * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.
  *
  * A thin wrapper around the core engine, so it shares its behaviour: `once`,

package/dist/vue.d.ts

@@ -1,9 +1,15 @@
 /**
- * use-scroll-animate - Core Type Definitions
+ * motionary - Core Type Definitions
  * A lightweight, high-performance scroll animation library
  */
-/** Built-in animation presets */
-type AnimationPreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/** The 33 core presets (always available in `PRESETS`). */
+type CorePreset = 'fade-in' | 'fade-in-up' | 'fade-in-down' | 'fade-in-left' | 'fade-in-right' | 'zoom-in' | 'zoom-out' | 'flip-x' | 'flip-y' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right' | 'bounce' | 'rotate-in' | 'blur-in' | 'skew-in' | 'scale-x' | 'scale-y' | 'shimmer' | 'pulse' | 'swing' | 'scale-up' | 'blur-in-up' | 'flip-up' | 'flip-down' | 'rotate-left' | 'rotate-right' | 'clip-up' | 'clip-down' | 'clip-left' | 'clip-right' | 'clip-circle';
+/**
+ * Every built-in preset name: the core set plus the 6.1 extended set, which is
+ * available once `motionary/presets/extended` is loaded (or after
+ * `registerPresets(EXTENDED_PRESETS)`).
+ */
+type AnimationPreset = CorePreset | ExtendedPreset;
 /**
  * How `onProgress` / `progressVar` progress is measured.
  * - `'ratio'` (default): the element's visible ratio (IntersectionObserver `intersectionRatio`).
@@ -22,16 +28,24 @@ type ProgressMode = 'ratio' | 'scroll';
  *   since those only mean something for a time-based animation.
  */
 type ScrollEngine = 'auto' | 'js' | 'css';
+/** The 6.1 extended presets (`motionary/presets/extended`). */
+type ExtendedPreset = 'fade-in-up-sm' | 'fade-in-down-sm' | 'fade-in-left-sm' | 'fade-in-right-sm' | 'fade-in-up-lg' | 'fade-in-down-lg' | 'fade-in-left-lg' | 'fade-in-right-lg' | 'fade-in-up-left' | 'fade-in-up-right' | 'fade-in-down-left' | 'fade-in-down-right' | 'fade-in-scale' | 'fade-in-half' | 'zoom-in-up' | 'zoom-in-down' | 'zoom-in-left' | 'zoom-in-right' | 'zoom-out-up' | 'zoom-out-down' | 'zoom-out-left' | 'zoom-out-right' | 'zoom-in-big' | 'zoom-out-big' | 'zoom-bounce' | 'zoom-in-rotate' | 'scale-x-left' | 'scale-x-right' | 'scale-y-top' | 'scale-y-bottom' | 'stretch-x' | 'stretch-y' | 'flip-x-reverse' | 'flip-y-reverse' | 'flip-y-full' | 'flip-diagonal' | 'flip-diagonal-reverse' | 'flip-left' | 'flip-right' | 'unfold-down' | 'unfold-up' | 'door-open-left' | 'door-open-right' | 'fold-in' | 'flip-x-bounce' | 'flip-y-bounce' | 'swing-in-top' | 'swing-in-bottom' | 'swing-in-left' | 'swing-in-right' | 'slide-up-spring' | 'slide-down-spring' | 'slide-left-spring' | 'slide-right-spring' | 'slide-up-sm' | 'slide-down-sm' | 'back-in-up' | 'back-in-down' | 'back-in-left' | 'back-in-right' | 'light-speed-in-left' | 'light-speed-in-right' | 'rise-in' | 'sink-in' | 'float-in-up' | 'float-in-down' | 'roll-in-left' | 'roll-in-right' | 'spiral-in' | 'spiral-in-reverse' | 'spin-in' | 'rotate-in-up-left' | 'rotate-in-up-right' | 'rotate-in-down-left' | 'rotate-in-down-right' | 'skew-in-left' | 'skew-in-y' | 'shear-in' | 'shear-in-reverse' | 'twist-in' | 'tilt-in-left' | 'tilt-in-right' | 'blur-in-down' | 'blur-in-left' | 'blur-in-right' | 'blur-in-strong' | 'blur-in-zoom' | 'blur-in-scale' | 'blur-in-x' | 'mask-up' | 'mask-down' | 'mask-left' | 'mask-right' | 'blur-mask-up' | 'clip-circle-top' | 'clip-circle-bottom' | 'clip-circle-left' | 'clip-circle-right' | 'clip-circle-corner' | 'clip-ellipse' | 'clip-diamond' | 'clip-split-x' | 'clip-split-y' | 'clip-box' | 'clip-pill' | 'clip-blinds' | 'clip-blinds-x' | 'clip-diagonal' | 'clip-diagonal-reverse' | 'clip-slant-right' | 'clip-slant-left' | 'bounce-in' | 'bounce-in-up' | 'bounce-in-down' | 'bounce-in-left' | 'bounce-in-right' | 'elastic-in' | 'elastic-in-x' | 'rubber-in' | 'jello-in' | 'wobble-in' | 'tada-in' | 'heartbeat-in' | 'drop-in' | 'pop-in' | 'squash-in' | 'shake-in' | 'swing-in' | 'brightness-in' | 'darken-in' | 'color-in' | 'saturate-in' | 'hue-in' | 'sepia-in' | 'invert-in' | 'contrast-in' | 'exposure-in' | 'vintage-in' | 'blur-bright-in' | 'shadow-lift' | 'neon-glow-in' | 'glow-in' | 'perspective-in-up' | 'perspective-in-down' | 'perspective-in-left' | 'perspective-in-right' | 'depth-push' | 'depth-pull' | 'depth-in-up' | 'swoop-in-left' | 'swoop-in-right' | 'card-tilt-in' | 'glitch-in' | 'glitch-in-color' | 'typewriter' | 'typewriter-lines' | 'hinge-in' | 'flicker-in' | 'scan-in' | 'materialize' | 'teleport-in' | 'stagger-fade-up' | 'stagger-pop' | 'stagger-rise' | 'stagger-slide' | 'stagger-flip' | 'stagger-blur' | 'stagger-zoom' | 'stagger-drop' | 'scrub-parallax-up' | 'scrub-parallax-down' | 'scrub-rotate' | 'scrub-spin' | 'scrub-scale' | 'scrub-shrink' | 'scrub-pan-left' | 'scrub-pan-right' | 'scrub-tilt' | 'scrub-fade-through' | 'scrub-blur-through' | 'scrub-reveal-x';
 /** Easing function types */
 type EasingType = 'linear' | 'ease' | 'ease-in' | 'ease-out' | 'ease-in-out' | 'spring' | 'soft-spring' | 'heavy-bounce' | [number, number, number, number] | ((t: number) => number) | string;
 /** Keyframe definition for custom animations */
 interface AnimationKeyframe {
     [property: string]: string | number;
 }
+/** One intermediate keyframe of a preset: `offset` is 0 < offset < 1. */
+interface AnimationFrame extends AnimationKeyframe {
+    offset: number;
+}
 /** Custom animation definition */
 interface CustomAnimation {
     from: AnimationKeyframe;
     to: AnimationKeyframe;
+    /** Optional intermediate keyframes (overshoot, bounce, …), played between `from` and `to`. */
+    frames?: AnimationFrame[];
 }
 /** Per-element animation options */
 interface AnimateOptions {
@@ -96,7 +110,7 @@ interface AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Staggered children
+ * motionary - Staggered children
  * Reveal a container's children one after another when the container scrolls
  * into view, optionally also animating children that are added later.
  */
@@ -114,7 +128,7 @@ interface StaggerOptions extends AnimateOptions {
 }
 
 /**
- * use-scroll-animate - Vue 3 Integration
+ * motionary - Vue 3 Integration
  * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.
  *
  * A thin wrapper around the core engine, so it shares its behaviour: `once`,

package/dist/vue.js

@@ -1,8 +1,9 @@
-import { c as createScrollAnimate } from './chunks/core-mV_TPgG_.js';
-import { s as staggerChildren } from './chunks/stagger-BFAhKknX.js';
+import { c as createScrollAnimate } from './chunks/core-D7cVumUu.js';
+import { s as staggerChildren } from './chunks/stagger-DtMKo2SK.js';
+import './chunks/presets-BYBVJVeP.js';
 
 /**
- * use-scroll-animate - Vue 3 Integration
+ * motionary - Vue 3 Integration
  * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.
  *
  * A thin wrapper around the core engine, so it shares its behaviour: `once`,

package/dist/vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"vue.js","sources":["../src/vue.ts"],"sourcesContent":["/**\n * use-scroll-animate - Vue 3 Integration\n * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.\n *\n * A thin wrapper around the core engine, so it shares its behaviour: `once`,\n * `offset`, custom easing functions, progress, `prefers-reduced-motion`\n * support, and cleanup on unmount.\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\n/** Support refs on components (`$el`) as well as plain elements. */\nfunction unwrap(value: unknown): Element | null {\n  if (value && typeof Element !== 'undefined' && !(value instanceof Element) && (value as any).$el instanceof Element) {\n    return (value as any).$el as Element;\n  }\n  return (value as Element | null) || null;\n}\n\nexport function createVueComposables(Vue: {\n  ref: <T>(value: T | null) => { value: T | null };\n  onMounted: (fn: () => void) => void;\n  onUnmounted: (fn: () => void) => void;\n}) {\n  // Created lazily on the client so importing on the server is side-effect free.\n  let instance: ScrollAnimateInstance | null = null;\n  const getInstance = () => instance || (instance = createScrollAnimate());\n\n  function useScrollAnimate(options: AnimateOptions = {}) {\n    const animateRef = Vue.ref<Element>(null);\n    let el: Element | null = null;\n\n    Vue.onMounted(() => {\n      const target = unwrap(animateRef.value);\n      if (!target) return;\n      el = target;\n      getInstance().observe(el, options);\n    });\n\n    Vue.onUnmounted(() => {\n      if (el) getInstance().unobserve(el);\n      el = null;\n    });\n\n    return { animateRef };\n  }\n\n  /** Stagger the children of `staggerRef`; `observeChildren: true` also animates children added later. */\n  function useScrollStagger(options: StaggerOptions = {}) {\n    const staggerRef = Vue.ref<Element>(null);\n    let stop: (() => void) | undefined;\n\n    Vue.onMounted(() => {\n      const target = unwrap(staggerRef.value);\n      if (target) stop = staggerChildren(target, options, getInstance());\n    });\n\n    Vue.onUnmounted(() => {\n      stop?.();\n      stop = undefined;\n    });\n\n    return { staggerRef };\n  }\n\n  return { useScrollAnimate, useScrollStagger };\n}\n"],"names":[],"mappings":";;;AAAA;;;;;;;AAOG;AAMH;AACA,SAAS,MAAM,CAAC,KAAc,EAAA;IAC5B,IAAI,KAAK,IAAI,OAAO,OAAO,KAAK,WAAW,IAAI,EAAE,KAAK,YAAY,OAAO,CAAC,IAAK,KAAa,CAAC,GAAG,YAAY,OAAO,EAAE;QACnH,OAAQ,KAAa,CAAC,GAAc;IACtC;IACA,OAAQ,KAAwB,IAAI,IAAI;AAC1C;AAEM,SAAU,oBAAoB,CAAC,GAIpC,EAAA;;IAEC,IAAI,QAAQ,GAAiC,IAAI;AACjD,IAAA,MAAM,WAAW,GAAG,MAAM,QAAQ,KAAK,QAAQ,GAAG,mBAAmB,EAAE,CAAC;IAExE,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;QACzC,IAAI,EAAE,GAAmB,IAAI;AAE7B,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,CAAC,MAAM;gBAAE;YACb,EAAE,GAAG,MAAM;YACX,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC;AACpC,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;AACnB,YAAA,IAAI,EAAE;AAAE,gBAAA,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,CAAC;YACnC,EAAE,GAAG,IAAI;AACX,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;;IAGA,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;AACzC,QAAA,IAAI,IAA8B;AAElC,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,MAAM;gBAAE,IAAI,GAAG,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC;AACpE,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;YACnB,IAAI,IAAI;YACR,IAAI,GAAG,SAAS;AAClB,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;AAEA,IAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE;AAC/C;;;;"}
+{"version":3,"file":"vue.js","sources":["../src/vue.ts"],"sourcesContent":["/**\n * motionary - Vue 3 Integration\n * Provides useScrollAnimate and useScrollStagger composables for Vue 3 applications.\n *\n * A thin wrapper around the core engine, so it shares its behaviour: `once`,\n * `offset`, custom easing functions, progress, `prefers-reduced-motion`\n * support, and cleanup on unmount.\n */\n\nimport type { AnimateOptions, ScrollAnimateInstance } from './types';\nimport { createScrollAnimate } from './core';\nimport { staggerChildren, type StaggerOptions } from './stagger';\n\n/** Support refs on components (`$el`) as well as plain elements. */\nfunction unwrap(value: unknown): Element | null {\n  if (value && typeof Element !== 'undefined' && !(value instanceof Element) && (value as any).$el instanceof Element) {\n    return (value as any).$el as Element;\n  }\n  return (value as Element | null) || null;\n}\n\nexport function createVueComposables(Vue: {\n  ref: <T>(value: T | null) => { value: T | null };\n  onMounted: (fn: () => void) => void;\n  onUnmounted: (fn: () => void) => void;\n}) {\n  // Created lazily on the client so importing on the server is side-effect free.\n  let instance: ScrollAnimateInstance | null = null;\n  const getInstance = () => instance || (instance = createScrollAnimate());\n\n  function useScrollAnimate(options: AnimateOptions = {}) {\n    const animateRef = Vue.ref<Element>(null);\n    let el: Element | null = null;\n\n    Vue.onMounted(() => {\n      const target = unwrap(animateRef.value);\n      if (!target) return;\n      el = target;\n      getInstance().observe(el, options);\n    });\n\n    Vue.onUnmounted(() => {\n      if (el) getInstance().unobserve(el);\n      el = null;\n    });\n\n    return { animateRef };\n  }\n\n  /** Stagger the children of `staggerRef`; `observeChildren: true` also animates children added later. */\n  function useScrollStagger(options: StaggerOptions = {}) {\n    const staggerRef = Vue.ref<Element>(null);\n    let stop: (() => void) | undefined;\n\n    Vue.onMounted(() => {\n      const target = unwrap(staggerRef.value);\n      if (target) stop = staggerChildren(target, options, getInstance());\n    });\n\n    Vue.onUnmounted(() => {\n      stop?.();\n      stop = undefined;\n    });\n\n    return { staggerRef };\n  }\n\n  return { useScrollAnimate, useScrollStagger };\n}\n"],"names":[],"mappings":";;;;AAAA;;;;;;;AAOG;AAMH;AACA,SAAS,MAAM,CAAC,KAAc,EAAA;IAC5B,IAAI,KAAK,IAAI,OAAO,OAAO,KAAK,WAAW,IAAI,EAAE,KAAK,YAAY,OAAO,CAAC,IAAK,KAAa,CAAC,GAAG,YAAY,OAAO,EAAE;QACnH,OAAQ,KAAa,CAAC,GAAc;IACtC;IACA,OAAQ,KAAwB,IAAI,IAAI;AAC1C;AAEM,SAAU,oBAAoB,CAAC,GAIpC,EAAA;;IAEC,IAAI,QAAQ,GAAiC,IAAI;AACjD,IAAA,MAAM,WAAW,GAAG,MAAM,QAAQ,KAAK,QAAQ,GAAG,mBAAmB,EAAE,CAAC;IAExE,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;QACzC,IAAI,EAAE,GAAmB,IAAI;AAE7B,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,CAAC,MAAM;gBAAE;YACb,EAAE,GAAG,MAAM;YACX,WAAW,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,OAAO,CAAC;AACpC,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;AACnB,YAAA,IAAI,EAAE;AAAE,gBAAA,WAAW,EAAE,CAAC,SAAS,CAAC,EAAE,CAAC;YACnC,EAAE,GAAG,IAAI;AACX,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;;IAGA,SAAS,gBAAgB,CAAC,OAAA,GAA0B,EAAE,EAAA;QACpD,MAAM,UAAU,GAAG,GAAG,CAAC,GAAG,CAAU,IAAI,CAAC;AACzC,QAAA,IAAI,IAA8B;AAElC,QAAA,GAAG,CAAC,SAAS,CAAC,MAAK;YACjB,MAAM,MAAM,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC;AACvC,YAAA,IAAI,MAAM;gBAAE,IAAI,GAAG,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,CAAC;AACpE,QAAA,CAAC,CAAC;AAEF,QAAA,GAAG,CAAC,WAAW,CAAC,MAAK;YACnB,IAAI,IAAI;YACR,IAAI,GAAG,SAAS;AAClB,QAAA,CAAC,CAAC;QAEF,OAAO,EAAE,UAAU,EAAE;IACvB;AAEA,IAAA,OAAO,EAAE,gBAAgB,EAAE,gBAAgB,EAAE;AAC/C;;;;"}

package/docs/API.md

@@ -1,6 +1,6 @@
 # API reference
 
-`use-scroll-animate` — every public export, option and attribute. See the [README](../README.md) for a tour, the [demo](../demo/index.html) to try every preset, and the migration guides for [AOS](./migration-from-aos.md) and [GSAP ScrollTrigger](./migration-from-gsap-scrolltrigger.md). Upgrading from 1.x: see [Upgrading to 2.0](./deprecations.md).
+`motionary` — every public export, option and attribute. See the [README](../README.md) for a tour, the [demo](../demo/index.html) to try every preset, and the migration guides for [AOS](./migration-from-aos.md) and [GSAP ScrollTrigger](./migration-from-gsap-scrolltrigger.md). Upgrading from 1.x: see [Upgrading to 2.0](./deprecations.md).
 
 - [Entry points](#entry-points)
 - [Default instance & `createScrollAnimate(config)`](#default-instance--createscrollanimateconfig)
@@ -17,23 +17,24 @@
 
 | Import | Contents |
 |---|---|
-| `use-scroll-animate` | Default instance, `createScrollAnimate`, `staggerChildren`, `timeline`, `parallax`, `getScrollProgress`, `supportsScrollTimeline`, `PRESETS`, `resolvePreset`, `resolveEasing`, `EASING_MAP`, all types |
-| `use-scroll-animate/react` | `createReactHooks(React)` |
-| `use-scroll-animate/vue` | `createVueComposables({ ref, onMounted, onUnmounted })` |
-| `use-scroll-animate/svelte` | `scrollAnimate`, `scrollStagger` actions |
-| `use-scroll-animate/solid` | `scrollAnimate`, `scrollStagger` directives, `useScrollAnimate()` (needs `solid-js`) |
-| `use-scroll-animate/element` | `defineScrollAnimate(tagName?, instance?)` for `<scroll-animate>` |
+| `motionary` | Default instance, `createScrollAnimate`, `staggerChildren`, `timeline`, `parallax`, `getScrollProgress`, `supportsScrollTimeline`, `PRESETS`, `registerPresets`, `reversePreset`, `resolvePreset`, `resolveEasing`, `EASING_MAP`, all types |
+| `motionary/presets/extended` | Registers the 181 extended presets on import (6.1). Exports `EXTENDED_PRESETS`, `EXTENDED_PRESET_CATEGORIES`, `registerExtendedPresets()`. `<script>`: `dist/presets-extended.umd.js` (global `ScrollAnimatePresets`) |
+| `motionary/react` | `createReactHooks(React)` |
+| `motionary/vue` | `createVueComposables({ ref, onMounted, onUnmounted })` |
+| `motionary/svelte` | `scrollAnimate`, `scrollStagger` actions |
+| `motionary/solid` | `scrollAnimate`, `scrollStagger` directives, `useScrollAnimate()` (needs `solid-js`) |
+| `motionary/element` | `defineScrollAnimate(tagName?, instance?)` for `<scroll-animate>` |
 | `dist/index.umd.js` | Global `ScrollAnimate` (`ScrollAnimate.default` is the instance, other exports as properties) |
 | `dist/element.umd.js` | Registers `<scroll-animate>` on load; global `ScrollAnimateElement` |
-| `use-scroll-animate/components` (+ `/components/reveal`, `/text`, `/interaction`, `/feedback`, `/background`, `/transitions`) | 30 animated `<usa-*>` Web Components, `defineComponents()`, `configureComponents()`, `toast()`, `viewTransition()`, `flip()` — see **[components.md](./components.md)** |
-| `dist/components.umd.js`, `use-scroll-animate/components.css` | Registers every `<usa-*>` on load (global `UsaComponents`); the component styles as a file |
+| `motionary/components` (+ `/components/reveal`, `/text`, `/interaction`, `/feedback`, `/background`, `/transitions`) | 30 animated `<usa-*>` Web Components, `defineComponents()`, `configureComponents()`, `toast()`, `viewTransition()`, `flip()` — see **[components.md](./components.md)** |
+| `dist/components.umd.js`, `motionary/components.css` | Registers every `<usa-*>` on load (global `UsaComponents`); the component styles as a file |
 
 Every entry is ESM-first (`import` → `.js` + `.d.ts`) with a CommonJS build (`require` → `.cjs` + `.d.cts`), SSR-safe (no DOM access at import), and has zero runtime dependencies.
 
 ## Default instance & `createScrollAnimate(config)`
 
 ```ts
-import ScrollAnimate, { createScrollAnimate } from 'use-scroll-animate';
+import ScrollAnimate, { createScrollAnimate } from 'motionary';
 
 ScrollAnimate.init();                               // shared default instance
 const sa = createScrollAnimate({ defaultDuration: 800, defaultEngine: 'auto' }); // isolated instance
@@ -102,7 +103,11 @@ Boolean attributes are true when present unless their value is `"false"`.
 
 ## Presets & easings
 
-`PRESETS` (`Record<AnimationPreset, { from, to }>`): `fade-in`, `fade-in-up`, `fade-in-down`, `fade-in-left`, `fade-in-right`, `zoom-in`, `zoom-out`, `scale-up`, `flip-x`, `flip-y`, `flip-up`, `flip-down`, `slide-up`, `slide-down`, `slide-left`, `slide-right`, `bounce`, `rotate-in`, `rotate-left`, `rotate-right`, `blur-in`, `blur-in-up`, `skew-in`, `scale-x`, `scale-y`, `clip-up`, `clip-down`, `clip-left`, `clip-right`, `clip-circle`, `shimmer`, `pulse`, `swing`.
+`PRESETS` (`{ from, to, frames? }` by name) — the 33 core presets: `fade-in`, `fade-in-up`, `fade-in-down`, `fade-in-left`, `fade-in-right`, `zoom-in`, `zoom-out`, `scale-up`, `flip-x`, `flip-y`, `flip-up`, `flip-down`, `slide-up`, `slide-down`, `slide-left`, `slide-right`, `bounce`, `rotate-in`, `rotate-left`, `rotate-right`, `blur-in`, `blur-in-up`, `skew-in`, `scale-x`, `scale-y`, `clip-up`, `clip-down`, `clip-left`, `clip-right`, `clip-circle`, `shimmer`, `pulse`, `swing`.
+
+**Extended presets (6.1)** — 181 more after `import 'motionary/presets/extended'` (or the `dist/presets-extended.umd.js` script); full list by category with keyframes in [presets.md](./presets.md). `PRESETS` is one table per page shared through `Symbol.for('use-scroll-animate.presets')`, so the ESM entries, the UMD bundle and `<usa-reveal effect>` / `<usa-stagger effect>` all see every registered preset.
+
+`registerPresets({ name: { from, to, frames? } })` adds or replaces presets (usable by name everywhere). `frames` are intermediate keyframes with `offset` 0–1 (exclusive) played between `from` and `to`; a keyframe may carry its own `easing` (e.g. `steps(16, end)`). Presets combined in an array use only `from` / `to`. `reversePreset(p)` returns the same keyframes backwards (used by `exit`). Scroll-linked `scrub-*` presets are meant for `{ engine: 'css', viewRange: ['cover 0%', 'cover 100%'] }`.
 
 `EASING_MAP`: `linear`, `ease`, `ease-in`, `ease-out`, `ease-in-out`, `spring`, `soft-spring`, `heavy-bounce`. `resolvePreset(animation)` and `resolveEasing(easing)` expose the resolution used internally.
 
@@ -112,7 +117,7 @@ Boolean attributes are true when present unless their value is `"false"`.
 Reveal the children of `container` one after another when it enters. `StaggerOptions` = `AnimateOptions` + `stagger` (default `80` ms) + `observeChildren` (MutationObserver for children added later). Stopping before the reveal makes the children visible.
 
 ### `timeline(options?)` → `Timeline` (4.0; replaces `sequence()`)
-One playhead for many WAAPI animations. `options` = `{ defaults: { duration = 600, easing, stagger }, speed, onUpdate(p), onComplete() }`. Build with `.to(target, keyframes | preset, { at, duration, easing, stagger })`, `.label(name, at?)`, `.call(fn, at?)`; positions `'>'` (default), `'<'`, `'-=ms'`, `'+=ms'`, `'<+=ms'`, `'label+=ms'` or ms (`resolvePosition()`). Control: `play(from?)` / `reverse()` (Promises), `pause()`, `seek(ms | label)`, `progress(p?)`, `scrub(el, { source: 'view' | 'scroll', engine: 'auto' | 'native' | 'js', axis, offset, smooth })` → stop (with `.native`), `cancel()`; read `duration`, `time`, `labels`. Presets: `TIMELINE_PRESETS`. Reduced motion jumps to the end. Also in `use-scroll-animate/components/timeline` with `<usa-timeline>`.
+One playhead for many WAAPI animations. `options` = `{ defaults: { duration = 600, easing, stagger }, speed, onUpdate(p), onComplete() }`. Build with `.to(target, keyframes | preset, { at, duration, easing, stagger })`, `.label(name, at?)`, `.call(fn, at?)`; positions `'>'` (default), `'<'`, `'-=ms'`, `'+=ms'`, `'<+=ms'`, `'label+=ms'` or ms (`resolvePosition()`). Control: `play(from?)` / `reverse()` (Promises), `pause()`, `seek(ms | label)`, `progress(p?)`, `scrub(el, { source: 'view' | 'scroll', engine: 'auto' | 'native' | 'js', axis, offset, smooth })` → stop (with `.native`), `cancel()`; read `duration`, `time`, `labels`. Presets: `TIMELINE_PRESETS`. Reduced motion jumps to the end. Also in `motionary/components/timeline` with `<usa-timeline>`.
 
 **4.1 — native scrub.** `scrub()` runs on the browser's `ViewTimeline` (default, range `cover`) or `ScrollTimeline` (`{ source: 'scroll' }`, the element is the scroll container) when available, so the playhead is driven off the main thread; each step becomes one scroll-driven animation over its slice of the range. It falls back to a rAF-throttled scroll listener without support, and whenever JS is needed: `smooth`, `offset`, `call()` cues, `onUpdate`, or `engine: 'js'`. `supportsNativeScrub(source?)` reports support. `<usa-timeline scrub>` uses it too (`data-native` is set; `scrub="scroll"`, `smooth`; 5.0 removed `scrub="js"`).