use-scroll-animate 3.8.0 → 4.0.0

package/dist/components/timeline.js

@@ -1,219 +1,7 @@
-import { p as prefersReducedMotion, e as caf, b as clamp, d as applyFrame, r as raf, m as motionScale, n as now, h as defineElement } from '../chunks/base-BpROOcey.js';
-export { a as configureComponents } from '../chunks/base-BpROOcey.js';
-
-/** Keyframe presets usable by name in `to()` and `data-tl`. */
-const TIMELINE_PRESETS = {
-    fade: [{ opacity: 0 }, { opacity: 1 }],
-    'fade-up': [{ opacity: 0, transform: 'translateY(24px)' }, { opacity: 1, transform: 'none' }],
-    'fade-down': [{ opacity: 0, transform: 'translateY(-24px)' }, { opacity: 1, transform: 'none' }],
-    'fade-left': [{ opacity: 0, transform: 'translateX(24px)' }, { opacity: 1, transform: 'none' }],
-    'fade-right': [{ opacity: 0, transform: 'translateX(-24px)' }, { opacity: 1, transform: 'none' }],
-    scale: [{ opacity: 0, transform: 'scale(0.85)' }, { opacity: 1, transform: 'none' }],
-    blur: [{ opacity: 0, filter: 'blur(12px)' }, { opacity: 1, filter: 'blur(0)' }],
-    rotate: [{ opacity: 0, transform: 'rotate(-12deg) scale(0.9)' }, { opacity: 1, transform: 'none' }],
-    'clip-up': [{ clipPath: 'inset(100% 0 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],
-    'clip-right': [{ clipPath: 'inset(0 100% 0 0)' }, { clipPath: 'inset(0 0 0 0)' }],
-};
-/** Resolve a position against the previous step and labels (pure). */
-function resolvePosition(pos, end, prevStart, labels = {}) {
-    if (pos === undefined || pos === '' || pos === '>')
-        return end;
-    if (typeof pos === 'number')
-        return Math.max(0, pos);
-    const s = String(pos).trim();
-    if (/^-?\d+(\.\d+)?$/.test(s))
-        return Math.max(0, Number(s));
-    const m = /^(<|>|[A-Za-z_][\w-]*)?\s*(?:([+-])=\s*(\d+(?:\.\d+)?))?$/.exec(s);
-    if (!m)
-        return end;
-    const base = m[1] === '<' ? prevStart : m[1] === '>' || !m[1] ? end : labels[m[1]] ?? end;
-    const delta = m[2] ? (m[2] === '-' ? -1 : 1) * Number(m[3]) : 0;
-    return Math.max(0, base + delta);
-}
-const toEls = (t) => typeof t === 'string' ? (typeof document === 'undefined' ? [] : Array.from(document.querySelectorAll(t))) : t instanceof Element ? [t] : Array.from(t);
-/**
- * Choreograph animations on one clock: chain, overlap, label, seek, reverse and
- * scrub them with scroll. Built on WAAPI (paused animations driven by one
- * playhead); without WAAPI or under reduced motion it jumps to the end state.
- *
- * @example
- * const tl = timeline({ defaults: { duration: 500 } })
- *   .to('.title', 'fade-up')
- *   .label('cards')
- *   .to('.card', 'scale', { stagger: 80, at: '-=200' })
- *   .to('.cta', [{ opacity: 0 }, { opacity: 1 }], { at: 'cards+=400' });
- * tl.play();             // or tl.scrub(document.querySelector('.hero'))
- */
-function timeline(options = {}) {
-    const d = { duration: 600, easing: 'cubic-bezier(0.22, 1, 0.36, 1)', stagger: 0, ...options.defaults };
-    const steps = [];
-    const cues = [];
-    const labels = {};
-    let end = 0;
-    let prevStart = 0;
-    let t = 0;
-    let frame = 0;
-    let dir = 1;
-    let settle;
-    let built = false;
-    const total = () => Math.max(end, ...cues.map((c) => c.at), 0);
-    const build = () => {
-        if (built)
-            return;
-        built = true;
-        for (const s of steps) {
-            if (typeof s.el.animate !== 'function') {
-                s.anim = null;
-                continue;
-            }
-            s.anim = s.el.animate(s.frames, { duration: s.duration, delay: s.start, easing: s.easing, fill: 'both' });
-            s.anim.pause();
-        }
-    };
-    const render = (to, from) => {
-        build();
-        t = clamp(to, 0, total());
-        for (const s of steps) {
-            if (s.anim)
-                s.anim.currentTime = t;
-            else
-                applyFrame(s.el, s.frames[t >= s.start ? s.frames.length - 1 : 0]);
-        }
-        for (const c of cues)
-            if ((from < c.at && t >= c.at) || (from > c.at && t <= c.at))
-                c.fn();
-        options.onUpdate?.(total() ? t / total() : 1);
-    };
-    const stop = () => {
-        if (frame)
-            caf(frame);
-        frame = 0;
-    };
-    const run = (direction) => {
-        stop();
-        settle?.();
-        dir = direction;
-        const target = dir > 0 ? total() : 0;
-        const k = motionScale();
-        if (prefersReducedMotion() || k === 0 || !total()) {
-            render(target, t);
-            options.onComplete?.();
-            return Promise.resolve();
-        }
-        const rate = (options.speed ?? 1) / k;
-        return new Promise((resolve) => {
-            settle = () => { settle = undefined; resolve(); };
-            let last = now();
-            const loop = () => {
-                const n = now();
-                const next = t + (n - last) * rate * dir;
-                last = n;
-                render(next, t);
-                if ((dir > 0 && t >= target) || (dir < 0 && t <= 0)) {
-                    frame = 0;
-                    options.onComplete?.();
-                    settle?.();
-                    return;
-                }
-                frame = raf(loop);
-            };
-            frame = raf(loop);
-        });
-    };
-    const api = {
-        get duration() { return total(); },
-        get labels() { return { ...labels }; },
-        get time() { return t; },
-        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 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 });
-                last = Math.max(last, s + duration);
-            });
-            prevStart = start;
-            end = Math.max(end, last);
-            built = false;
-            steps.forEach((s) => s.anim?.cancel());
-            return api;
-        },
-        label(name, at) {
-            labels[name] = resolvePosition(at, end, prevStart, labels);
-            return api;
-        },
-        call(fn, at) {
-            cues.push({ fn, at: resolvePosition(at, end, prevStart, labels) });
-            return api;
-        },
-        play(from) {
-            if (from !== undefined)
-                render(resolvePosition(from, 0, 0, labels), t);
-            else if (t >= total())
-                render(0, -1);
-            return run(1);
-        },
-        reverse() {
-            return run(-1);
-        },
-        pause() {
-            stop();
-            return api;
-        },
-        seek(to) {
-            stop();
-            render(resolvePosition(to, 0, 0, labels), t);
-            return api;
-        },
-        progress(p) {
-            if (p !== undefined)
-                api.seek(clamp(p, 0, 1) * total());
-            return total() ? t / total() : 0;
-        },
-        scrub(source, o = {}) {
-            stop();
-            if (prefersReducedMotion() || typeof window === 'undefined') {
-                render(total(), t);
-                return () => { };
-            }
-            let id = 0;
-            let cur = t;
-            const update = () => {
-                id = 0;
-                const r = source.getBoundingClientRect();
-                const vh = window.innerHeight || 1;
-                const p = clamp((vh + (o.offset ?? 0) - r.top) / (vh + r.height || 1), 0, 1);
-                const goal = p * total();
-                const sm = clamp(o.smooth ?? 0, 0, 0.95);
-                cur = sm ? cur + (goal - cur) * (1 - sm) : goal;
-                render(cur, t);
-                if (sm && Math.abs(goal - cur) > 0.5)
-                    id = raf(update);
-            };
-            const onScroll = () => { if (!id)
-                id = raf(update); };
-            window.addEventListener('scroll', onScroll, { passive: true });
-            window.addEventListener('resize', onScroll, { passive: true });
-            update();
-            return () => {
-                window.removeEventListener('scroll', onScroll);
-                window.removeEventListener('resize', onScroll);
-                if (id)
-                    caf(id);
-            };
-        },
-        cancel() {
-            stop();
-            settle?.();
-            steps.forEach((s) => s.anim?.cancel());
-            built = false;
-        },
-    };
-    return api;
-}
+import { h as defineElement } from '../chunks/base-ZARFccur.js';
+export { a as configureComponents, p as prefersReducedMotion } from '../chunks/base-ZARFccur.js';
+import { t as timeline, T as TIMELINE_PRESETS } from '../chunks/core-Co-6AL0h.js';
+export { r as resolvePosition } from '../chunks/core-Co-6AL0h.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}}";
 
