use-scroll-animate 4.1.0 → 4.2.0

package/CHANGELOG.md

@@ -7,6 +7,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [4.2.0] - 2026-10-08
+
+### Added
+- **Motion design tokens** — new entry `use-scroll-animate/components/tokens` (also re-exported from `use-scroll-animate/components`): one duration / easing / spring scale as CSS custom properties (`--usa-duration-fast`, `--usa-easing-emphasized`, `--usa-spring-bouncy-stiffness`…), W3C Design Tokens (DTCG) JSON and JS values.
+  - `MOTION_TOKENS` (durations `instant`→`slowest`, easings `standard` · `emphasized` · `decelerate` · `accelerate` · `spring` · `bounce`, springs `gentle` · `snappy` · `bouncy` · `wobbly` · `stiff`).
+  - `applyMotionTokens(partial?, root?)` (writes the vars, sets the active scale, returns undo), `motionToken()`, `motionVar()`, `getMotionTokens()`.
+  - `importMotionTokens(json)` reads **Figma Tokens / Tokens Studio** (`value` / `type`), **Style Dictionary** (nested `value`) and **DTCG** (`$value` / `$type`, incl. `transition` composites) exports; `motionTokensToCss()`, `motionTokensToVars()`, `motionTokensToJSON()`.
+  - Prebuilt `docs/motion-tokens.css` and `docs/motion.tokens.json`; guide in [docs/motion-tokens.md](./docs/motion-tokens.md).
+- `timeline()` steps and defaults accept token names: `{ duration: 'slow', easing: 'spring' }`.
+- Showcase: **applyMotionTokens()** card (Page & app-wide) — play a stagger at `fast` / `normal` / `slow` with any easing token.
+
 ## [4.1.0] - 2026-10-08
 
 ### Added

package/dist/chunks/{core-CLu8ZrC-.cjs → core-BRIIoKeS.cjs}

@@ -1,6 +1,7 @@
 'use strict';
 
 var base = require('./base-CXx7jZ-o.cjs');
