@aceshooting/lyra-ui 3.5.0 → 3.6.0

package/dist/components/animation/animation.class.d.ts

@@ -0,0 +1,119 @@
+import { type PropertyValues, type TemplateResult } from 'lit';
+import { LyraElement } from '../../internal/lyra-element.js';
+/** Curated preset catalog for the `name` property. `slide-in-start`/`slide-in-end`/
+ * `slide-out-start`/`slide-out-end` are resolved separately (see `slidePreset()`)
+ * because they depend on the element's inherited text direction. */
+export type LyraAnimationPreset = 'none' | 'fade-in' | 'fade-out' | 'zoom-in' | 'zoom-out' | 'slide-in-start' | 'slide-in-end' | 'slide-out-start' | 'slide-out-end' | 'slide-in-up' | 'slide-in-down' | 'bounce' | 'pulse' | 'spin' | 'shake';
+/** Ties `duration`/`easing` to the shared `--lyra-transition-*` tokens instead of
+ * the raw numeric properties. `'custom'` (the default) leaves `duration`/`easing`
+ * fully consumer-controlled. */
+export type LyraAnimationTimingPreset = 'custom' | 'fast' | 'base' | 'ambient';
+export interface LyraAnimationEventMap {
+    'lyra-start': CustomEvent<undefined>;
+    'lyra-finish': CustomEvent<undefined>;
+    'lyra-cancel': CustomEvent<undefined>;
+}
+/**
+ * `<lyra-animation>` declaratively animates its single slotted child through the
+ * native Web Animations API: a small curated preset catalog (`name`) or fully
+ * custom `keyframes`, explicit WAAPI timing controls, an optional
+ * `playOnVisible` trigger, and a `lyra-start`/`lyra-finish`/`lyra-cancel` event
+ * contract.
+ *
+ * `keyframes`, when set, always wins over `name`. The `iterations` default is
+ * `Infinity` (mirrors the upstream Web Awesome/Shoelace animation contract
+ * verbatim) -- a named preset plays forever unless the consumer sets
+ * `iterations="1"`.
+ *
+ * `direction` is the Web Animations API's `PlaybackDirection`
+ * (`'normal' | 'reverse' | 'alternate' | 'alternate-reverse'`) and is entirely
+ * unrelated to text direction. Only the `slide-in-start`/`slide-in-end`/
+ * `slide-out-start`/`slide-out-end` presets read the inherited text direction
+ * (`effectiveDirection`) to resolve which physical edge "start"/"end" means,
+ * and they do so fresh every time the animation is (re)built -- an animation
+ * already mid-flight is not retroactively re-mirrored if an ancestor `dir`
+ * flips while it plays; the next rebuild picks up the change.
+ *
+ * `respectReducedMotion` (default `true`) caps playback to one iteration and
+ * calls `finish()` immediately instead of playing, whenever the OS/browser
+ * reports `prefers-reduced-motion: reduce` -- the target snaps straight to
+ * its resolved end state, and `lyra-start`/`lyra-finish` still fire in order
+ * so a consumer sequencing further UI off those events keeps working even
+ * though nothing visibly interpolated. Set `respectReducedMotion="false"`
+ * only for genuine user-triggered feedback (e.g. a drag-confirm snap-back)
+ * where a silent jump would be more confusing than a fast real animation --
+ * ambient/decorative animation should always leave this at its default.
+ *
+ * `timingPreset` (default `'custom'`) optionally derives `duration`/`easing`
+ * from the shared `--lyra-transition-fast`/`-base`/`-ambient` tokens instead
+ * of the raw `duration`/`easing` property values, so an app's global motion
+ * retiming reaches this component's animations too.
+ *
+ * @customElement lyra-animation
+ * @slot - The element to animate. A second slotted element is accepted without error but ignored.
+ * @event lyra-start - A new animation was created and playback began or restarted.
+ * @event lyra-finish - The animation reached its natural end, including the reduced-motion instant-finish path.
+ * @event lyra-cancel - The animation was canceled via the public `cancel()` method or external cancellation.
+ * @cssprop [--lyra-animation-slide-distance=100%] - Travel distance for the slide-in/slide-out/slide-in-up/slide-in-down presets.
+ * @cssprop [--lyra-animation-zoom-scale=0.5] - Starting/ending scale factor for the zoom-in/zoom-out presets.
+ * @cssprop [--lyra-animation-bounce-height=25%] - Peak lift height of the bounce preset.
+ * @cssprop [--lyra-animation-shake-distance=4%] - Horizontal travel of the shake preset.
+ */
+export declare class LyraAnimation extends LyraElement<LyraAnimationEventMap> {
+    static styles: import("lit").CSSResultGroup[];
+    name: LyraAnimationPreset;
+    keyframes: Keyframe[] | undefined;
+    play: boolean;
+    delay: number;
+    direction: PlaybackDirection;
+    duration: number;
+    easing: string;
+    endDelay: number;
+    fill: FillMode;
+    iterations: number;
+    iterationStart: number;
+    playbackRate: number;
+    timingPreset: LyraAnimationTimingPreset;
+    respectReducedMotion: boolean;
+    playOnVisible: boolean;
+    playOnVisibleRepeat: boolean;
+    rootMargin: string;
+    threshold: number | number[];
+    root: Element | null;
+    private animation?;
+    private hasStarted;
+    private visibilityObserver?;
+    private motionQuery?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private onMotionPreferenceChange;
+    protected updated(changed: PropertyValues): void;
+    private onSlotChange;
+    private currentTarget;
+    private resolveKeyframes;
+    private syncVisibilityObserver;
+    private destroyAnimation;
+    private createAnimation;
+    private applyPlayState;
+    private onAnimationFinish;
+    private onAnimationCancel;
+    get currentTime(): number;
+    set currentTime(value: number);
+    /** Convenience sugar for `this.play = true`. Named `start()`, not `play()`,
+     * because `play` is already a reactive boolean property on this class and a
+     * method cannot share that identifier. */
+    start(): void;
+    /** Convenience sugar for `this.play = false`. */
+    pause(): void;
+    /** Forwards to the underlying `Animation.cancel()`. Fires `lyra-cancel`. */
+    cancel(): void;
+    /** Forwards to the underlying `Animation.finish()`. */
+    finish(): void;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-animation': LyraAnimation;
+    }
+}
+//# sourceMappingURL=animation.class.d.ts.map