@@ -292,5 +80,5 @@ function defineTimelineComponents() {
     defineTimeline();
 }
 
-export { TIMELINE_PRESETS, defineTimeline, defineTimelineComponents, prefersReducedMotion, resolvePosition, timeline };
+export { TIMELINE_PRESETS, defineTimeline, defineTimelineComponents, timeline };
 //# sourceMappingURL=timeline.js.map

package/dist/components/timeline.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeline.js","sources":["../../src/components/timeline/core.ts","../../src/components/timeline/timeline-el.ts","../../src/components/timeline/index.ts"],"sourcesContent":["import { prefersReducedMotion, motionScale, applyFrame, raf, caf, now, clamp } from '../base';\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 (default: timeline default, 600). */\n  duration?: number;\n  /** CSS easing (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. */\n  offset?: number;\n  /** Smoothing 0–1 (0 = immediate, default 0). */\n  smooth?: number;\n}\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  /** Tie progress to the scroll position of `source` (it moves through the viewport). Returns a stop function. */\n  scrub(source: Element, options?: ScrubOptions): () => void;\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 = o.duration ?? d.duration;\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: o.easing ?? d.easing });\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 () => {};\n      }\n      let id = 0;\n      let cur = t;\n      const update = () => {\n        id = 0;\n        const r = source.getBoundingClientRect();\n        const vh = window.innerHeight || 1;\n        const p = clamp((vh + (o.offset ?? 0) - r.top) / (vh + r.height || 1), 0, 1);\n        const goal = p * 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      window.addEventListener('scroll', onScroll, { passive: true });\n      window.addEventListener('resize', onScroll, { passive: true });\n      update();\n      return () => {\n        window.removeEventListener('scroll', onScroll);\n        window.removeEventListener('resize', onScroll);\n        if (id) caf(id);\n      };\n    },\n    cancel() {\n      stop();\n      settle?.();\n      steps.forEach((s) => s.anim?.cancel());\n      built = false;\n    },\n  };\n  return api;\n}\n","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). 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            this.onCleanup(tl.scrub(this, { smooth: 0.2 }));\n            return;\n          }\n          tl.seek(0);\n          const trigger = this.str('trigger', 'view');\n          if (trigger === 'click') this.listen(this, 'click', () => void this.play());\n          else 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 } from './core';\nexport type { Timeline, TimelineOptions, TimelineStepOptions, TimelinePosition, ScrubOptions } 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":[],"mappings":"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"}
+{"version":3,"file":"timeline.js","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). 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            this.onCleanup(tl.scrub(this, { smooth: 0.2 }));\n            return;\n          }\n          tl.seek(0);\n          const trigger = this.str('trigger', 'view');\n          if (trigger === 'click') this.listen(this, 'click', () => void this.play());\n          else 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 } from './core';\nexport type { Timeline, TimelineOptions, TimelineStepOptions, TimelinePosition, ScrubOptions } 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":[],"mappings":"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"}