+var components_tokens = require('../components/tokens.cjs');
 
 /** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */
 function supportsNativeScrub(source = 'view') {
@@ -134,12 +135,12 @@ function timeline(options = {}) {
         to(target, frames, o = {}) {
             const kf = typeof frames === 'string' ? TIMELINE_PRESETS[frames] || TIMELINE_PRESETS.fade : frames;
             const start = resolvePosition(o.at, end, prevStart, labels);
-            const duration = o.duration ?? d.duration;
+            const duration = components_tokens.resolveDurationToken(o.duration ?? d.duration, 600);
             const stagger = o.stagger ?? d.stagger;
             let last = start;
             toEls(target).forEach((el, i) => {
                 const s = start + i * stagger;
-                steps.push({ el, frames: kf, start: s, duration, easing: o.easing ?? d.easing });
+                steps.push({ el, frames: kf, start: s, duration, easing: components_tokens.resolveEasingToken(o.easing ?? d.easing, 'cubic-bezier(0.22, 1, 0.36, 1)') });
                 last = Math.max(last, s + duration);
             });
             prevStart = start;
@@ -261,4 +262,4 @@ exports.TIMELINE_PRESETS = TIMELINE_PRESETS;
 exports.resolvePosition = resolvePosition;
 exports.supportsNativeScrub = supportsNativeScrub;
 exports.timeline = timeline;
-//# sourceMappingURL=core-CLu8ZrC-.cjs.map
+//# sourceMappingURL=core-BRIIoKeS.cjs.map

package/dist/chunks/core-BRIIoKeS.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"core-BRIIoKeS.cjs","sources":["../../src/components/timeline/core.ts"],"sourcesContent":["import { prefersReducedMotion, motionScale, applyFrame, raf, caf, now, clamp } from '../base';\nimport { resolveDurationToken, resolveEasingToken } from '../tokens/index';\n\n/**\n * Where a step starts on a timeline:\n * - a number: absolute time in ms\n * - `'>'` (default): when the previous step ends · `'<'`: when it starts\n * - `'+=200'` / `'-=200'`: after / overlapping the previous end\n * - `'<+=100'`: 100ms after the previous step's start\n * - `'intro'` / `'intro+=150'`: at (or relative to) a label\n */\nexport type TimelinePosition = number | string;\n\nexport interface TimelineStepOptions {\n  /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */\n  duration?: number | string;\n  /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */\n  easing?: string;\n  /** Start position, see `TimelinePosition`. */\n  at?: TimelinePosition;\n  /** ms between targets when the selector matches several elements. */\n  stagger?: number;\n}\n\nexport interface TimelineOptions {\n  /** Defaults for every step. */\n  defaults?: Pick<TimelineStepOptions, 'duration' | 'easing' | 'stagger'>;\n  /** Playback rate (1 = normal). */\n  speed?: number;\n  /** Called after `play()` reaches the end (or the start when reversed). */\n  onComplete?: () => void;\n  /** Called on every frame with progress 0–1. */\n  onUpdate?: (progress: number) => void;\n}\n\nexport interface ScrubOptions {\n  /** Scroll offset (px) before the source's top reaches the viewport bottom where progress starts (JS engine only). */\n  offset?: number;\n  /** Smoothing 0–1 (0 = immediate, default 0). Smoothing needs the JS engine. */\n  smooth?: number;\n  /**\n   * 4.1: which progress source drives the timeline.\n   * - `'view'` (default): `source` moving through the viewport (CSS `ViewTimeline`, range `cover`).\n   * - `'scroll'`: the scroll position of `source` itself (a scroll container; CSS `ScrollTimeline`).\n   */\n  source?: 'view' | 'scroll';\n  /** 4.1: `'auto'` (default) uses the browser's native scroll-driven animations when available, `'js'` forces the fallback. */\n  engine?: 'auto' | 'native' | 'js';\n  /** 4.1: scroll axis, `'block'` (default) · `'inline'` · `'x'` · `'y'`. */\n  axis?: 'block' | 'inline' | 'x' | 'y';\n}\n\n/** The function `scrub()` returns: call it to stop. `native` tells which engine runs it. */\nexport interface ScrubHandle {\n  (): void;\n  /** `true` when the browser's ScrollTimeline / ViewTimeline drives it (compositor, no JS per frame). */\n  readonly native: boolean;\n}\n\n/** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */\nexport function supportsNativeScrub(source: 'view' | 'scroll' = 'view'): boolean {\n  const g = globalThis as any;\n  return typeof g[source === 'scroll' ? 'ScrollTimeline' : 'ViewTimeline'] === 'function' && typeof g.Element?.prototype?.animate === 'function';\n}\n\nconst handle = (stop: () => void, native: boolean): ScrubHandle => Object.assign(stop, { native }) as ScrubHandle;\n\nexport interface Timeline {\n  /** Total length in ms. */\n  readonly duration: number;\n  /** Label positions in ms. */\n  readonly labels: Readonly<Record<string, number>>;\n  /** Current playhead in ms. */\n  readonly time: number;\n  /** Add a step: animate `target` with keyframes or a preset name (`fade-up`, `scale`…). */\n  to(target: string | Element | Element[] | NodeList, frames: Keyframe[] | string, options?: TimelineStepOptions): Timeline;\n  /** Name a position (default: the current end). */\n  label(name: string, at?: TimelinePosition): Timeline;\n  /** Run `fn` when the playhead passes `at`. */\n  call(fn: () => void, at?: TimelinePosition): Timeline;\n  /** Play forwards from the playhead (from 0 when at the end). Resolves at the end. */\n  play(from?: TimelinePosition): Promise<void>;\n  /** Play backwards to 0. */\n  reverse(): Promise<void>;\n  pause(): Timeline;\n  /** Jump to a time (ms) or label. */\n  seek(to: TimelinePosition): Timeline;\n  /** Get or set progress 0–1. */\n  progress(p?: number): number;\n  /**\n   * Tie progress to scroll: `source` moving through the viewport (or, with\n   * `{ source: 'scroll' }`, a scroll container's own position). Runs on native\n   * ScrollTimeline / ViewTimeline when available (and no `smooth`, `offset`,\n   * `call()` cues or `onUpdate` need JS), else on a rAF-throttled listener.\n   * Returns a stop function with a `native` flag.\n   */\n  scrub(source: Element, options?: ScrubOptions): ScrubHandle;\n  /** Stop and drop every animation (elements keep their last frame). */\n  cancel(): void;\n}\n\n/** Keyframe presets usable by name in `to()` and `data-tl`. */\nexport const TIMELINE_PRESETS: Record<string, Keyframe[]> = {\n  fade: [{ opacity: 0 }, { opacity: 1 }],\n  'fade-up': [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-down': [{ opacity: 0, transform: 'translateY(-24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-left': [{ opacity: 0, transform: 'translateX(24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-right': [{ opacity: 0, transform: 'translateX(-24px)' }, { opacity: 1, transform: 'none' }],\n  scale: [{ opacity: 0, transform: 'scale(0.85)' }, { opacity: 1, transform: 'none' }],\n  blur: [{ opacity: 0, filter: 'blur(12px)' }, { opacity: 1, filter: 'blur(0)' }],\n  rotate: [{ opacity: 0, transform: 'rotate(-12deg) scale(0.9)' }, { opacity: 1, transform: 'none' }],\n  'clip-up': [{ clipPath: 'inset(100% 0 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],\n  'clip-right': [{ clipPath: 'inset(0 100% 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],\n};\n\n/** Resolve a position against the previous step and labels (pure). */\nexport function resolvePosition(\n  pos: TimelinePosition | undefined,\n  end: number,\n  prevStart: number,\n  labels: Record<string, number> = {}\n): number {\n  if (pos === undefined || pos === '' || pos === '>') return end;\n  if (typeof pos === 'number') return Math.max(0, pos);\n  const s = String(pos).trim();\n  if (/^-?\\d+(\\.\\d+)?$/.test(s)) return Math.max(0, Number(s));\n  const m = /^(<|>|[A-Za-z_][\\w-]*)?\\s*(?:([+-])=\\s*(\\d+(?:\\.\\d+)?))?$/.exec(s);\n  if (!m) return end;\n  const base = m[1] === '<' ? prevStart : m[1] === '>' || !m[1] ? end : labels[m[1]] ?? end;\n  const delta = m[2] ? (m[2] === '-' ? -1 : 1) * Number(m[3]) : 0;\n  return Math.max(0, base + delta);\n}\n\nconst toEls = (t: string | Element | Element[] | NodeList): Element[] =>\n  typeof t === 'string' ? (typeof document === 'undefined' ? [] : Array.from(document.querySelectorAll(t))) : t instanceof Element ? [t] : Array.from(t as ArrayLike<Element>);\n\ninterface Step { el: Element; frames: Keyframe[]; start: number; duration: number; easing: string; anim?: Animation | null }\ninterface Cue { fn: () => void; at: number }\n\n/**\n * Choreograph animations on one clock: chain, overlap, label, seek, reverse and\n * scrub them with scroll. Built on WAAPI (paused animations driven by one\n * playhead); without WAAPI or under reduced motion it jumps to the end state.\n *\n * @example\n * const tl = timeline({ defaults: { duration: 500 } })\n *   .to('.title', 'fade-up')\n *   .label('cards')\n *   .to('.card', 'scale', { stagger: 80, at: '-=200' })\n *   .to('.cta', [{ opacity: 0 }, { opacity: 1 }], { at: 'cards+=400' });\n * tl.play();             // or tl.scrub(document.querySelector('.hero'))\n */\nexport function timeline(options: TimelineOptions = {}): Timeline {\n  const d = { duration: 600, easing: 'cubic-bezier(0.22, 1, 0.36, 1)', stagger: 0, ...options.defaults };\n  const steps: Step[] = [];\n  const cues: Cue[] = [];\n  const labels: Record<string, number> = {};\n  let end = 0;\n  let prevStart = 0;\n  let t = 0;\n  let frame = 0;\n  let dir = 1;\n  let settle: (() => void) | undefined;\n  let built = false;\n\n  const total = () => Math.max(end, ...cues.map((c) => c.at), 0);\n  const build = () => {\n    if (built) return;\n    built = true;\n    for (const s of steps) {\n      if (typeof (s.el as HTMLElement).animate !== 'function') { s.anim = null; continue; }\n      s.anim = (s.el as HTMLElement).animate(s.frames, { duration: s.duration, delay: s.start, easing: s.easing, fill: 'both' });\n      s.anim.pause?.();\n    }\n  };\n  const render = (to: number, from: number) => {\n    build();\n    t = clamp(to, 0, total());\n    for (const s of steps) {\n      if (s.anim) s.anim.currentTime = t;\n      else applyFrame(s.el as HTMLElement, s.frames[t >= s.start ? s.frames.length - 1 : 0]);\n    }\n    for (const c of cues) if ((from < c.at && t >= c.at) || (from > c.at && t <= c.at)) c.fn();\n    options.onUpdate?.(total() ? t / total() : 1);\n  };\n  const stop = () => {\n    if (frame) caf(frame);\n    frame = 0;\n  };\n  const run = (direction: number): Promise<void> => {\n    stop();\n    settle?.();\n    dir = direction;\n    const target = dir > 0 ? total() : 0;\n    const k = motionScale();\n    if (prefersReducedMotion() || k === 0 || !total()) {\n      render(target, t);\n      options.onComplete?.();\n      return Promise.resolve();\n    }\n    const rate = (options.speed ?? 1) / k;\n    return new Promise<void>((resolve) => {\n      settle = () => { settle = undefined; resolve(); };\n      let last = now();\n      const loop = () => {\n        const n = now();\n        const next = t + (n - last) * rate * dir;\n        last = n;\n        render(next, t);\n        if ((dir > 0 && t >= target) || (dir < 0 && t <= 0)) {\n          frame = 0;\n          options.onComplete?.();\n          settle?.();\n          return;\n        }\n        frame = raf(loop);\n      };\n      frame = raf(loop);\n    });\n  };\n\n  const api: Timeline = {\n    get duration() { return total(); },\n    get labels() { return { ...labels }; },\n    get time() { return t; },\n    to(target, frames, o = {}) {\n      const kf = typeof frames === 'string' ? TIMELINE_PRESETS[frames] || TIMELINE_PRESETS.fade : frames;\n      const start = resolvePosition(o.at, end, prevStart, labels);\n      const duration = resolveDurationToken(o.duration ?? d.duration, 600);\n      const stagger = o.stagger ?? d.stagger;\n      let last = start;\n      toEls(target).forEach((el, i) => {\n        const s = start + i * stagger;\n        steps.push({ el, frames: kf, start: s, duration, easing: resolveEasingToken(o.easing ?? d.easing, 'cubic-bezier(0.22, 1, 0.36, 1)') });\n        last = Math.max(last, s + duration);\n      });\n      prevStart = start;\n      end = Math.max(end, last);\n      built = false;\n      steps.forEach((s) => s.anim?.cancel?.());\n      return api;\n    },\n    label(name, at) {\n      labels[name] = resolvePosition(at, end, prevStart, labels);\n      return api;\n    },\n    call(fn, at) {\n      cues.push({ fn, at: resolvePosition(at, end, prevStart, labels) });\n      return api;\n    },\n    play(from) {\n      if (from !== undefined) render(resolvePosition(from, 0, 0, labels), t);\n      else if (t >= total()) render(0, -1);\n      return run(1);\n    },\n    reverse() {\n      return run(-1);\n    },\n    pause() {\n      stop();\n      return api;\n    },\n    seek(to) {\n      stop();\n      render(resolvePosition(to, 0, 0, labels), t);\n      return api;\n    },\n    progress(p) {\n      if (p !== undefined) api.seek(clamp(p, 0, 1) * total());\n      return total() ? t / total() : 0;\n    },\n    scrub(source, o = {}) {\n      stop();\n      if (prefersReducedMotion() || typeof window === 'undefined') {\n        render(total(), t);\n        return handle(() => {}, false);\n      }\n      const mode = o.source ?? 'view';\n      const axis = o.axis ?? 'block';\n      const needsJs = !!o.smooth || !!o.offset || cues.length > 0 || !!options.onUpdate || o.engine === 'js';\n      if (!needsJs && total() > 0 && supportsNativeScrub(mode) && steps.every((st) => typeof (st.el as HTMLElement).animate === 'function')) {\n        // Native: one scroll-driven animation per step, its slice of the\n        // timeline mapped onto the scroll range (`cover` for a view timeline).\n        const g = globalThis as any;\n        const tl = mode === 'scroll' ? new g.ScrollTimeline({ source, axis }) : new g.ViewTimeline({ subject: source, axis });\n        const T = total();\n        steps.forEach((st) => st.anim?.cancel?.());\n        built = false;\n        const pct = (ms: number) => `${((ms / T) * 100).toFixed(3)}%`;\n        const live = steps.map((st) => {\n          const range = mode === 'view' ? { rangeStart: `cover ${pct(st.start)}`, rangeEnd: `cover ${pct(st.start + st.duration)}` } : {};\n          const timing: any = { easing: st.easing, fill: 'both', timeline: tl, ...range };\n          if (mode === 'scroll') Object.assign(timing, { duration: 'auto', rangeStart: pct(st.start), rangeEnd: pct(st.start + st.duration) });\n          return (st.el as HTMLElement).animate(st.frames, timing);\n        });\n        return handle(() => {\n          live.forEach((a) => a.cancel());\n          render(t, t);\n        }, true);\n      }\n      let id = 0;\n      let cur = t;\n      const scroller = mode === 'scroll' ? (source as HTMLElement) : null;\n      const progressNow = () => {\n        const x = axis === 'x' || axis === 'inline';\n        if (scroller) {\n          const max = x ? scroller.scrollWidth - scroller.clientWidth : scroller.scrollHeight - scroller.clientHeight;\n          return clamp((x ? scroller.scrollLeft : scroller.scrollTop) / (max || 1), 0, 1);\n        }\n        const r = source.getBoundingClientRect();\n        const vh = (x ? window.innerWidth : window.innerHeight) || 1;\n        const start = x ? r.left : r.top;\n        const size = x ? r.width : r.height;\n        return clamp((vh + (o.offset ?? 0) - start) / (vh + size || 1), 0, 1);\n      };\n      const update = () => {\n        id = 0;\n        const goal = progressNow() * total();\n        const sm = clamp(o.smooth ?? 0, 0, 0.95);\n        cur = sm ? cur + (goal - cur) * (1 - sm) : goal;\n        render(cur, t);\n        if (sm && Math.abs(goal - cur) > 0.5) id = raf(update);\n      };\n      const onScroll = () => { if (!id) id = raf(update); };\n      const target: EventTarget = scroller || window;\n      target.addEventListener('scroll', onScroll, { passive: true });\n      window.addEventListener('resize', onScroll, { passive: true });\n      update();\n      return handle(() => {\n        target.removeEventListener('scroll', onScroll);\n        window.removeEventListener('resize', onScroll);\n        if (id) caf(id);\n      }, false);\n    },\n    cancel() {\n      stop();\n      settle?.();\n      steps.forEach((s) => s.anim?.cancel?.());\n      built = false;\n    },\n  };\n  return api;\n}\n"],"names":["clamp","applyFrame","caf","motionScale","prefersReducedMotion","now","raf","resolveDurationToken","resolveEasingToken"],"mappings":"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"}

package/dist/chunks/{core-QTFk4kgO.js → core-LkGRmgES.js}

@@ -1,4 +1,5 @@
 import { p as prefersReducedMotion, b as clamp, d as caf, e as applyFrame, r as raf, m as motionScale, n as now } from './base-BPG5zvex.js';
+import { resolveDurationToken, resolveEasingToken } from '../components/tokens.js';
 
 /** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */
 function supportsNativeScrub(source = 'view') {
@@ -132,12 +133,12 @@ function timeline(options = {}) {
         to(target, frames, o = {}) {
             const kf = typeof frames === 'string' ? TIMELINE_PRESETS[frames] || TIMELINE_PRESETS.fade : frames;
             const start = resolvePosition(o.at, end, prevStart, labels);
-            const duration = o.duration ?? d.duration;
+            const duration = resolveDurationToken(o.duration ?? d.duration, 600);
             const stagger = o.stagger ?? d.stagger;
             let last = start;
             toEls(target).forEach((el, i) => {
                 const s = start + i * stagger;
-                steps.push({ el, frames: kf, start: s, duration, easing: o.easing ?? d.easing });
+                steps.push({ el, frames: kf, start: s, duration, easing: resolveEasingToken(o.easing ?? d.easing, 'cubic-bezier(0.22, 1, 0.36, 1)') });
                 last = Math.max(last, s + duration);
             });
             prevStart = start;
@@ -256,4 +257,4 @@ function timeline(options = {}) {
 }
 
 export { TIMELINE_PRESETS as T, resolvePosition as r, supportsNativeScrub as s, timeline as t };
-//# sourceMappingURL=core-QTFk4kgO.js.map
+//# sourceMappingURL=core-LkGRmgES.js.map

package/dist/chunks/core-LkGRmgES.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"core-LkGRmgES.js","sources":["../../src/components/timeline/core.ts"],"sourcesContent":["import { prefersReducedMotion, motionScale, applyFrame, raf, caf, now, clamp } from '../base';\nimport { resolveDurationToken, resolveEasingToken } from '../tokens/index';\n\n/**\n * Where a step starts on a timeline:\n * - a number: absolute time in ms\n * - `'>'` (default): when the previous step ends · `'<'`: when it starts\n * - `'+=200'` / `'-=200'`: after / overlapping the previous end\n * - `'<+=100'`: 100ms after the previous step's start\n * - `'intro'` / `'intro+=150'`: at (or relative to) a label\n */\nexport type TimelinePosition = number | string;\n\nexport interface TimelineStepOptions {\n  /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */\n  duration?: number | string;\n  /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */\n  easing?: string;\n  /** Start position, see `TimelinePosition`. */\n  at?: TimelinePosition;\n  /** ms between targets when the selector matches several elements. */\n  stagger?: number;\n}\n\nexport interface TimelineOptions {\n  /** Defaults for every step. */\n  defaults?: Pick<TimelineStepOptions, 'duration' | 'easing' | 'stagger'>;\n  /** Playback rate (1 = normal). */\n  speed?: number;\n  /** Called after `play()` reaches the end (or the start when reversed). */\n  onComplete?: () => void;\n  /** Called on every frame with progress 0–1. */\n  onUpdate?: (progress: number) => void;\n}\n\nexport interface ScrubOptions {\n  /** Scroll offset (px) before the source's top reaches the viewport bottom where progress starts (JS engine only). */\n  offset?: number;\n  /** Smoothing 0–1 (0 = immediate, default 0). Smoothing needs the JS engine. */\n  smooth?: number;\n  /**\n   * 4.1: which progress source drives the timeline.\n   * - `'view'` (default): `source` moving through the viewport (CSS `ViewTimeline`, range `cover`).\n   * - `'scroll'`: the scroll position of `source` itself (a scroll container; CSS `ScrollTimeline`).\n   */\n  source?: 'view' | 'scroll';\n  /** 4.1: `'auto'` (default) uses the browser's native scroll-driven animations when available, `'js'` forces the fallback. */\n  engine?: 'auto' | 'native' | 'js';\n  /** 4.1: scroll axis, `'block'` (default) · `'inline'` · `'x'` · `'y'`. */\n  axis?: 'block' | 'inline' | 'x' | 'y';\n}\n\n/** The function `scrub()` returns: call it to stop. `native` tells which engine runs it. */\nexport interface ScrubHandle {\n  (): void;\n  /** `true` when the browser's ScrollTimeline / ViewTimeline drives it (compositor, no JS per frame). */\n  readonly native: boolean;\n}\n\n/** 4.1: whether `scrub()` can use native ScrollTimeline / ViewTimeline here. */\nexport function supportsNativeScrub(source: 'view' | 'scroll' = 'view'): boolean {\n  const g = globalThis as any;\n  return typeof g[source === 'scroll' ? 'ScrollTimeline' : 'ViewTimeline'] === 'function' && typeof g.Element?.prototype?.animate === 'function';\n}\n\nconst handle = (stop: () => void, native: boolean): ScrubHandle => Object.assign(stop, { native }) as ScrubHandle;\n\nexport interface Timeline {\n  /** Total length in ms. */\n  readonly duration: number;\n  /** Label positions in ms. */\n  readonly labels: Readonly<Record<string, number>>;\n  /** Current playhead in ms. */\n  readonly time: number;\n  /** Add a step: animate `target` with keyframes or a preset name (`fade-up`, `scale`…). */\n  to(target: string | Element | Element[] | NodeList, frames: Keyframe[] | string, options?: TimelineStepOptions): Timeline;\n  /** Name a position (default: the current end). */\n  label(name: string, at?: TimelinePosition): Timeline;\n  /** Run `fn` when the playhead passes `at`. */\n  call(fn: () => void, at?: TimelinePosition): Timeline;\n  /** Play forwards from the playhead (from 0 when at the end). Resolves at the end. */\n  play(from?: TimelinePosition): Promise<void>;\n  /** Play backwards to 0. */\n  reverse(): Promise<void>;\n  pause(): Timeline;\n  /** Jump to a time (ms) or label. */\n  seek(to: TimelinePosition): Timeline;\n  /** Get or set progress 0–1. */\n  progress(p?: number): number;\n  /**\n   * Tie progress to scroll: `source` moving through the viewport (or, with\n   * `{ source: 'scroll' }`, a scroll container's own position). Runs on native\n   * ScrollTimeline / ViewTimeline when available (and no `smooth`, `offset`,\n   * `call()` cues or `onUpdate` need JS), else on a rAF-throttled listener.\n   * Returns a stop function with a `native` flag.\n   */\n  scrub(source: Element, options?: ScrubOptions): ScrubHandle;\n  /** Stop and drop every animation (elements keep their last frame). */\n  cancel(): void;\n}\n\n/** Keyframe presets usable by name in `to()` and `data-tl`. */\nexport const TIMELINE_PRESETS: Record<string, Keyframe[]> = {\n  fade: [{ opacity: 0 }, { opacity: 1 }],\n  'fade-up': [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-down': [{ opacity: 0, transform: 'translateY(-24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-left': [{ opacity: 0, transform: 'translateX(24px)' }, { opacity: 1, transform: 'none' }],\n  'fade-right': [{ opacity: 0, transform: 'translateX(-24px)' }, { opacity: 1, transform: 'none' }],\n  scale: [{ opacity: 0, transform: 'scale(0.85)' }, { opacity: 1, transform: 'none' }],\n  blur: [{ opacity: 0, filter: 'blur(12px)' }, { opacity: 1, filter: 'blur(0)' }],\n  rotate: [{ opacity: 0, transform: 'rotate(-12deg) scale(0.9)' }, { opacity: 1, transform: 'none' }],\n  'clip-up': [{ clipPath: 'inset(100% 0 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],\n  'clip-right': [{ clipPath: 'inset(0 100% 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],\n};\n\n/** Resolve a position against the previous step and labels (pure). */\nexport function resolvePosition(\n  pos: TimelinePosition | undefined,\n  end: number,\n  prevStart: number,\n  labels: Record<string, number> = {}\n): number {\n  if (pos === undefined || pos === '' || pos === '>') return end;\n  if (typeof pos === 'number') return Math.max(0, pos);\n  const s = String(pos).trim();\n  if (/^-?\\d+(\\.\\d+)?$/.test(s)) return Math.max(0, Number(s));\n  const m = /^(<|>|[A-Za-z_][\\w-]*)?\\s*(?:([+-])=\\s*(\\d+(?:\\.\\d+)?))?$/.exec(s);\n  if (!m) return end;\n  const base = m[1] === '<' ? prevStart : m[1] === '>' || !m[1] ? end : labels[m[1]] ?? end;\n  const delta = m[2] ? (m[2] === '-' ? -1 : 1) * Number(m[3]) : 0;\n  return Math.max(0, base + delta);\n}\n\nconst toEls = (t: string | Element | Element[] | NodeList): Element[] =>\n  typeof t === 'string' ? (typeof document === 'undefined' ? [] : Array.from(document.querySelectorAll(t))) : t instanceof Element ? [t] : Array.from(t as ArrayLike<Element>);\n\ninterface Step { el: Element; frames: Keyframe[]; start: number; duration: number; easing: string; anim?: Animation | null }\ninterface Cue { fn: () => void; at: number }\n\n/**\n * Choreograph animations on one clock: chain, overlap, label, seek, reverse and\n * scrub them with scroll. Built on WAAPI (paused animations driven by one\n * playhead); without WAAPI or under reduced motion it jumps to the end state.\n *\n * @example\n * const tl = timeline({ defaults: { duration: 500 } })\n *   .to('.title', 'fade-up')\n *   .label('cards')\n *   .to('.card', 'scale', { stagger: 80, at: '-=200' })\n *   .to('.cta', [{ opacity: 0 }, { opacity: 1 }], { at: 'cards+=400' });\n * tl.play();             // or tl.scrub(document.querySelector('.hero'))\n */\nexport function timeline(options: TimelineOptions = {}): Timeline {\n  const d = { duration: 600, easing: 'cubic-bezier(0.22, 1, 0.36, 1)', stagger: 0, ...options.defaults };\n  const steps: Step[] = [];\n  const cues: Cue[] = [];\n  const labels: Record<string, number> = {};\n  let end = 0;\n  let prevStart = 0;\n  let t = 0;\n  let frame = 0;\n  let dir = 1;\n  let settle: (() => void) | undefined;\n  let built = false;\n\n  const total = () => Math.max(end, ...cues.map((c) => c.at), 0);\n  const build = () => {\n    if (built) return;\n    built = true;\n    for (const s of steps) {\n      if (typeof (s.el as HTMLElement).animate !== 'function') { s.anim = null; continue; }\n      s.anim = (s.el as HTMLElement).animate(s.frames, { duration: s.duration, delay: s.start, easing: s.easing, fill: 'both' });\n      s.anim.pause?.();\n    }\n  };\n  const render = (to: number, from: number) => {\n    build();\n    t = clamp(to, 0, total());\n    for (const s of steps) {\n      if (s.anim) s.anim.currentTime = t;\n      else applyFrame(s.el as HTMLElement, s.frames[t >= s.start ? s.frames.length - 1 : 0]);\n    }\n    for (const c of cues) if ((from < c.at && t >= c.at) || (from > c.at && t <= c.at)) c.fn();\n    options.onUpdate?.(total() ? t / total() : 1);\n  };\n  const stop = () => {\n    if (frame) caf(frame);\n    frame = 0;\n  };\n  const run = (direction: number): Promise<void> => {\n    stop();\n    settle?.();\n    dir = direction;\n    const target = dir > 0 ? total() : 0;\n    const k = motionScale();\n    if (prefersReducedMotion() || k === 0 || !total()) {\n      render(target, t);\n      options.onComplete?.();\n      return Promise.resolve();\n    }\n    const rate = (options.speed ?? 1) / k;\n    return new Promise<void>((resolve) => {\n      settle = () => { settle = undefined; resolve(); };\n      let last = now();\n      const loop = () => {\n        const n = now();\n        const next = t + (n - last) * rate * dir;\n        last = n;\n        render(next, t);\n        if ((dir > 0 && t >= target) || (dir < 0 && t <= 0)) {\n          frame = 0;\n          options.onComplete?.();\n          settle?.();\n          return;\n        }\n        frame = raf(loop);\n      };\n      frame = raf(loop);\n    });\n  };\n\n  const api: Timeline = {\n    get duration() { return total(); },\n    get labels() { return { ...labels }; },\n    get time() { return t; },\n    to(target, frames, o = {}) {\n      const kf = typeof frames === 'string' ? TIMELINE_PRESETS[frames] || TIMELINE_PRESETS.fade : frames;\n      const start = resolvePosition(o.at, end, prevStart, labels);\n      const duration = resolveDurationToken(o.duration ?? d.duration, 600);\n      const stagger = o.stagger ?? d.stagger;\n      let last = start;\n      toEls(target).forEach((el, i) => {\n        const s = start + i * stagger;\n        steps.push({ el, frames: kf, start: s, duration, easing: resolveEasingToken(o.easing ?? d.easing, 'cubic-bezier(0.22, 1, 0.36, 1)') });\n        last = Math.max(last, s + duration);\n      });\n      prevStart = start;\n      end = Math.max(end, last);\n      built = false;\n      steps.forEach((s) => s.anim?.cancel?.());\n      return api;\n    },\n    label(name, at) {\n      labels[name] = resolvePosition(at, end, prevStart, labels);\n      return api;\n    },\n    call(fn, at) {\n      cues.push({ fn, at: resolvePosition(at, end, prevStart, labels) });\n      return api;\n    },\n    play(from) {\n      if (from !== undefined) render(resolvePosition(from, 0, 0, labels), t);\n      else if (t >= total()) render(0, -1);\n      return run(1);\n    },\n    reverse() {\n      return run(-1);\n    },\n    pause() {\n      stop();\n      return api;\n    },\n    seek(to) {\n      stop();\n      render(resolvePosition(to, 0, 0, labels), t);\n      return api;\n    },\n    progress(p) {\n      if (p !== undefined) api.seek(clamp(p, 0, 1) * total());\n      return total() ? t / total() : 0;\n    },\n    scrub(source, o = {}) {\n      stop();\n      if (prefersReducedMotion() || typeof window === 'undefined') {\n        render(total(), t);\n        return handle(() => {}, false);\n      }\n      const mode = o.source ?? 'view';\n      const axis = o.axis ?? 'block';\n      const needsJs = !!o.smooth || !!o.offset || cues.length > 0 || !!options.onUpdate || o.engine === 'js';\n      if (!needsJs && total() > 0 && supportsNativeScrub(mode) && steps.every((st) => typeof (st.el as HTMLElement).animate === 'function')) {\n        // Native: one scroll-driven animation per step, its slice of the\n        // timeline mapped onto the scroll range (`cover` for a view timeline).\n        const g = globalThis as any;\n        const tl = mode === 'scroll' ? new g.ScrollTimeline({ source, axis }) : new g.ViewTimeline({ subject: source, axis });\n        const T = total();\n        steps.forEach((st) => st.anim?.cancel?.());\n        built = false;\n        const pct = (ms: number) => `${((ms / T) * 100).toFixed(3)}%`;\n        const live = steps.map((st) => {\n          const range = mode === 'view' ? { rangeStart: `cover ${pct(st.start)}`, rangeEnd: `cover ${pct(st.start + st.duration)}` } : {};\n          const timing: any = { easing: st.easing, fill: 'both', timeline: tl, ...range };\n          if (mode === 'scroll') Object.assign(timing, { duration: 'auto', rangeStart: pct(st.start), rangeEnd: pct(st.start + st.duration) });\n          return (st.el as HTMLElement).animate(st.frames, timing);\n        });\n        return handle(() => {\n          live.forEach((a) => a.cancel());\n          render(t, t);\n        }, true);\n      }\n      let id = 0;\n      let cur = t;\n      const scroller = mode === 'scroll' ? (source as HTMLElement) : null;\n      const progressNow = () => {\n        const x = axis === 'x' || axis === 'inline';\n        if (scroller) {\n          const max = x ? scroller.scrollWidth - scroller.clientWidth : scroller.scrollHeight - scroller.clientHeight;\n          return clamp((x ? scroller.scrollLeft : scroller.scrollTop) / (max || 1), 0, 1);\n        }\n        const r = source.getBoundingClientRect();\n        const vh = (x ? window.innerWidth : window.innerHeight) || 1;\n        const start = x ? r.left : r.top;\n        const size = x ? r.width : r.height;\n        return clamp((vh + (o.offset ?? 0) - start) / (vh + size || 1), 0, 1);\n      };\n      const update = () => {\n        id = 0;\n        const goal = progressNow() * total();\n        const sm = clamp(o.smooth ?? 0, 0, 0.95);\n        cur = sm ? cur + (goal - cur) * (1 - sm) : goal;\n        render(cur, t);\n        if (sm && Math.abs(goal - cur) > 0.5) id = raf(update);\n      };\n      const onScroll = () => { if (!id) id = raf(update); };\n      const target: EventTarget = scroller || window;\n      target.addEventListener('scroll', onScroll, { passive: true });\n      window.addEventListener('resize', onScroll, { passive: true });\n      update();\n      return handle(() => {\n        target.removeEventListener('scroll', onScroll);\n        window.removeEventListener('resize', onScroll);\n        if (id) caf(id);\n      }, false);\n    },\n    cancel() {\n      stop();\n      settle?.();\n      steps.forEach((s) => s.anim?.cancel?.());\n      built = false;\n    },\n  };\n  return api;\n}\n"],"names":[],"mappings":"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"}

package/dist/components/angular.cjs

@@ -17,7 +17,8 @@ require('./click.cjs');
 require('./ui.cjs');
 require('./page.cjs');
 require('./timeline.cjs');
-require('../chunks/core-CLu8ZrC-.cjs');
+require('../chunks/core-BRIIoKeS.cjs');
+require('./tokens.cjs');
 require('./gesture.cjs');
 require('../chunks/core-IaorbTdu.cjs');
 require('./svg.cjs');

package/dist/components/angular.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"angular.cjs","sources":["../../src/components/frameworks/angular.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/angular — Angular integration (v3.8).\n * Angular renders `<usa-*>` tags once the component (or NgModule) allows\n * custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding\n * `[checked]=\"on\"` and event binding `(usa:change)=\"…\"` then work as is.\n * This entry is framework-free (no `@angular/*` import):\n *\n * ```ts\n * import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';\n * import { usaInitializer } from 'use-scroll-animate/components/angular';\n *\n * // app.config.ts\n * providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]\n *\n * @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],\n *   template: `<usa-toggle [checked]=\"on\" (usa:change)=\"on = $any($event).detail.checked\"></usa-toggle>` })\n * ```\n * `bindUsa(el, { props, on })` is available for directives that bind imperatively.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */\nexport function usaInitializer(categories?: ComponentCategory[]): () => () => void {\n  return () => () => {\n    if (typeof window !== 'undefined') defineComponents(categories);\n  };\n}\n\n/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)=\"on = usaDetail($event).checked\"`. */\nexport const usaDetail = <T = any>(e: Event): T => (e as CustomEvent<T>).detail;\n"],"names":["defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAMH;AACM,SAAU,cAAc,CAAC,UAAgC,EAAA;AAC7D,IAAA,OAAO,MAAM,MAAK;QAChB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAEA,2BAAgB,CAAC,UAAU,CAAC;AACjE,IAAA,CAAC;AACH;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEA,2BAAgB,CAAC,UAAU,CAAC;AACjE;AAEA;AACO,MAAM,SAAS,GAAG,CAAU,CAAQ,KAAS,CAAoB,CAAC;;;;;;;;"}
+{"version":3,"file":"angular.cjs","sources":["../../src/components/frameworks/angular.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/angular — Angular integration (v3.8).\n * Angular renders `<usa-*>` tags once the component (or NgModule) allows\n * custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding\n * `[checked]=\"on\"` and event binding `(usa:change)=\"…\"` then work as is.\n * This entry is framework-free (no `@angular/*` import):\n *\n * ```ts\n * import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';\n * import { usaInitializer } from 'use-scroll-animate/components/angular';\n *\n * // app.config.ts\n * providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]\n *\n * @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],\n *   template: `<usa-toggle [checked]=\"on\" (usa:change)=\"on = $any($event).detail.checked\"></usa-toggle>` })\n * ```\n * `bindUsa(el, { props, on })` is available for directives that bind imperatively.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */\nexport function usaInitializer(categories?: ComponentCategory[]): () => () => void {\n  return () => () => {\n    if (typeof window !== 'undefined') defineComponents(categories);\n  };\n}\n\n/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)=\"on = usaDetail($event).checked\"`. */\nexport const usaDetail = <T = any>(e: Event): T => (e as CustomEvent<T>).detail;\n"],"names":["defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAMH;AACM,SAAU,cAAc,CAAC,UAAgC,EAAA;AAC7D,IAAA,OAAO,MAAM,MAAK;QAChB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAEA,2BAAgB,CAAC,UAAU,CAAC;AACjE,IAAA,CAAC;AACH;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEA,2BAAgB,CAAC,UAAU,CAAC;AACjE;AAEA;AACO,MAAM,SAAS,GAAG,CAAU,CAAQ,KAAS,CAAoB,CAAC;;;;;;;;"}

package/dist/components/angular.d.cts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/angular.d.ts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/angular.js

@@ -15,7 +15,8 @@ import './click.js';
 import './ui.js';
 import './page.js';
 import './timeline.js';
-import '../chunks/core-QTFk4kgO.js';
+import '../chunks/core-LkGRmgES.js';
+import './tokens.js';
 import './gesture.js';
 import '../chunks/core-eXX8rB_b.js';
 import './svg.js';

package/dist/components/angular.js.map

@@ -1 +1 @@
-{"version":3,"file":"angular.js","sources":["../../src/components/frameworks/angular.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/angular — Angular integration (v3.8).\n * Angular renders `<usa-*>` tags once the component (or NgModule) allows\n * custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding\n * `[checked]=\"on\"` and event binding `(usa:change)=\"…\"` then work as is.\n * This entry is framework-free (no `@angular/*` import):\n *\n * ```ts\n * import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';\n * import { usaInitializer } from 'use-scroll-animate/components/angular';\n *\n * // app.config.ts\n * providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]\n *\n * @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],\n *   template: `<usa-toggle [checked]=\"on\" (usa:change)=\"on = $any($event).detail.checked\"></usa-toggle>` })\n * ```\n * `bindUsa(el, { props, on })` is available for directives that bind imperatively.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */\nexport function usaInitializer(categories?: ComponentCategory[]): () => () => void {\n  return () => () => {\n    if (typeof window !== 'undefined') defineComponents(categories);\n  };\n}\n\n/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)=\"on = usaDetail($event).checked\"`. */\nexport const usaDetail = <T = any>(e: Event): T => (e as CustomEvent<T>).detail;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAMH;AACM,SAAU,cAAc,CAAC,UAAgC,EAAA;AAC7D,IAAA,OAAO,MAAM,MAAK;QAChB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE,IAAA,CAAC;AACH;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;AAEA;AACO,MAAM,SAAS,GAAG,CAAU,CAAQ,KAAS,CAAoB,CAAC;;;;"}
+{"version":3,"file":"angular.js","sources":["../../src/components/frameworks/angular.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/angular — Angular integration (v3.8).\n * Angular renders `<usa-*>` tags once the component (or NgModule) allows\n * custom elements with `CUSTOM_ELEMENTS_SCHEMA`; property binding\n * `[checked]=\"on\"` and event binding `(usa:change)=\"…\"` then work as is.\n * This entry is framework-free (no `@angular/*` import):\n *\n * ```ts\n * import { CUSTOM_ELEMENTS_SCHEMA, Component, APP_INITIALIZER } from '@angular/core';\n * import { usaInitializer } from 'use-scroll-animate/components/angular';\n *\n * // app.config.ts\n * providers: [{ provide: APP_INITIALIZER, multi: true, useFactory: usaInitializer(['click', 'ui']) }]\n *\n * @Component({ standalone: true, schemas: [CUSTOM_ELEMENTS_SCHEMA],\n *   template: `<usa-toggle [checked]=\"on\" (usa:change)=\"on = $any($event).detail.checked\"></usa-toggle>` })\n * ```\n * `bindUsa(el, { props, on })` is available for directives that bind imperatively.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** `APP_INITIALIZER` factory: registers the elements in the browser (no-op during SSR). */\nexport function usaInitializer(categories?: ComponentCategory[]): () => () => void {\n  return () => () => {\n    if (typeof window !== 'undefined') defineComponents(categories);\n  };\n}\n\n/** Register the elements directly (e.g. in `main.ts` before `bootstrapApplication`). */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** Read `event.detail` from a `usa:*` event in a template handler: `(usa:change)=\"on = usaDetail($event).checked\"`. */\nexport const usaDetail = <T = any>(e: Event): T => (e as CustomEvent<T>).detail;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;AAkBG;AAMH;AACM,SAAU,cAAc,CAAC,UAAgC,EAAA;AAC7D,IAAA,OAAO,MAAM,MAAK;QAChB,IAAI,OAAO,MAAM,KAAK,WAAW;YAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE,IAAA,CAAC;AACH;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;AAEA;AACO,MAAM,SAAS,GAAG,CAAU,CAAQ,KAAS,CAAoB,CAAC;;;;"}

package/dist/components/solid.cjs

@@ -18,7 +18,8 @@ require('./click.cjs');
 require('./ui.cjs');
 require('./page.cjs');
 require('./timeline.cjs');
-require('../chunks/core-CLu8ZrC-.cjs');
+require('../chunks/core-BRIIoKeS.cjs');
+require('./tokens.cjs');
 require('./gesture.cjs');
 require('../chunks/core-IaorbTdu.cjs');
 require('./svg.cjs');

package/dist/components/solid.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"solid.cjs","sources":["../../src/components/frameworks/solid.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/solid — Solid integration (v3.8).\n * Solid renders custom elements natively: set properties with `prop:` and\n * listen with `on:` (`<usa-toggle prop:checked={on()} on:usa:change={…}>`).\n * This entry adds `defineUsa()` (client only, SolidStart-safe), a `usa`\n * directive for `use:usa={{ props, on }}`, and JSX types.\n *\n * ```tsx\n * import { defineUsa, usa } from 'use-scroll-animate/components/solid';\n * import type {} from 'use-scroll-animate/components/solid'; // JSX types\n * onMount(() => defineUsa());\n * false && usa; // keep the directive import (Solid convention)\n * <usa-card use:usa={{ on: { flip: (e) => console.log(e.detail) } }} effect=\"flip\">…</usa-card>\n * ```\n */\nimport { createRenderEffect, onCleanup } from 'solid-js';\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\nimport type { UsaIntrinsicElements } from './jsx';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/**\n * Solid directive (`use:usa`). Solid calls it with the element and an\n * accessor; since 4.0.1 the binding is tracked with `createRenderEffect`, so\n * signals read inside `{{ props, on }}` update the element automatically and\n * the listeners are removed on cleanup. `refresh()` is kept for code that\n * calls the directive outside a reactive owner.\n */\nexport function usa(el: HTMLElement, accessor: () => UsaBinding | undefined): { refresh(): void; destroy(): void } {\n  let b: ReturnType<typeof bindUsa> | null = null;\n  const run = () => {\n    const v = accessor() || {};\n    if (b) b.update(v);\n    else b = bindUsa(el, v);\n  };\n  createRenderEffect(run);\n  if (!b) run();\n  const destroy = () => b?.destroy();\n  onCleanup(destroy);\n  return { refresh: run, destroy };\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` in SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** JSX intrinsic elements for Solid (same attribute types as the React/Preact ones). */\nexport type SolidUsaIntrinsicElements = UsaIntrinsicElements;\n"],"names":["bindUsa","createRenderEffect","onCleanup","defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;AAcG;AASH;;;;;;AAMG;AACG,SAAU,GAAG,CAAC,EAAe,EAAE,QAAsC,EAAA;IACzE,IAAI,CAAC,GAAsC,IAAI;IAC/C,MAAM,GAAG,GAAG,MAAK;AACf,QAAA,MAAM,CAAC,GAAG,QAAQ,EAAE,IAAI,EAAE;AAC1B,QAAA,IAAI,CAAC;AAAE,YAAA,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;;AACb,YAAA,CAAC,GAAGA,YAAO,CAAC,EAAE,EAAE,CAAC,CAAC;AACzB,IAAA,CAAC;IACDC,0BAAkB,CAAC,GAAG,CAAC;AACvB,IAAA,IAAI,CAAC,CAAC;AAAE,QAAA,GAAG,EAAE;IACb,MAAM,OAAO,GAAG,MAAM,CAAC,EAAE,OAAO,EAAE;IAClCC,iBAAS,CAAC,OAAO,CAAC;AAClB,IAAA,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE;AAClC;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEC,2BAAgB,CAAC,UAAU,CAAC;AACjE;;;;;;;"}
+{"version":3,"file":"solid.cjs","sources":["../../src/components/frameworks/solid.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/solid — Solid integration (v3.8).\n * Solid renders custom elements natively: set properties with `prop:` and\n * listen with `on:` (`<usa-toggle prop:checked={on()} on:usa:change={…}>`).\n * This entry adds `defineUsa()` (client only, SolidStart-safe), a `usa`\n * directive for `use:usa={{ props, on }}`, and JSX types.\n *\n * ```tsx\n * import { defineUsa, usa } from 'use-scroll-animate/components/solid';\n * import type {} from 'use-scroll-animate/components/solid'; // JSX types\n * onMount(() => defineUsa());\n * false && usa; // keep the directive import (Solid convention)\n * <usa-card use:usa={{ on: { flip: (e) => console.log(e.detail) } }} effect=\"flip\">…</usa-card>\n * ```\n */\nimport { createRenderEffect, onCleanup } from 'solid-js';\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\nimport type { UsaIntrinsicElements } from './jsx';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/**\n * Solid directive (`use:usa`). Solid calls it with the element and an\n * accessor; since 4.0.1 the binding is tracked with `createRenderEffect`, so\n * signals read inside `{{ props, on }}` update the element automatically and\n * the listeners are removed on cleanup. `refresh()` is kept for code that\n * calls the directive outside a reactive owner.\n */\nexport function usa(el: HTMLElement, accessor: () => UsaBinding | undefined): { refresh(): void; destroy(): void } {\n  let b: ReturnType<typeof bindUsa> | null = null;\n  const run = () => {\n    const v = accessor() || {};\n    if (b) b.update(v);\n    else b = bindUsa(el, v);\n  };\n  createRenderEffect(run);\n  if (!b) run();\n  const destroy = () => b?.destroy();\n  onCleanup(destroy);\n  return { refresh: run, destroy };\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` in SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** JSX intrinsic elements for Solid (same attribute types as the React/Preact ones). */\nexport type SolidUsaIntrinsicElements = UsaIntrinsicElements;\n"],"names":["bindUsa","createRenderEffect","onCleanup","defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;AAcG;AASH;;;;;;AAMG;AACG,SAAU,GAAG,CAAC,EAAe,EAAE,QAAsC,EAAA;IACzE,IAAI,CAAC,GAAsC,IAAI;IAC/C,MAAM,GAAG,GAAG,MAAK;AACf,QAAA,MAAM,CAAC,GAAG,QAAQ,EAAE,IAAI,EAAE;AAC1B,QAAA,IAAI,CAAC;AAAE,YAAA,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;;AACb,YAAA,CAAC,GAAGA,YAAO,CAAC,EAAE,EAAE,CAAC,CAAC;AACzB,IAAA,CAAC;IACDC,0BAAkB,CAAC,GAAG,CAAC;AACvB,IAAA,IAAI,CAAC,CAAC;AAAE,QAAA,GAAG,EAAE;IACb,MAAM,OAAO,GAAG,MAAM,CAAC,EAAE,OAAO,EAAE;IAClCC,iBAAS,CAAC,OAAO,CAAC;AAClB,IAAA,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE;AAClC;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEC,2BAAgB,CAAC,UAAU,CAAC;AACjE;;;;;;;"}

package/dist/components/solid.d.cts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/solid.d.ts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/solid.js

@@ -17,7 +17,8 @@ import './click.js';
 import './ui.js';
 import './page.js';
 import './timeline.js';
-import '../chunks/core-QTFk4kgO.js';
+import '../chunks/core-LkGRmgES.js';
+import './tokens.js';
 import './gesture.js';
 import '../chunks/core-eXX8rB_b.js';
 import './svg.js';

package/dist/components/solid.js.map

@@ -1 +1 @@
-{"version":3,"file":"solid.js","sources":["../../src/components/frameworks/solid.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/solid — Solid integration (v3.8).\n * Solid renders custom elements natively: set properties with `prop:` and\n * listen with `on:` (`<usa-toggle prop:checked={on()} on:usa:change={…}>`).\n * This entry adds `defineUsa()` (client only, SolidStart-safe), a `usa`\n * directive for `use:usa={{ props, on }}`, and JSX types.\n *\n * ```tsx\n * import { defineUsa, usa } from 'use-scroll-animate/components/solid';\n * import type {} from 'use-scroll-animate/components/solid'; // JSX types\n * onMount(() => defineUsa());\n * false && usa; // keep the directive import (Solid convention)\n * <usa-card use:usa={{ on: { flip: (e) => console.log(e.detail) } }} effect=\"flip\">…</usa-card>\n * ```\n */\nimport { createRenderEffect, onCleanup } from 'solid-js';\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\nimport type { UsaIntrinsicElements } from './jsx';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/**\n * Solid directive (`use:usa`). Solid calls it with the element and an\n * accessor; since 4.0.1 the binding is tracked with `createRenderEffect`, so\n * signals read inside `{{ props, on }}` update the element automatically and\n * the listeners are removed on cleanup. `refresh()` is kept for code that\n * calls the directive outside a reactive owner.\n */\nexport function usa(el: HTMLElement, accessor: () => UsaBinding | undefined): { refresh(): void; destroy(): void } {\n  let b: ReturnType<typeof bindUsa> | null = null;\n  const run = () => {\n    const v = accessor() || {};\n    if (b) b.update(v);\n    else b = bindUsa(el, v);\n  };\n  createRenderEffect(run);\n  if (!b) run();\n  const destroy = () => b?.destroy();\n  onCleanup(destroy);\n  return { refresh: run, destroy };\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` in SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** JSX intrinsic elements for Solid (same attribute types as the React/Preact ones). */\nexport type SolidUsaIntrinsicElements = UsaIntrinsicElements;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;AAcG;AASH;;;;;;AAMG;AACG,SAAU,GAAG,CAAC,EAAe,EAAE,QAAsC,EAAA;IACzE,IAAI,CAAC,GAAsC,IAAI;IAC/C,MAAM,GAAG,GAAG,MAAK;AACf,QAAA,MAAM,CAAC,GAAG,QAAQ,EAAE,IAAI,EAAE;AAC1B,QAAA,IAAI,CAAC;AAAE,YAAA,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;;AACb,YAAA,CAAC,GAAG,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;AACzB,IAAA,CAAC;IACD,kBAAkB,CAAC,GAAG,CAAC;AACvB,IAAA,IAAI,CAAC,CAAC;AAAE,QAAA,GAAG,EAAE;IACb,MAAM,OAAO,GAAG,MAAM,CAAC,EAAE,OAAO,EAAE;IAClC,SAAS,CAAC,OAAO,CAAC;AAClB,IAAA,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE;AAClC;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;;;;"}
+{"version":3,"file":"solid.js","sources":["../../src/components/frameworks/solid.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/solid — Solid integration (v3.8).\n * Solid renders custom elements natively: set properties with `prop:` and\n * listen with `on:` (`<usa-toggle prop:checked={on()} on:usa:change={…}>`).\n * This entry adds `defineUsa()` (client only, SolidStart-safe), a `usa`\n * directive for `use:usa={{ props, on }}`, and JSX types.\n *\n * ```tsx\n * import { defineUsa, usa } from 'use-scroll-animate/components/solid';\n * import type {} from 'use-scroll-animate/components/solid'; // JSX types\n * onMount(() => defineUsa());\n * false && usa; // keep the directive import (Solid convention)\n * <usa-card use:usa={{ on: { flip: (e) => console.log(e.detail) } }} effect=\"flip\">…</usa-card>\n * ```\n */\nimport { createRenderEffect, onCleanup } from 'solid-js';\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\nimport type { UsaIntrinsicElements } from './jsx';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/**\n * Solid directive (`use:usa`). Solid calls it with the element and an\n * accessor; since 4.0.1 the binding is tracked with `createRenderEffect`, so\n * signals read inside `{{ props, on }}` update the element automatically and\n * the listeners are removed on cleanup. `refresh()` is kept for code that\n * calls the directive outside a reactive owner.\n */\nexport function usa(el: HTMLElement, accessor: () => UsaBinding | undefined): { refresh(): void; destroy(): void } {\n  let b: ReturnType<typeof bindUsa> | null = null;\n  const run = () => {\n    const v = accessor() || {};\n    if (b) b.update(v);\n    else b = bindUsa(el, v);\n  };\n  createRenderEffect(run);\n  if (!b) run();\n  const destroy = () => b?.destroy();\n  onCleanup(destroy);\n  return { refresh: run, destroy };\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` in SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n\n/** JSX intrinsic elements for Solid (same attribute types as the React/Preact ones). */\nexport type SolidUsaIntrinsicElements = UsaIntrinsicElements;\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;AAcG;AASH;;;;;;AAMG;AACG,SAAU,GAAG,CAAC,EAAe,EAAE,QAAsC,EAAA;IACzE,IAAI,CAAC,GAAsC,IAAI;IAC/C,MAAM,GAAG,GAAG,MAAK;AACf,QAAA,MAAM,CAAC,GAAG,QAAQ,EAAE,IAAI,EAAE;AAC1B,QAAA,IAAI,CAAC;AAAE,YAAA,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC;;AACb,YAAA,CAAC,GAAG,OAAO,CAAC,EAAE,EAAE,CAAC,CAAC;AACzB,IAAA,CAAC;IACD,kBAAkB,CAAC,GAAG,CAAC;AACvB,IAAA,IAAI,CAAC,CAAC;AAAE,QAAA,GAAG,EAAE;IACb,MAAM,OAAO,GAAG,MAAM,CAAC,EAAE,OAAO,EAAE;IAClC,SAAS,CAAC,OAAO,CAAC;AAClB,IAAA,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE;AAClC;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;;;;"}

package/dist/components/svelte.cjs

@@ -17,7 +17,8 @@ require('./click.cjs');
 require('./ui.cjs');
 require('./page.cjs');
 require('./timeline.cjs');
-require('../chunks/core-CLu8ZrC-.cjs');
+require('../chunks/core-BRIIoKeS.cjs');
+require('./tokens.cjs');
 require('./gesture.cjs');
 require('../chunks/core-IaorbTdu.cjs');
 require('./svg.cjs');

package/dist/components/svelte.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"svelte.cjs","sources":["../../src/components/frameworks/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/svelte — Svelte integration (v3.8).\n * Svelte (3, 4, 5) renders `<usa-*>` tags natively; `use:usa` sets\n * **properties** and `usa:*` listeners in one place, and `defineUsa()`\n * registers the elements on the client only (safe in SvelteKit SSR).\n *\n * ```svelte\n * <script>\n *   import { usa, defineUsa } from 'use-scroll-animate/components/svelte';\n *   import { onMount } from 'svelte';\n *   onMount(() => defineUsa(['click', 'ui']));\n *   let on = false;\n * </script>\n * <usa-toggle use:usa={{ props: { checked: on }, on: { change: (e) => (on = e.detail.checked) } }}></usa-toggle>\n * ```\n * Plain `on:usa:change` does not compile in Svelte 3/4 (colon); use the action or `onusa:change` in Svelte 5.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** Svelte action: `use:usa={{ props, on }}`. */\nexport function usa(node: HTMLElement, binding: UsaBinding = {}): { update(b: UsaBinding): void; destroy(): void } {\n  return bindUsa(node, binding);\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` for SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n"],"names":["bindUsa","defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAOH;SACgB,GAAG,CAAC,IAAiB,EAAE,UAAsB,EAAE,EAAA;AAC7D,IAAA,OAAOA,YAAO,CAAC,IAAI,EAAE,OAAO,CAAC;AAC/B;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEC,2BAAgB,CAAC,UAAU,CAAC;AACjE;;;;;;;"}
+{"version":3,"file":"svelte.cjs","sources":["../../src/components/frameworks/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/svelte — Svelte integration (v3.8).\n * Svelte (3, 4, 5) renders `<usa-*>` tags natively; `use:usa` sets\n * **properties** and `usa:*` listeners in one place, and `defineUsa()`\n * registers the elements on the client only (safe in SvelteKit SSR).\n *\n * ```svelte\n * <script>\n *   import { usa, defineUsa } from 'use-scroll-animate/components/svelte';\n *   import { onMount } from 'svelte';\n *   onMount(() => defineUsa(['click', 'ui']));\n *   let on = false;\n * </script>\n * <usa-toggle use:usa={{ props: { checked: on }, on: { change: (e) => (on = e.detail.checked) } }}></usa-toggle>\n * ```\n * Plain `on:usa:change` does not compile in Svelte 3/4 (colon); use the action or `onusa:change` in Svelte 5.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** Svelte action: `use:usa={{ props, on }}`. */\nexport function usa(node: HTMLElement, binding: UsaBinding = {}): { update(b: UsaBinding): void; destroy(): void } {\n  return bindUsa(node, binding);\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` for SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n"],"names":["bindUsa","defineComponents"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAOH;SACgB,GAAG,CAAC,IAAiB,EAAE,UAAsB,EAAE,EAAA;AAC7D,IAAA,OAAOA,YAAO,CAAC,IAAI,EAAE,OAAO,CAAC;AAC/B;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAEC,2BAAgB,CAAC,UAAU,CAAC;AACjE;;;;;;;"}

package/dist/components/svelte.d.cts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/svelte.d.ts

@@ -1285,9 +1285,9 @@ declare global {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/svelte.js

@@ -16,7 +16,8 @@ import './click.js';
 import './ui.js';
 import './page.js';
 import './timeline.js';
-import '../chunks/core-QTFk4kgO.js';
+import '../chunks/core-LkGRmgES.js';
+import './tokens.js';
 import './gesture.js';
 import '../chunks/core-eXX8rB_b.js';
 import './svg.js';

package/dist/components/svelte.js.map

@@ -1 +1 @@
-{"version":3,"file":"svelte.js","sources":["../../src/components/frameworks/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/svelte — Svelte integration (v3.8).\n * Svelte (3, 4, 5) renders `<usa-*>` tags natively; `use:usa` sets\n * **properties** and `usa:*` listeners in one place, and `defineUsa()`\n * registers the elements on the client only (safe in SvelteKit SSR).\n *\n * ```svelte\n * <script>\n *   import { usa, defineUsa } from 'use-scroll-animate/components/svelte';\n *   import { onMount } from 'svelte';\n *   onMount(() => defineUsa(['click', 'ui']));\n *   let on = false;\n * </script>\n * <usa-toggle use:usa={{ props: { checked: on }, on: { change: (e) => (on = e.detail.checked) } }}></usa-toggle>\n * ```\n * Plain `on:usa:change` does not compile in Svelte 3/4 (colon); use the action or `onusa:change` in Svelte 5.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** Svelte action: `use:usa={{ props, on }}`. */\nexport function usa(node: HTMLElement, binding: UsaBinding = {}): { update(b: UsaBinding): void; destroy(): void } {\n  return bindUsa(node, binding);\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` for SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAOH;SACgB,GAAG,CAAC,IAAiB,EAAE,UAAsB,EAAE,EAAA;AAC7D,IAAA,OAAO,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC;AAC/B;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;;;;"}
+{"version":3,"file":"svelte.js","sources":["../../src/components/frameworks/svelte.ts"],"sourcesContent":["/**\n * use-scroll-animate/components/svelte — Svelte integration (v3.8).\n * Svelte (3, 4, 5) renders `<usa-*>` tags natively; `use:usa` sets\n * **properties** and `usa:*` listeners in one place, and `defineUsa()`\n * registers the elements on the client only (safe in SvelteKit SSR).\n *\n * ```svelte\n * <script>\n *   import { usa, defineUsa } from 'use-scroll-animate/components/svelte';\n *   import { onMount } from 'svelte';\n *   onMount(() => defineUsa(['click', 'ui']));\n *   let on = false;\n * </script>\n * <usa-toggle use:usa={{ props: { checked: on }, on: { change: (e) => (on = e.detail.checked) } }}></usa-toggle>\n * ```\n * Plain `on:usa:change` does not compile in Svelte 3/4 (colon); use the action or `onusa:change` in Svelte 5.\n */\nimport { defineComponents, type ComponentCategory } from '../index';\nimport { bindUsa, type UsaBinding } from './bind';\n\nexport { bindUsa, usaEventName } from './bind';\nexport type { UsaBinding } from './bind';\n\n/** Svelte action: `use:usa={{ props, on }}`. */\nexport function usa(node: HTMLElement, binding: UsaBinding = {}): { update(b: UsaBinding): void; destroy(): void } {\n  return bindUsa(node, binding);\n}\n\n/** Register the elements (all, or some categories) — call from `onMount` for SSR apps. */\nexport function defineUsa(categories?: ComponentCategory[]): void {\n  if (typeof window !== 'undefined') defineComponents(categories);\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;AAgBG;AAOH;SACgB,GAAG,CAAC,IAAiB,EAAE,UAAsB,EAAE,EAAA;AAC7D,IAAA,OAAO,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC;AAC/B;AAEA;AACM,SAAU,SAAS,CAAC,UAAgC,EAAA;IACxD,IAAI,OAAO,MAAM,KAAK,WAAW;QAAE,gBAAgB,CAAC,UAAU,CAAC;AACjE;;;;"}

package/dist/components/timeline.cjs

@@ -1,7 +1,8 @@
 'use strict';
 
 var base = require('../chunks/base-CXx7jZ-o.cjs');
-var core = require('../chunks/core-CLu8ZrC-.cjs');
+var core = require('../chunks/core-BRIIoKeS.cjs');
+require('./tokens.cjs');
 
 var css = "usa-timeline{display:block}usa-timeline[scrub]{position:relative}@media (prefers-reduced-motion:reduce){usa-timeline [data-tl]{opacity:1 !important;transform:none !important;filter:none !important;clip-path:none !important}}";
 

package/dist/components/timeline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.cjs","sources":["../../src/components/timeline/timeline-el.ts","../../src/components/timeline/index.ts"],"sourcesContent":["import { defineElement, type UsaElement } from '../base';\nimport { timeline, TIMELINE_PRESETS, type Timeline } from './core';\nimport css from './timeline.css?raw';\n\n/**\n * `<usa-timeline>` — declarative choreography. Every descendant with\n * `data-tl=\"<preset>\"` becomes a step, in document order; `data-at`\n * (`'-=200'`, `'<'`, `'label+=100'`, ms), `data-duration` and `data-label`\n * fine-tune it.\n *\n * Attributes: `trigger` (`view` default · `click` · `manual`), `scrub`\n * (progress follows scroll instead of playing), `overlap` (ms each step\n * overlaps the previous, default 0), `duration` (600), `stagger` (ms),\n * `repeat` (replay every time it enters the viewport). 4.1: `scrub` runs on native\n * ScrollTimeline / ViewTimeline when supported (`data-native` is set); `scrub=\"js\"`,\n * `scrub=\"scroll\"` and `smooth` tune it. Methods: `play()`,\n * `reverse()`, `seek(t)`; property `timeline`. Event `usa:complete`.\n * Reduced motion: steps appear in their final state.\n */\nexport interface UsaTimelineElement extends UsaElement {\n  readonly timeline: Timeline | null;\n  play(): Promise<void>;\n  reverse(): Promise<void>;\n  seek(to: number | string): void;\n}\n\nexport function defineTimeline(tag = 'usa-timeline'): CustomElementConstructor | undefined {\n  return defineElement(\n    tag,\n    (Base) =>\n      class UsaTimeline extends Base {\n        static get observedAttributes(): string[] {\n          return ['scrub', 'trigger', 'overlap'];\n        }\n        private _tl: Timeline | null = null;\n\n        get timeline(): Timeline | null {\n          return this._tl;\n        }\n\n        play(): Promise<void> {\n          return this._tl ? this._tl.play(0).then(() => void this.emit('complete')) : Promise.resolve();\n        }\n\n        reverse(): Promise<void> {\n          return this._tl ? this._tl.reverse() : Promise.resolve();\n        }\n\n        seek(to: number | string): void {\n          this._tl?.seek(to);\n        }\n\n        mount(): void {\n          const overlap = this.num('overlap', 0);\n          const tl = (this._tl = timeline({ defaults: { duration: this.num('duration', 600), stagger: this.num('stagger', 0) } }));\n          this.querySelectorAll<HTMLElement>('[data-tl]').forEach((el, i) => {\n            if (el.dataset.label) tl.label(el.dataset.label);\n            const name = el.dataset.tl || 'fade';\n            tl.to(el, TIMELINE_PRESETS[name] ? name : 'fade', {\n              at: el.dataset.at ?? (i && overlap ? `-=${overlap}` : undefined),\n              duration: el.dataset.duration ? Number(el.dataset.duration) : undefined,\n            });\n          });\n          this.onCleanup(() => tl.cancel());\n          if (this.reduced) {\n            tl.seek(tl.duration);\n            return;\n          }\n          if (this.flag('scrub')) {\n            // 4.1: native ScrollTimeline / ViewTimeline when available; `smooth`\n            // (0–0.95) or `scrub=\"js\"` opt into the JS engine, `scrub=\"scroll\"`\n            // follows this element's own scroll position.\n            const v = this.str('scrub');\n            const stop = tl.scrub(this, { smooth: this.num('smooth', 0), engine: v === 'js' ? 'js' : 'auto', source: v === 'scroll' ? 'scroll' : 'view' });\n            this.toggleAttribute('data-native', stop.native);\n            this.onCleanup(stop);\n            return;\n          }\n          const trigger = this.str('trigger', 'view');\n          if (trigger === 'click') {\n            // 4.0.1: show the finished composition until the first click\n            // (it used to sit invisible at t=0); Enter / Space replay it too.\n            tl.seek(tl.duration);\n            this.listen(this, 'click', () => void this.play());\n            this.listen(this, 'keydown', (e: KeyboardEvent) => {\n              if (e.target === this && (e.key === 'Enter' || e.key === ' ')) {\n                e.preventDefault();\n                void this.play();\n              }\n            });\n            if (!this.hasAttribute('tabindex')) this.tabIndex = 0;\n            return;\n          }\n          tl.seek(0);\n          if (trigger === 'view') {\n            let played = false;\n            this.inView((v) => {\n              if (v && (!played || this.flag('repeat'))) {\n                played = true;\n                void this.play();\n              } else if (!v && this.flag('repeat')) tl.seek(0);\n            }, { threshold: 0.2 });\n          }\n        }\n\n        unmount(): void {\n          this._tl = null;\n        }\n      },\n    { id: 'timeline', text: css }\n  );\n}\n","/**\n * use-scroll-animate/components/timeline — choreography (v3.1).\n * `timeline()` chains, overlaps, labels, seeks, reverses and scroll-scrubs\n * WAAPI animations on one playhead; `<usa-timeline>` builds one from\n * `data-tl` children.\n */\nimport { defineTimeline, type UsaTimelineElement } from './timeline-el';\n\nexport { defineTimeline };\nexport { timeline, resolvePosition, TIMELINE_PRESETS, supportsNativeScrub } from './core';\nexport type { Timeline, TimelineOptions, TimelineStepOptions, TimelinePosition, ScrubOptions, ScrubHandle } from './core';\nexport type { UsaTimelineElement };\nexport { configureComponents, prefersReducedMotion } from '../base';\nexport type { ComponentsConfig, UsaElement } from '../base';\n\n/** Register every component of this category under its default tag. */\nexport function defineTimelineComponents(): void {\n  defineTimeline();\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'usa-timeline': UsaTimelineElement;\n  }\n}\n"],"names":["defineElement","timeline","TIMELINE_PRESETS"],"mappings":"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"}
+{"version":3,"file":"timeline.cjs","sources":["../../src/components/timeline/timeline-el.ts","../../src/components/timeline/index.ts"],"sourcesContent":["import { defineElement, type UsaElement } from '../base';\nimport { timeline, TIMELINE_PRESETS, type Timeline } from './core';\nimport css from './timeline.css?raw';\n\n/**\n * `<usa-timeline>` — declarative choreography. Every descendant with\n * `data-tl=\"<preset>\"` becomes a step, in document order; `data-at`\n * (`'-=200'`, `'<'`, `'label+=100'`, ms), `data-duration` and `data-label`\n * fine-tune it.\n *\n * Attributes: `trigger` (`view` default · `click` · `manual`), `scrub`\n * (progress follows scroll instead of playing), `overlap` (ms each step\n * overlaps the previous, default 0), `duration` (600), `stagger` (ms),\n * `repeat` (replay every time it enters the viewport). 4.1: `scrub` runs on native\n * ScrollTimeline / ViewTimeline when supported (`data-native` is set); `scrub=\"js\"`,\n * `scrub=\"scroll\"` and `smooth` tune it. Methods: `play()`,\n * `reverse()`, `seek(t)`; property `timeline`. Event `usa:complete`.\n * Reduced motion: steps appear in their final state.\n */\nexport interface UsaTimelineElement extends UsaElement {\n  readonly timeline: Timeline | null;\n  play(): Promise<void>;\n  reverse(): Promise<void>;\n  seek(to: number | string): void;\n}\n\nexport function defineTimeline(tag = 'usa-timeline'): CustomElementConstructor | undefined {\n  return defineElement(\n    tag,\n    (Base) =>\n      class UsaTimeline extends Base {\n        static get observedAttributes(): string[] {\n          return ['scrub', 'trigger', 'overlap'];\n        }\n        private _tl: Timeline | null = null;\n\n        get timeline(): Timeline | null {\n          return this._tl;\n        }\n\n        play(): Promise<void> {\n          return this._tl ? this._tl.play(0).then(() => void this.emit('complete')) : Promise.resolve();\n        }\n\n        reverse(): Promise<void> {\n          return this._tl ? this._tl.reverse() : Promise.resolve();\n        }\n\n        seek(to: number | string): void {\n          this._tl?.seek(to);\n        }\n\n        mount(): void {\n          const overlap = this.num('overlap', 0);\n          const tl = (this._tl = timeline({ defaults: { duration: this.num('duration', 600), stagger: this.num('stagger', 0) } }));\n          this.querySelectorAll<HTMLElement>('[data-tl]').forEach((el, i) => {\n            if (el.dataset.label) tl.label(el.dataset.label);\n            const name = el.dataset.tl || 'fade';\n            tl.to(el, TIMELINE_PRESETS[name] ? name : 'fade', {\n              at: el.dataset.at ?? (i && overlap ? `-=${overlap}` : undefined),\n              duration: el.dataset.duration ? Number(el.dataset.duration) : undefined,\n            });\n          });\n          this.onCleanup(() => tl.cancel());\n          if (this.reduced) {\n            tl.seek(tl.duration);\n            return;\n          }\n          if (this.flag('scrub')) {\n            // 4.1: native ScrollTimeline / ViewTimeline when available; `smooth`\n            // (0–0.95) or `scrub=\"js\"` opt into the JS engine, `scrub=\"scroll\"`\n            // follows this element's own scroll position.\n            const v = this.str('scrub');\n            const stop = tl.scrub(this, { smooth: this.num('smooth', 0), engine: v === 'js' ? 'js' : 'auto', source: v === 'scroll' ? 'scroll' : 'view' });\n            this.toggleAttribute('data-native', stop.native);\n            this.onCleanup(stop);\n            return;\n          }\n          const trigger = this.str('trigger', 'view');\n          if (trigger === 'click') {\n            // 4.0.1: show the finished composition until the first click\n            // (it used to sit invisible at t=0); Enter / Space replay it too.\n            tl.seek(tl.duration);\n            this.listen(this, 'click', () => void this.play());\n            this.listen(this, 'keydown', (e: KeyboardEvent) => {\n              if (e.target === this && (e.key === 'Enter' || e.key === ' ')) {\n                e.preventDefault();\n                void this.play();\n              }\n            });\n            if (!this.hasAttribute('tabindex')) this.tabIndex = 0;\n            return;\n          }\n          tl.seek(0);\n          if (trigger === 'view') {\n            let played = false;\n            this.inView((v) => {\n              if (v && (!played || this.flag('repeat'))) {\n                played = true;\n                void this.play();\n              } else if (!v && this.flag('repeat')) tl.seek(0);\n            }, { threshold: 0.2 });\n          }\n        }\n\n        unmount(): void {\n          this._tl = null;\n        }\n      },\n    { id: 'timeline', text: css }\n  );\n}\n","/**\n * use-scroll-animate/components/timeline — choreography (v3.1).\n * `timeline()` chains, overlaps, labels, seeks, reverses and scroll-scrubs\n * WAAPI animations on one playhead; `<usa-timeline>` builds one from\n * `data-tl` children.\n */\nimport { defineTimeline, type UsaTimelineElement } from './timeline-el';\n\nexport { defineTimeline };\nexport { timeline, resolvePosition, TIMELINE_PRESETS, supportsNativeScrub } from './core';\nexport type { Timeline, TimelineOptions, TimelineStepOptions, TimelinePosition, ScrubOptions, ScrubHandle } from './core';\nexport type { UsaTimelineElement };\nexport { configureComponents, prefersReducedMotion } from '../base';\nexport type { ComponentsConfig, UsaElement } from '../base';\n\n/** Register every component of this category under its default tag. */\nexport function defineTimelineComponents(): void {\n  defineTimeline();\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'usa-timeline': UsaTimelineElement;\n  }\n}\n"],"names":["defineElement","timeline","TIMELINE_PRESETS"],"mappings":"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"}

package/dist/components/timeline.d.cts

@@ -53,9 +53,9 @@ interface UsaElement extends HTMLElement {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/timeline.d.ts

@@ -53,9 +53,9 @@ interface UsaElement extends HTMLElement {
  */
 type TimelinePosition = number | string;
 interface TimelineStepOptions {
-    /** Duration in ms (default: timeline default, 600). */
-    duration?: number;
-    /** CSS easing (default `cubic-bezier(0.22, 1, 0.36, 1)`). */
+    /** Duration in ms or a motion token name (`'fast'`, `'slow'`…; 4.2). Default: timeline default, 600. */
+    duration?: number | string;
+    /** CSS easing or a motion token name (`'emphasized'`, `'spring'`…; 4.2). Default `cubic-bezier(0.22, 1, 0.36, 1)`. */
     easing?: string;
     /** Start position, see `TimelinePosition`. */
     at?: TimelinePosition;

package/dist/components/timeline.js

@@ -1,7 +1,8 @@
 import { h as defineElement } from '../chunks/base-BPG5zvex.js';
 export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-BPG5zvex.js';
-import { t as timeline, T as TIMELINE_PRESETS } from '../chunks/core-QTFk4kgO.js';
-export { r as resolvePosition, s as supportsNativeScrub } from '../chunks/core-QTFk4kgO.js';
+import { t as timeline, T as TIMELINE_PRESETS } from '../chunks/core-LkGRmgES.js';
+export { r as resolvePosition, s as supportsNativeScrub } from '../chunks/core-LkGRmgES.js';
+import './tokens.js';
 
 var css = "usa-timeline{display:block}usa-timeline[scrub]{position:relative}@media (prefers-reduced-motion:reduce){usa-timeline [data-tl]{opacity:1 !important;transform:none !important;filter:none !important;clip-path:none !important}}";