package/dist/components/animation/animation.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.class.d.ts","sourceRoot":"","sources":["../../../src/components/animation/animation.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAErE,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D;;oEAEoE;AACpE,MAAM,MAAM,mBAAmB,GAC3B,MAAM,GACN,SAAS,GACT,UAAU,GACV,SAAS,GACT,UAAU,GACV,gBAAgB,GAChB,cAAc,GACd,iBAAiB,GACjB,eAAe,GACf,aAAa,GACb,eAAe,GACf,QAAQ,GACR,OAAO,GACP,MAAM,GACN,OAAO,CAAC;AAEZ;;gCAEgC;AAChC,MAAM,MAAM,yBAAyB,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AAE/E,MAAM,WAAW,qBAAqB;IACpC,YAAY,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACrC,aAAa,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;IACtC,aAAa,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC;CACvC;AAgFD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,qBAAa,aAAc,SAAQ,WAAW,CAAC,qBAAqB,CAAC;IACnE,MAAM,CAAC,MAAM,iCAAgC;IAEjC,IAAI,EAAE,mBAAmB,CAAU;IACf,SAAS,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAa;IAClC,IAAI,UAAS;IAC7B,KAAK,SAAK;IAC1B,SAAS,EAAE,iBAAiB,CAAY;IACxB,QAAQ,SAAQ;IAChC,MAAM,SAAY;IACsB,QAAQ,SAAK;IACrD,IAAI,EAAE,QAAQ,CAAU;IACR,UAAU,SAAY;IACQ,cAAc,SAAK;IACrB,YAAY,SAAK;IAChB,YAAY,EAAE,yBAAyB,CAAY;IAC3B,oBAAoB,UAAQ;IACnC,aAAa,UAAS;IACf,mBAAmB,UAAS;IACrE,UAAU,SAAS;IAC3B,SAAS,EAAE,MAAM,GAAG,MAAM,EAAE,CAAK;IACjC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAQ;IAE5D,OAAO,CAAC,SAAS,CAAC,CAAY;IAC9B,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,kBAAkB,CAAC,CAAuB;IAClD,OAAO,CAAC,WAAW,CAAC,CAAiB;IAErC,iBAAiB,IAAI,IAAI,CAQxB;IAED,oBAAoB,IAAI,IAAI,CAO3B;IAKD,OAAO,CAAC,wBAAwB,CAAsC;IAEtE,SAAS,CAAC,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAqB/C;IAED,OAAO,CAAC,YAAY,CAGlB;IAEF,OAAO,CAAC,aAAa;IAMrB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,sBAAsB,CA4B5B;IAWF,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,eAAe,CA6BrB;IAQF,OAAO,CAAC,cAAc,CAWpB;IAEF,OAAO,CAAC,iBAAiB,CAIvB;IAEF,OAAO,CAAC,iBAAiB,CAIvB;IAEF,IAAI,WAAW,IAAI,MAAM,CAExB;IAED,IAAI,WAAW,CAAC,KAAK,EAAE,MAAM,EAE5B;IAED;;8CAE0C;IAC1C,KAAK,IAAI,IAAI,CAEZ;IAED,iDAAiD;IACjD,KAAK,IAAI,IAAI,CAEZ;IAED,4EAA4E;IAC5E,MAAM,IAAI,IAAI,CAEb;IAED,uDAAuD;IACvD,MAAM,IAAI,IAAI,CAEb;IAED,MAAM,IAAI,cAAc,CAEvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,aAAa,CAAC;KACjC;CACF"}

package/dist/components/animation/animation.class.js