package/dist/components/transitions.cjs

@@ -4,7 +4,7 @@ var base = require('../chunks/base-CXx7jZ-o.cjs');
 
 var shadowCss = ":host{display:contents}dialog{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:inherit;overflow:hidden}dialog:not([open]){display:none}dialog::backdrop{background:transparent}[part=\"backdrop\"]{position:absolute;inset:0;background:var(--usa-dialog-backdrop,rgb(0 0 0 / 0.42))}[part=\"panel\"]{position:absolute;left:50%;top:50%;translate:-50% -50%;box-sizing:border-box;width:min(var(--usa-dialog-width,480px),calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;padding:var(--usa-dialog-padding,24px);border-radius:var(--usa-dialog-radius,12px);background:var(--usa-dialog-bg,Canvas);color:var(--usa-dialog-fg,CanvasText);box-shadow:0 32px 64px -12px rgb(0 0 0 / 0.45),0 0 0 1px rgb(127 127 127 / 0.18)}dialog[data-kind^=\"drawer\"] [part=\"panel\"]{top:0;bottom:0;translate:none;max-height:none;height:100%;border-radius:0;width:min(var(--usa-dialog-width,380px),88vw)}dialog[data-kind=\"drawer-start\"] [part=\"panel\"]{left:0}dialog[data-kind=\"drawer-end\"] [part=\"panel\"]{left:auto;right:0}dialog[data-kind=\"drawer-bottom\"] [part=\"panel\"],dialog[data-kind=\"sheet\"] [part=\"panel\"]{top:auto;bottom:0;left:0;right:0;translate:none;width:100%;height:auto;max-height:85vh;border-radius:var(--usa-dialog-radius,16px) var(--usa-dialog-radius,16px) 0 0}dialog[data-kind=\"sheet\"] [part=\"panel\"]{left:50%;translate:-50% 0;width:min(var(--usa-dialog-width,560px),100vw)}";
 
-var css$3 = "usa-dialog{display:contents}usa-dialog:not(:defined){display:none}";
+var css$2 = "usa-dialog{display:contents}usa-dialog:not(:defined){display:none}";
 
 const FROM = {
     modal: 'scale(0.94)',
@@ -159,10 +159,10 @@ function defineDialog(tag = 'usa-dialog') {
             const b = this._backdrop ? this.motion(this._backdrop, backdrop, { duration, easing: 'linear', fill }) : null;
             return Promise.all([a?.finished, b?.finished].map((p) => p?.catch(() => undefined))).then(() => undefined);
         }
-    }, { id: 'dialog', text: css$3 });
+    }, { id: 'dialog', text: css$2 });
 }
 
-var css$2 = "usa-accordion{display:block}usa-accordion>details>summary{cursor:pointer}usa-accordion>details>summary::-webkit-details-marker{display:none}usa-accordion>details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1em}usa-accordion>details>summary::after{content:\"\";flex:none;width:0.5em;height:0.5em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-25%) rotate(45deg);transition:transform 0.3s cubic-bezier(0.22,1,0.36,1);opacity:0.7}usa-accordion>details[open]:not([data-closing])>summary::after{transform:translateY(25%) rotate(-135deg)}@media (prefers-reduced-motion:reduce){usa-accordion>details>summary::after{transition:none}}";
+var css$1 = "usa-accordion{display:block}usa-accordion>details>summary{cursor:pointer}usa-accordion>details>summary::-webkit-details-marker{display:none}usa-accordion>details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:1em}usa-accordion>details>summary::after{content:\"\";flex:none;width:0.5em;height:0.5em;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-25%) rotate(45deg);transition:transform 0.3s cubic-bezier(0.22,1,0.36,1);opacity:0.7}usa-accordion>details[open]:not([data-closing])>summary::after{transform:translateY(25%) rotate(-135deg)}@media (prefers-reduced-motion:reduce){usa-accordion>details>summary::after{transition:none}}";
 
 function defineAccordion(tag = 'usa-accordion') {
     return base.defineElement(tag, (Base) => class UsaAccordion extends Base {
@@ -228,93 +228,7 @@ function defineAccordion(tag = 'usa-accordion') {
                 d.removeAttribute('data-closing');
             }
         }
-    }, { id: 'accordion', text: css$2 });
-}
-
-var css$1 = "usa-flip-list{display:block}";
-
-function defineFlipList(tag = 'usa-flip-list') {
-    return base.defineElement(tag, (Base) => class UsaFlipList extends Base {
-        constructor() {
-            super(...arguments);
-            /** Child positions relative to the host, from the last layout we saw. */
-            this._pos = new WeakMap();
-            this._manual = false;
-        }
-        static get observedAttributes() {
-            return [];
-        }
-        snapshot() {
-            const host = this.getBoundingClientRect();
-            for (const el of Array.from(this.children)) {
-                const r = el.getBoundingClientRect();
-                this._pos.set(el, { x: r.left - host.left, y: r.top - host.top });
-            }
-        }
-        mount() {
-            this.snapshot();
-            if (typeof MutationObserver !== 'undefined') {
-                const mo = new MutationObserver(() => {
-                    if (!this._manual)
-                        this.animateFrom(this._pos);
-                });
-                mo.observe(this, { childList: true });
-                this.onCleanup(() => mo.disconnect());
-            }
-            if (typeof ResizeObserver !== 'undefined') {
-                const ro = new ResizeObserver(() => this.snapshot());
-                ro.observe(this);
-                this.onCleanup(() => ro.disconnect());
-            }
-        }
-        animateFrom(prev) {
-            const off = this.reduced || this.flag('disabled');
-            const host = this.getBoundingClientRect();
-            const kids = Array.from(this.children);
-            const now = kids.map((el) => {
-                const r = el.getBoundingClientRect();
-                return { x: r.left - host.left, y: r.top - host.top };
-            });
-            const anims = [];
-            const duration = this.num('duration', 420);
-            const easing = this.str('easing', base.FLUENT_DECELERATE);
-            kids.forEach((el, i) => {
-                const before = prev.get(el);
-                this._pos.set(el, now[i]);
-                if (off || typeof el.animate !== 'function')
-                    return;
-                if (!before) {
-                    anims.push(el.animate([{ opacity: 0, transform: 'scale(0.92)' }, { opacity: 1, transform: 'none' }], { duration, easing }).finished.catch(() => 0));
-                    return;
-                }
-                const dx = before.x - now[i].x;
-                const dy = before.y - now[i].y;
-                if (Math.abs(dx) < 0.5 && Math.abs(dy) < 0.5)
-                    return;
-                anims.push(el.animate([{ transform: `translate(${dx}px, ${dy}px)` }, { transform: 'none' }], { duration, easing, composite: 'add' }).finished.catch(() => 0));
-            });
-            return Promise.all(anims).then(() => undefined);
-        }
-        async flip(mutate) {
-            this.snapshot();
-            const prev = this._pos;
-            this._pos = new WeakMap();
-            // Copy the snapshot so the observer does not overwrite it mid-mutation
-            for (const el of Array.from(this.children)) {
-                const p = prev.get(el);
-                if (p)
-                    this._pos.set(el, p);
-            }
-            this._manual = true;
-            try {
-                await mutate();
-            }
-            finally {
-                this._manual = false;
-            }
-            await this.animateFrom(prev);
-        }
-    }, { id: 'flip-list', text: css$1 });
+    }, { id: 'accordion', text: css$1 });
 }
 
 var css = "usa-view-switch{display:grid}usa-view-switch>*{grid-area:1 / 1;min-width:0}usa-view-switch>[hidden]:not([data-leaving]){display:none !important}usa-view-switch>[data-leaving]{display:block;pointer-events:none}";