@@ -0,0 +1,420 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { LyraElement } from '../../internal/lyra-element.js';
+import { prefersReducedMotion } from '../../internal/motion.js';
+import { styles } from './animation.styles.js';
+const PRESETS = {
+    'fade-in': [{ opacity: 0 }, { opacity: 1 }],
+    'fade-out': [{ opacity: 1 }, { opacity: 0 }],
+    'zoom-in': [
+        { opacity: 0, transform: 'scale(var(--lyra-animation-zoom-scale, 0.5))' },
+        { opacity: 1, transform: 'scale(1)' },
+    ],
+    'zoom-out': [
+        { opacity: 1, transform: 'scale(1)' },
+        { opacity: 0, transform: 'scale(var(--lyra-animation-zoom-scale, 0.5))' },
+    ],
+    'slide-in-up': [
+        { transform: 'translateY(var(--lyra-animation-slide-distance, 100%))', opacity: 0 },
+        { transform: 'translateY(0)', opacity: 1 },
+    ],
+    'slide-in-down': [
+        { transform: 'translateY(calc(-1 * var(--lyra-animation-slide-distance, 100%)))', opacity: 0 },
+        { transform: 'translateY(0)', opacity: 1 },
+    ],
+    bounce: [
+        { transform: 'translateY(0)', offset: 0 },
+        { transform: 'translateY(calc(-1 * var(--lyra-animation-bounce-height, 25%)))', offset: 0.4 },
+        { transform: 'translateY(0)', offset: 0.7 },
+        { transform: 'translateY(calc(-0.4 * var(--lyra-animation-bounce-height, 25%)))', offset: 0.85 },
+        { transform: 'translateY(0)', offset: 1 },
+    ],
+    pulse: [
+        { transform: 'scale(1)', opacity: 1, offset: 0 },
+        { transform: 'scale(0.92)', opacity: 0.75, offset: 0.5 },
+        { transform: 'scale(1)', opacity: 1, offset: 1 },
+    ],
+    spin: [{ transform: 'rotate(0deg)' }, { transform: 'rotate(360deg)' }],
+    shake: [
+        { transform: 'translateX(0)', offset: 0 },
+        { transform: 'translateX(calc(-1 * var(--lyra-animation-shake-distance, 4%)))', offset: 0.2 },
+        { transform: 'translateX(var(--lyra-animation-shake-distance, 4%))', offset: 0.4 },
+        { transform: 'translateX(calc(-1 * var(--lyra-animation-shake-distance, 4%)))', offset: 0.6 },
+        { transform: 'translateX(var(--lyra-animation-shake-distance, 4%))', offset: 0.8 },
+        { transform: 'translateX(0)', offset: 1 },
+    ],
+};
+/** Builds the RTL-aware slide keyframes for `slide-in-start`/`slide-in-end`/
+ * `slide-out-start`/`slide-out-end`. "start"/"end" are logical edges: under
+ * `ltr` the start edge is physically left and the end edge is physically
+ * right; under `rtl` that's reversed. */
+function slidePreset(edge, mode, dir) {
+    const negative = dir === 'ltr' ? edge === 'start' : edge === 'end';
+    const offscreen = `translateX(${negative ? 'calc(-1 * var(--lyra-animation-slide-distance, 100%))' : 'var(--lyra-animation-slide-distance, 100%)'})`;
+    const onscreen = 'translateX(0)';
+    return mode === 'in'
+        ? [
+            { transform: offscreen, opacity: 0 },
+            { transform: onscreen, opacity: 1 },
+        ]
+        : [
+            { transform: onscreen, opacity: 1 },
+            { transform: offscreen, opacity: 0 },
+        ];
+}
+const DIRECTIONAL_SLIDE_NAMES = new Set(['slide-in-start', 'slide-in-end', 'slide-out-start', 'slide-out-end']);
+/** Reads and decomposes a compound `--lyra-transition-*` token (e.g. `"180ms ease-out"`)
+ * into the plain numeric `duration`/string `easing` pair the Web Animations API needs --
+ * WAAPI's numeric timing options cannot take a `var()` reference the way a CSS `transform`
+ * string can. Resolves against fully computed style, so a theme override that itself uses
+ * `var()` internally never leaks unresolved text into `easing`. */
+function resolveTimingToken(el, preset) {
+    const raw = getComputedStyle(el).getPropertyValue(`--lyra-transition-${preset}`).trim();
+    const match = /^([\d.]+)(ms|s)\s+(.+)$/.exec(raw);
+    if (!match)
+        return { duration: 1000, easing: 'linear' };
+    const [, num, unit, easing] = match;
+    return { duration: unit === 's' ? parseFloat(num) * 1000 : parseFloat(num), easing: easing.trim() };
+}
+/**
+ * `<lyra-animation>` declaratively animates its single slotted child through the
+ * native Web Animations API: a small curated preset catalog (`name`) or fully
+ * custom `keyframes`, explicit WAAPI timing controls, an optional
+ * `playOnVisible` trigger, and a `lyra-start`/`lyra-finish`/`lyra-cancel` event
+ * contract.
+ *
+ * `keyframes`, when set, always wins over `name`. The `iterations` default is
+ * `Infinity` (mirrors the upstream Web Awesome/Shoelace animation contract
+ * verbatim) -- a named preset plays forever unless the consumer sets
+ * `iterations="1"`.
+ *
+ * `direction` is the Web Animations API's `PlaybackDirection`
+ * (`'normal' | 'reverse' | 'alternate' | 'alternate-reverse'`) and is entirely
+ * unrelated to text direction. Only the `slide-in-start`/`slide-in-end`/
+ * `slide-out-start`/`slide-out-end` presets read the inherited text direction
+ * (`effectiveDirection`) to resolve which physical edge "start"/"end" means,
+ * and they do so fresh every time the animation is (re)built -- an animation
+ * already mid-flight is not retroactively re-mirrored if an ancestor `dir`
+ * flips while it plays; the next rebuild picks up the change.
+ *
+ * `respectReducedMotion` (default `true`) caps playback to one iteration and
+ * calls `finish()` immediately instead of playing, whenever the OS/browser
+ * reports `prefers-reduced-motion: reduce` -- the target snaps straight to
+ * its resolved end state, and `lyra-start`/`lyra-finish` still fire in order
+ * so a consumer sequencing further UI off those events keeps working even
+ * though nothing visibly interpolated. Set `respectReducedMotion="false"`
+ * only for genuine user-triggered feedback (e.g. a drag-confirm snap-back)
+ * where a silent jump would be more confusing than a fast real animation --
+ * ambient/decorative animation should always leave this at its default.
+ *
+ * `timingPreset` (default `'custom'`) optionally derives `duration`/`easing`
+ * from the shared `--lyra-transition-fast`/`-base`/`-ambient` tokens instead
+ * of the raw `duration`/`easing` property values, so an app's global motion
+ * retiming reaches this component's animations too.
+ *
+ * @customElement lyra-animation
+ * @slot - The element to animate. A second slotted element is accepted without error but ignored.
+ * @event lyra-start - A new animation was created and playback began or restarted.
+ * @event lyra-finish - The animation reached its natural end, including the reduced-motion instant-finish path.
+ * @event lyra-cancel - The animation was canceled via the public `cancel()` method or external cancellation.
+ * @cssprop [--lyra-animation-slide-distance=100%] - Travel distance for the slide-in/slide-out/slide-in-up/slide-in-down presets.
+ * @cssprop [--lyra-animation-zoom-scale=0.5] - Starting/ending scale factor for the zoom-in/zoom-out presets.
+ * @cssprop [--lyra-animation-bounce-height=25%] - Peak lift height of the bounce preset.
+ * @cssprop [--lyra-animation-shake-distance=4%] - Horizontal travel of the shake preset.
+ */
+export class LyraAnimation extends LyraElement {
+    constructor() {
+        super(...arguments);
+        this.name = 'none';
+        this.keyframes = undefined;
+        this.play = false;
+        this.delay = 0;
+        this.direction = 'normal';
+        this.duration = 1000;
+        this.easing = 'linear';
+        this.endDelay = 0;
+        this.fill = 'auto';
+        this.iterations = Infinity;
+        this.iterationStart = 0;
+        this.playbackRate = 1;
+        this.timingPreset = 'custom';
+        this.respectReducedMotion = true;
+        this.playOnVisible = false;
+        this.playOnVisibleRepeat = false;
+        this.rootMargin = '0px';
+        this.threshold = 0;
+        this.root = null;
+        this.hasStarted = false;
+        // A live external event (the OS/browser toggling its reduced-motion
+        // setting), not a construction-order concern -- rebuild directly rather
+        // than routing through scheduleAfterUpdate.
+        this.onMotionPreferenceChange = () => this.createAnimation();
+        this.onSlotChange = () => {
+            this.createAnimation();
+            this.syncVisibilityObserver();
+        };
+        this.syncVisibilityObserver = () => {
+            this.visibilityObserver?.disconnect();
+            this.visibilityObserver = undefined;
+            if (!this.playOnVisible)
+                return;
+            const target = this.currentTarget();
+            if (!target)
+                return;
+            if (typeof IntersectionObserver === 'undefined') {
+                // No observer support in this environment -- fail open and just play.
+                this.play = true;
+                return;
+            }
+            this.visibilityObserver = new IntersectionObserver((entries) => {
+                const entry = entries[entries.length - 1];
+                if (!entry)
+                    return;
+                if (entry.isIntersecting) {
+                    this.play = true;
+                    if (!this.playOnVisibleRepeat) {
+                        this.visibilityObserver?.disconnect();
+                        this.visibilityObserver = undefined;
+                    }
+                }
+                else if (this.playOnVisibleRepeat) {
+                    this.play = false;
+                }
+            }, { root: this.root instanceof Element ? this.root : null, rootMargin: this.rootMargin, threshold: this.threshold });
+            this.visibilityObserver.observe(target);
+        };
+        this.createAnimation = () => {
+            this.destroyAnimation();
+            const target = this.currentTarget();
+            const keyframes = this.resolveKeyframes();
+            if (!target || !keyframes)
+                return;
+            const reduced = this.respectReducedMotion && prefersReducedMotion();
+            const { duration, easing } = this.timingPreset === 'custom' ? { duration: this.duration, easing: this.easing } : resolveTimingToken(this, this.timingPreset);
+            const options = {
+                delay: this.delay,
+                direction: this.direction,
+                duration,
+                easing,
+                endDelay: this.endDelay,
+                fill: this.fill,
+                iterationStart: this.iterationStart,
+                iterations: reduced ? Math.min(this.iterations, 1) : this.iterations,
+            };
+            this.animation = target.animate(keyframes, options);
+            this.animation.playbackRate = this.playbackRate;
+            this.animation.addEventListener('cancel', this.onAnimationCancel);
+            this.animation.addEventListener('finish', this.onAnimationFinish);
+            if (this.play) {
+                this.hasStarted = true;
+                this.emit('lyra-start');
+                if (reduced)
+                    this.animation.finish();
+            }
+            else {
+                this.animation.pause();
+            }
+        };
+        // Guards against double-emitting lyra-start when both a rebuild-triggering
+        // property and `play` change in the same update batch (e.g. the element's
+        // very first update, where every property is "changed"): createAnimation()
+        // already handles the emit and sets hasStarted in that case, so this path
+        // (only reached when a rebuild did NOT also happen) never runs redundantly
+        // for that same transition.
+        this.applyPlayState = () => {
+            if (!this.animation)
+                return;
+            if (this.play) {
+                if (!this.hasStarted) {
+                    this.hasStarted = true;
+                    this.emit('lyra-start');
+                }
+                this.animation.play();
+            }
+            else {
+                this.animation.pause();
+            }
+        };
+        this.onAnimationFinish = () => {
+            this.play = false;
+            this.hasStarted = false;
+            this.emit('lyra-finish');
+        };
+        this.onAnimationCancel = () => {
+            this.play = false;
+            this.hasStarted = false;
+            this.emit('lyra-cancel');
+        };
+    }
+    static { this.styles = [LyraElement.styles, styles]; }
+    connectedCallback() {
+        super.connectedCallback();
+        this.motionQuery = typeof matchMedia === 'function' ? matchMedia('(prefers-reduced-motion: reduce)') : undefined;
+        this.motionQuery?.addEventListener('change', this.onMotionPreferenceChange);
+        this.scheduleAfterUpdate(() => {
+            this.createAnimation();
+            this.syncVisibilityObserver();
+        });
+    }
+    disconnectedCallback() {
+        this.destroyAnimation();
+        this.visibilityObserver?.disconnect();
+        this.visibilityObserver = undefined;
+        this.motionQuery?.removeEventListener('change', this.onMotionPreferenceChange);
+        this.motionQuery = undefined;
+        super.disconnectedCallback();
+    }
+    updated(changed) {
+        const rebuildKeys = [
+            'name',
+            'keyframes',
+            'delay',
+            'direction',
+            'duration',
+            'easing',
+            'endDelay',
+            'fill',
+            'iterations',
+            'iterationStart',
+            'timingPreset',
+            'respectReducedMotion',
+        ];
+        if (rebuildKeys.some((key) => changed.has(key)))
+            this.createAnimation();
+        else if (changed.has('play'))
+            this.applyPlayState();
+        if (changed.has('playbackRate') && this.animation)
+            this.animation.playbackRate = this.playbackRate;
+        if (['playOnVisible', 'playOnVisibleRepeat', 'rootMargin', 'threshold', 'root'].some((key) => changed.has(key))) {
+            this.scheduleAfterUpdate(this.syncVisibilityObserver);
+        }
+    }
+    currentTarget() {
+        const slot = this.renderRoot.querySelector('slot');
+        const [first] = slot?.assignedElements({ flatten: true }) ?? [];
+        return first instanceof HTMLElement ? first : undefined;
+    }
+    resolveKeyframes() {
+        if (this.keyframes)
+            return this.keyframes;
+        const { name } = this;
+        if (name === 'none')
+            return undefined;
+        if (DIRECTIONAL_SLIDE_NAMES.has(name)) {
+            const mode = name.startsWith('slide-in-') ? 'in' : 'out';
+            const edge = name.endsWith('-start') ? 'start' : 'end';
+            return slidePreset(edge, mode, this.effectiveDirection);
+        }
+        return PRESETS[name];
+    }
+    // Listeners are removed before `.cancel()` is called, not after. This
+    // method runs at the top of every createAnimation() rebuild (e.g. the
+    // consumer changed `duration` while playing) and in disconnectedCallback.
+    // Calling `.cancel()` while the `cancel` listener is still attached would
+    // spuriously fire the public `lyra-cancel` event and reset `play` back to
+    // `false` on every routine property change -- breaking the "lyra-start
+    // fires again on restart" contract. The public `cancel()` method below is
+    // a deliberately separate path that does NOT call this, so the native
+    // `cancel` event is allowed through to `lyra-cancel` on purpose.
+    destroyAnimation() {
+        if (!this.animation)
+            return;
+        this.animation.removeEventListener('cancel', this.onAnimationCancel);
+        this.animation.removeEventListener('finish', this.onAnimationFinish);
+        this.animation.cancel();
+        this.animation = undefined;
+        this.hasStarted = false;
+    }
+    get currentTime() {
+        return this.animation?.currentTime ?? 0;
+    }
+    set currentTime(value) {
+        if (this.animation)
+            this.animation.currentTime = value;
+    }
+    /** Convenience sugar for `this.play = true`. Named `start()`, not `play()`,
+     * because `play` is already a reactive boolean property on this class and a
+     * method cannot share that identifier. */
+    start() {
+        this.play = true;
+    }
+    /** Convenience sugar for `this.play = false`. */
+    pause() {
+        this.play = false;
+    }
+    /** Forwards to the underlying `Animation.cancel()`. Fires `lyra-cancel`. */
+    cancel() {
+        this.animation?.cancel();
+    }
+    /** Forwards to the underlying `Animation.finish()`. */
+    finish() {
+        this.animation?.finish();
+    }
+    render() {
+        return html `<slot @slotchange=${this.onSlotChange}></slot>`;
+    }
+}
+__decorate([
+    property()
+], LyraAnimation.prototype, "name", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraAnimation.prototype, "keyframes", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraAnimation.prototype, "play", void 0);
+__decorate([
+    property({ type: Number })
+], LyraAnimation.prototype, "delay", void 0);
+__decorate([
+    property()
+], LyraAnimation.prototype, "direction", void 0);
+__decorate([
+    property({ type: Number })
+], LyraAnimation.prototype, "duration", void 0);
+__decorate([
+    property()
+], LyraAnimation.prototype, "easing", void 0);
+__decorate([
+    property({ type: Number, attribute: 'end-delay' })
+], LyraAnimation.prototype, "endDelay", void 0);
+__decorate([
+    property()
+], LyraAnimation.prototype, "fill", void 0);
+__decorate([
+    property({ type: Number })
+], LyraAnimation.prototype, "iterations", void 0);
+__decorate([
+    property({ type: Number, attribute: 'iteration-start' })
+], LyraAnimation.prototype, "iterationStart", void 0);
+__decorate([
+    property({ type: Number, attribute: 'playback-rate' })
+], LyraAnimation.prototype, "playbackRate", void 0);
+__decorate([
+    property({ attribute: 'timing-preset', reflect: true })
+], LyraAnimation.prototype, "timingPreset", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'respect-reduced-motion', reflect: true })
+], LyraAnimation.prototype, "respectReducedMotion", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'play-on-visible', reflect: true })
+], LyraAnimation.prototype, "playOnVisible", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'play-on-visible-repeat', reflect: true })
+], LyraAnimation.prototype, "playOnVisibleRepeat", void 0);
+__decorate([
+    property({ attribute: 'root-margin' })
+], LyraAnimation.prototype, "rootMargin", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraAnimation.prototype, "threshold", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraAnimation.prototype, "root", void 0);
+//# sourceMappingURL=animation.class.js.map