@@ -493,51 +407,24 @@ async function flip(targets, mutate, options = {}) {
     });
     await Promise.all(anims.map((a) => a.finished.catch(() => undefined)));
 }
-/**
- * Connected (shared-element) animation, like WinUI's
- * `ConnectedAnimationService`: `to` flies from the position and size of
- * `from` into its own place (e.g. a thumbnail opening into a detail view).
- * Call it right after `to` is shown. Transforms only.
- */
-async function connectedAnimation(from, to, options = {}) {
-    if (base.prefersReducedMotion() || typeof to.animate !== 'function')
-        return;
-    const a = from.getBoundingClientRect();
-    const b = to.getBoundingClientRect();
-    if (!b.width || !b.height)
-        return;
-    const hide = options.hideSource !== false && from instanceof HTMLElement;
-    const prev = hide ? from.style.visibility : '';
-    if (hide)
-        from.style.visibility = 'hidden';
-    const anim = to.animate([
-        { transformOrigin: '0 0', transform: `translate(${a.left - b.left}px, ${a.top - b.top}px) scale(${a.width / b.width}, ${a.height / b.height})` },
-        { transformOrigin: '0 0', transform: 'none' },
-    ], { duration: options.duration ?? 480, easing: options.easing ?? base.FLUENT_DECELERATE });
-    await anim.finished.catch(() => undefined);
-    if (hide)
-        from.style.visibility = prev;
-}
 
 /**
  * use-scroll-animate/components/transitions — view & layout transitions.
- * `<usa-dialog>`, `<usa-accordion>`, `<usa-flip-list>`, `<usa-view-switch>`
- * and the `viewTransition()`, `flip()`, `connectedAnimation()` helpers.
+ * `<usa-dialog>`, `<usa-accordion>`, `<usa-view-switch>`
+ * and the `viewTransition()` and `flip()` helpers (4.0: `<usa-flip-list>` → `<usa-auto-animate>`,
+ * `connectedAnimation()` → `sharedTransition()`, both in `components/layout`).
  */
 /** Register every component of this category under its default tag. */
 function defineTransitionComponents() {
     defineDialog();
     defineAccordion();
-    defineFlipList();
     defineViewSwitch();
 }
 
 exports.configureComponents = base.configureComponents;
 exports.prefersReducedMotion = base.prefersReducedMotion;
-exports.connectedAnimation = connectedAnimation;
 exports.defineAccordion = defineAccordion;
 exports.defineDialog = defineDialog;
-exports.defineFlipList = defineFlipList;
 exports.defineTransitionComponents = defineTransitionComponents;
 exports.defineViewSwitch = defineViewSwitch;
 exports.flip = flip;