package/dist/components/animation/animation.class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.class.js","sourceRoot":"","sources":["../../../src/components/animation/animation.class.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,IAAI,EAA4C,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAiC/C,MAAM,OAAO,GAAqD;IAChE,SAAS,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;IAC3C,UAAU,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;IAC5C,SAAS,EAAE;QACT,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,8CAA8C,EAAE;QACzE,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE;KACtC;IACD,UAAU,EAAE;QACV,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,UAAU,EAAE;QACrC,EAAE,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,8CAA8C,EAAE;KAC1E;IACD,aAAa,EAAE;QACb,EAAE,SAAS,EAAE,wDAAwD,EAAE,OAAO,EAAE,CAAC,EAAE;QACnF,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,EAAE;KAC3C;IACD,eAAe,EAAE;QACf,EAAE,SAAS,EAAE,mEAAmE,EAAE,OAAO,EAAE,CAAC,EAAE;QAC9F,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,CAAC,EAAE;KAC3C;IACD,MAAM,EAAE;QACN,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,CAAC,EAAE;QACzC,EAAE,SAAS,EAAE,iEAAiE,EAAE,MAAM,EAAE,GAAG,EAAE;QAC7F,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,GAAG,EAAE;QAC3C,EAAE,SAAS,EAAE,mEAAmE,EAAE,MAAM,EAAE,IAAI,EAAE;QAChG,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,CAAC,EAAE;KAC1C;IACD,KAAK,EAAE;QACL,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;QAChD,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE;QACxD,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;KACjD;IACD,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE,SAAS,EAAE,gBAAgB,EAAE,CAAC;IACtE,KAAK,EAAE;QACL,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,CAAC,EAAE;QACzC,EAAE,SAAS,EAAE,iEAAiE,EAAE,MAAM,EAAE,GAAG,EAAE;QAC7F,EAAE,SAAS,EAAE,sDAAsD,EAAE,MAAM,EAAE,GAAG,EAAE;QAClF,EAAE,SAAS,EAAE,iEAAiE,EAAE,MAAM,EAAE,GAAG,EAAE;QAC7F,EAAE,SAAS,EAAE,sDAAsD,EAAE,MAAM,EAAE,GAAG,EAAE;QAClF,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,CAAC,EAAE;KAC1C;CACF,CAAC;AAEF;;;yCAGyC;AACzC,SAAS,WAAW,CAAC,IAAqB,EAAE,IAAkB,EAAE,GAAkB;IAChF,MAAM,QAAQ,GAAG,GAAG,KAAK,KAAK,CAAC,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC;IACnE,MAAM,SAAS,GAAG,cAChB,QAAQ,CAAC,CAAC,CAAC,uDAAuD,CAAC,CAAC,CAAC,4CACvE,GAAG,CAAC;IACJ,MAAM,QAAQ,GAAG,eAAe,CAAC;IACjC,OAAO,IAAI,KAAK,IAAI;QAClB,CAAC,CAAC;YACE,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE;YACpC,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EAAE;SACpC;QACH,CAAC,CAAC;YACE,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,EAAE;YACnC,EAAE,SAAS,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE;SACrC,CAAC;AACR,CAAC;AAED,MAAM,uBAAuB,GAAG,IAAI,GAAG,CAAsB,CAAC,gBAAgB,EAAE,cAAc,EAAE,iBAAiB,EAAE,eAAe,CAAC,CAAC,CAAC;AAErI;;;;mEAImE;AACnE,SAAS,kBAAkB,CAAC,EAAe,EAAE,MAAmC;IAC9E,MAAM,GAAG,GAAG,gBAAgB,CAAC,EAAE,CAAC,CAAC,gBAAgB,CAAC,qBAAqB,MAAM,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;IACxF,MAAM,KAAK,GAAG,yBAAyB,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IAClD,IAAI,CAAC,KAAK;QAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC;IACxD,MAAM,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,KAAK,CAAC;IACpC,OAAO,EAAE,QAAQ,EAAE,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,IAAI,EAAE,EAAE,CAAC;AACtG,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,MAAM,OAAO,aAAc,SAAQ,WAAkC;IAArE;;QAGc,SAAI,GAAwB,MAAM,CAAC;QACf,cAAS,GAA2B,SAAS,CAAC;QAClC,SAAI,GAAG,KAAK,CAAC;QAC7B,UAAK,GAAG,CAAC,CAAC;QAC1B,cAAS,GAAsB,QAAQ,CAAC;QACxB,aAAQ,GAAG,IAAI,CAAC;QAChC,WAAM,GAAG,QAAQ,CAAC;QACsB,aAAQ,GAAG,CAAC,CAAC;QACrD,SAAI,GAAa,MAAM,CAAC;QACR,eAAU,GAAG,QAAQ,CAAC;QACQ,mBAAc,GAAG,CAAC,CAAC;QACrB,iBAAY,GAAG,CAAC,CAAC;QAChB,iBAAY,GAA8B,QAAQ,CAAC;QAC3B,yBAAoB,GAAG,IAAI,CAAC;QACnC,kBAAa,GAAG,KAAK,CAAC;QACf,wBAAmB,GAAG,KAAK,CAAC;QACrE,eAAU,GAAG,KAAK,CAAC;QAC3B,cAAS,GAAsB,CAAC,CAAC;QACjC,SAAI,GAAmB,IAAI,CAAC;QAGpD,eAAU,GAAG,KAAK,CAAC;QAuB3B,oEAAoE;QACpE,wEAAwE;QACxE,4CAA4C;QACpC,6BAAwB,GAAG,GAAS,EAAE,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;QAyB9D,iBAAY,GAAG,GAAS,EAAE;YAChC,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAChC,CAAC,CAAC;QAoBM,2BAAsB,GAAG,GAAS,EAAE;YAC1C,IAAI,CAAC,kBAAkB,EAAE,UAAU,EAAE,CAAC;YACtC,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;YACpC,IAAI,CAAC,IAAI,CAAC,aAAa;gBAAE,OAAO;YAChC,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YACpC,IAAI,CAAC,MAAM;gBAAE,OAAO;YACpB,IAAI,OAAO,oBAAoB,KAAK,WAAW,EAAE,CAAC;gBAChD,sEAAsE;gBACtE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;gBACjB,OAAO;YACT,CAAC;YACD,IAAI,CAAC,kBAAkB,GAAG,IAAI,oBAAoB,CAChD,CAAC,OAAO,EAAE,EAAE;gBACV,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;gBAC1C,IAAI,CAAC,KAAK;oBAAE,OAAO;gBACnB,IAAI,KAAK,CAAC,cAAc,EAAE,CAAC;oBACzB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;oBACjB,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAAE,CAAC;wBAC9B,IAAI,CAAC,kBAAkB,EAAE,UAAU,EAAE,CAAC;wBACtC,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;oBACtC,CAAC;gBACH,CAAC;qBAAM,IAAI,IAAI,CAAC,mBAAmB,EAAE,CAAC;oBACpC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBACpB,CAAC;YACH,CAAC,EACD,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,YAAY,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,CAClH,CAAC;YACF,IAAI,CAAC,kBAAkB,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAC1C,CAAC,CAAC;QAoBM,oBAAe,GAAG,GAAS,EAAE;YACnC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,MAAM,MAAM,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;YACpC,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1C,IAAI,CAAC,MAAM,IAAI,CAAC,SAAS;gBAAE,OAAO;YAClC,MAAM,OAAO,GAAG,IAAI,CAAC,oBAAoB,IAAI,oBAAoB,EAAE,CAAC;YACpE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GACxB,IAAI,CAAC,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,kBAAkB,CAAC,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;YAClI,MAAM,OAAO,GAA6B;gBACxC,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,SAAS,EAAE,IAAI,CAAC,SAAS;gBACzB,QAAQ;gBACR,MAAM;gBACN,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,cAAc,EAAE,IAAI,CAAC,cAAc;gBACnC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,UAAU;aACrE,CAAC;YACF,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,CAAC;YACpD,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;YAChD,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAClE,IAAI,CAAC,SAAS,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;YAClE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;gBACvB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBACxB,IAAI,OAAO;oBAAE,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;YACvC,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;YACzB,CAAC;QACH,CAAC,CAAC;QAEF,2EAA2E;QAC3E,0EAA0E;QAC1E,2EAA2E;QAC3E,0EAA0E;QAC1E,2EAA2E;QAC3E,4BAA4B;QACpB,mBAAc,GAAG,GAAS,EAAE;YAClC,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,OAAO;YAC5B,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;gBACd,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE,CAAC;oBACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;oBACvB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;gBAC1B,CAAC;gBACD,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;YACxB,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;YACzB,CAAC;QACH,CAAC,CAAC;QAEM,sBAAiB,GAAG,GAAS,EAAE;YACrC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC3B,CAAC,CAAC;QAEM,sBAAiB,GAAG,GAAS,EAAE;YACrC,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;YAClB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QAC3B,CAAC,CAAC;IAmCJ,CAAC;aAhPQ,WAAM,GAAG,CAAC,WAAW,CAAC,MAAM,EAAE,MAAM,CAAC,AAA/B,CAAgC;IA2B7C,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAC;QAC1B,IAAI,CAAC,WAAW,GAAG,OAAO,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QACjH,IAAI,CAAC,WAAW,EAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC5E,IAAI,CAAC,mBAAmB,CAAC,GAAG,EAAE;YAC5B,IAAI,CAAC,eAAe,EAAE,CAAC;YACvB,IAAI,CAAC,sBAAsB,EAAE,CAAC;QAChC,CAAC,CAAC,CAAC;IACL,CAAC;IAED,oBAAoB;QAClB,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,IAAI,CAAC,kBAAkB,EAAE,UAAU,EAAE,CAAC;QACtC,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;QACpC,IAAI,CAAC,WAAW,EAAE,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,wBAAwB,CAAC,CAAC;QAC/E,IAAI,CAAC,WAAW,GAAG,SAAS,CAAC;QAC7B,KAAK,CAAC,oBAAoB,EAAE,CAAC;IAC/B,CAAC;IAOS,OAAO,CAAC,OAAuB;QACvC,MAAM,WAAW,GAAG;YAClB,MAAM;YACN,WAAW;YACX,OAAO;YACP,WAAW;YACX,UAAU;YACV,QAAQ;YACR,UAAU;YACV,MAAM;YACN,YAAY;YACZ,gBAAgB;YAChB,cAAc;YACd,sBAAsB;SACd,CAAC;QACX,IAAI,WAAW,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;YAAE,IAAI,CAAC,eAAe,EAAE,CAAC;aACnE,IAAI,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC;YAAE,IAAI,CAAC,cAAc,EAAE,CAAC;QACpD,IAAI,OAAO,CAAC,GAAG,CAAC,cAAc,CAAC,IAAI,IAAI,CAAC,SAAS;YAAE,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,CAAC;QACnG,IAAI,CAAC,eAAe,EAAE,qBAAqB,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;YAChH,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;QACxD,CAAC;IACH,CAAC;IAOO,aAAa;QACnB,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QACnD,MAAM,CAAC,KAAK,CAAC,GAAG,IAAI,EAAE,gBAAgB,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC;QAChE,OAAO,KAAK,YAAY,WAAW,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;IAC1D,CAAC;IAEO,gBAAgB;QACtB,IAAI,IAAI,CAAC,SAAS;YAAE,OAAO,IAAI,CAAC,SAAS,CAAC;QAC1C,MAAM,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;QACtB,IAAI,IAAI,KAAK,MAAM;YAAE,OAAO,SAAS,CAAC;QACtC,IAAI,uBAAuB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;YACtC,MAAM,IAAI,GAAG,IAAI,CAAC,UAAU,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;YACzD,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC;YACvD,OAAO,WAAW,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,kBAAkB,CAAC,CAAC;QAC1D,CAAC;QACD,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC;IACvB,CAAC;IAgCD,sEAAsE;IACtE,sEAAsE;IACtE,0EAA0E;IAC1E,0EAA0E;IAC1E,0EAA0E;IAC1E,uEAAuE;IACvE,0EAA0E;IAC1E,sEAAsE;IACtE,iEAAiE;IACzD,gBAAgB;QACtB,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO;QAC5B,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACrE,IAAI,CAAC,SAAS,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACrE,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;QACxB,IAAI,CAAC,SAAS,GAAG,SAAS,CAAC;QAC3B,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;IAC1B,CAAC;IAgED,IAAI,WAAW;QACb,OAAQ,IAAI,CAAC,SAAS,EAAE,WAA6B,IAAI,CAAC,CAAC;IAC7D,CAAC;IAED,IAAI,WAAW,CAAC,KAAa;QAC3B,IAAI,IAAI,CAAC,SAAS;YAAE,IAAI,CAAC,SAAS,CAAC,WAAW,GAAG,KAAK,CAAC;IACzD,CAAC;IAED;;8CAE0C;IAC1C,KAAK;QACH,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,iDAAiD;IACjD,KAAK;QACH,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,4EAA4E;IAC5E,MAAM;QACJ,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;IAC3B,CAAC;IAED,uDAAuD;IACvD,MAAM;QACJ,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;IAC3B,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA,qBAAqB,IAAI,CAAC,YAAY,UAAU,CAAC;IAC9D,CAAC;CACF;AA9Oa;IAAX,QAAQ,EAAE;2CAAoC;AACf;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;gDAA+C;AAClC;IAA3C,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2CAAc;AAC7B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAW;AAC1B;IAAX,QAAQ,EAAE;gDAAyC;AACxB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAiB;AAChC;IAAX,QAAQ,EAAE;6CAAmB;AACsB;IAAnD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,CAAC;+CAAc;AACrD;IAAX,QAAQ,EAAE;2CAAyB;AACR;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;iDAAuB;AACQ;IAAzD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAC;qDAAoB;AACrB;IAAvD,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;mDAAkB;AAChB;IAAxD,QAAQ,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;mDAAoD;AAC3B;IAAhF,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;2DAA6B;AACnC;IAAzE,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;oDAAuB;AACf;IAAhF,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,wBAAwB,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;0DAA6B;AACrE;IAAvC,QAAQ,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC;iDAAoB;AAC3B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;gDAAkC;AACjC;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;2CAA6B"}

package/dist/components/animation/animation.d.ts

@@ -0,0 +1,2 @@
+export * from './animation.class.js';
+//# sourceMappingURL=animation.d.ts.map

package/dist/components/animation/animation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.d.ts","sourceRoot":"","sources":["../../../src/components/animation/animation.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/dist/components/animation/animation.js

@@ -0,0 +1,5 @@
+export * from './animation.class.js';
+import { LyraAnimation } from './animation.class.js';
+import { defineElement } from '../../internal/prefix.js';
+defineElement('animation', LyraAnimation);
+//# sourceMappingURL=animation.js.map

package/dist/components/animation/animation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.js","sourceRoot":"","sources":["../../../src/components/animation/animation.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,aAAa,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC"}

package/dist/components/animation/animation.styles.d.ts

@@ -0,0 +1,2 @@
+export declare const styles: import("lit").CSSResult;
+//# sourceMappingURL=animation.styles.d.ts.map

package/dist/components/animation/animation.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.styles.d.ts","sourceRoot":"","sources":["../../../src/components/animation/animation.styles.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,MAAM,yBAQlB,CAAC"}

package/dist/components/animation/animation.styles.js

@@ -0,0 +1,18 @@
+import { css } from 'lit';
+// This component has no CSS `animation:`/`transition:` declaration of its
+// own to disable under `@media (prefers-reduced-motion: reduce)` -- the
+// element being animated is light-DOM slotted content driven imperatively
+// via `Element.animate()`, which the shared reduced-motion block in
+// `tokens.styles.ts` (scoped to shadow-DOM descendants of `:host`) never
+// reaches. All reduced-motion handling for this component lives in JS, in
+// `animation.class.ts`'s `createAnimation()`. Do not add a media block here.
+export const styles = css `
+  :host {
+    display: contents;
+    --lyra-animation-slide-distance: 100%;
+    --lyra-animation-zoom-scale: 0.5;
+    --lyra-animation-bounce-height: 25%;
+    --lyra-animation-shake-distance: 4%;
+  }
+`;
+//# sourceMappingURL=animation.styles.js.map

package/dist/components/animation/animation.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"animation.styles.js","sourceRoot":"","sources":["../../../src/components/animation/animation.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,0EAA0E;AAC1E,wEAAwE;AACxE,0EAA0E;AAC1E,oEAAoE;AACpE,yEAAyE;AACzE,0EAA0E;AAC1E,6EAA6E;AAC7E,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;CAQxB,CAAC"}