// #region Imports
// #endregion
// #region Animation Constants
/**
 * Default animation duration in milliseconds.
 *
 * @public
 */
export const DEFAULT_ANIMATION_DURATION = 250;
/**
 * Default animation easing function.
 *
 * @public
 */
export const DEFAULT_ANIMATION_EASING = 'cubic-bezier(0.25, 0.8, 0.25, 1)';
// #endregion
// #region Animation Helpers
/**
 * Animate element to a specific position using Web Animations API.
 *
 * @param element - Element to animate.
 * @param from - Start position.
 * @param to - End position.
 * @param duration - Animation duration in ms.
 * @param easing - Animation easing function.
 * @returns Animation instance.
 *
 * @public
 */
export function animatePosition(element, from, to, duration = DEFAULT_ANIMATION_DURATION, easing = DEFAULT_ANIMATION_EASING) {
    const animation = element.animate([
        { transform: `translate3d(${from.x}px, ${from.y}px, 0)` },
        { transform: `translate3d(${to.x}px, ${to.y}px, 0)` }
    ], {
        duration,
        easing,
        fill: 'forwards'
    });
    return animation;
}
/**
 * Animate element back to its original position.
 *
 * @param element - Element to animate.
 * @param currentPosition - Current position.
 * @param duration - Animation duration in ms.
 * @param easing - Animation easing function.
 * @returns Animation instance.
 *
 * @public
 */
export function animateToOriginalPosition(element, currentPosition, duration = DEFAULT_ANIMATION_DURATION, easing = DEFAULT_ANIMATION_EASING) {
    return animatePosition(element, currentPosition, {
        x: 0,
        y: 0
    }, duration, easing);
}
/**
 * Animate element opacity.
 *
 * @param element - Element to animate.
 * @param from - Start opacity (0-1).
 * @param to - End opacity (0-1).
 * @param duration - Animation duration in ms.
 * @param easing - Animation easing function.
 * @returns Animation instance.
 *
 * @public
 */
export function animateOpacity(element, from, to, duration = DEFAULT_ANIMATION_DURATION, easing = DEFAULT_ANIMATION_EASING) {
    const animation = element.animate([{ opacity: from }, { opacity: to }], {
        duration,
        easing,
        fill: 'forwards'
    });
    return animation;
}
/**
 * Fade in an element.
 *
 * @param element - Element to fade in.
 * @param duration - Animation duration in ms.
 * @returns Animation instance.
 *
 * @public
 */
export function fadeIn(element, duration = DEFAULT_ANIMATION_DURATION) {
    return animateOpacity(element, 0, 1, duration);
}
/**
 * Fade out an element.
 *
 * @param element - Element to fade out.
 * @param duration - Animation duration in ms.
 * @returns Animation instance.
 *
 * @public
 */
export function fadeOut(element, duration = DEFAULT_ANIMATION_DURATION) {
    return animateOpacity(element, 1, 0, duration);
}
// #endregion
// #region Animation Utilities
/**
 * Cancel all animations on an element.
 *
 * @param element - Element to cancel animations on.
 *
 * @public
 */
export function cancelAnimations(element) {
    const animations = element.getAnimations();
    animations.forEach((animation) => animation.cancel());
}
/**
 * Wait for an animation to finish.
 *
 * @param animation - Animation to wait for.
 * @returns Promise that resolves when animation finishes.
 *
 * @public
 */
export async function waitForAnimation(animation) {
    await animation.finished;
}
/**
 * Wait for multiple animations to finish.
 *
 * @param animations - Animations to wait for.
 * @returns Promise that resolves when all animations finish.
 *
 * @public
 */
export async function waitForAnimations(animations) {
    await Promise.all(animations.map((anim) => anim.finished));
}
// #endregion
// #region Transform Utilities
/**
 * Get current animated transform value.
 *
 * @param element - Element to read from.
 * @returns Current position from active animations or committed style.
 *
 * @public
 */
export function getCurrentAnimatedPosition(element) {
    const animations = element.getAnimations();
    const transformAnimation = animations.find((anim) => {
        const effect = anim.effect;
        if (!effect)
            return false;
        const keyframes = effect.getKeyframes();
        return keyframes.some((kf) => 'transform' in kf);
    });
    if (transformAnimation) {
        const effect = transformAnimation.effect;
        const computedTiming = effect.getComputedTiming();
        const progress = computedTiming.progress ?? 0;
        const keyframes = effect.getKeyframes();
        if (keyframes.length >= 2) {
            const fromTransform = String(keyframes[0].transform ?? '');
            const toTransform = String(keyframes[keyframes.length - 1].transform ?? '');
            const fromMatch = (/translate3d\((.+?)px, (.+?)px/).exec(fromTransform);
            const toMatch = (/translate3d\((.+?)px, (.+?)px/).exec(toTransform);
            if (fromMatch && toMatch) {
                const fromX = parseFloat(fromMatch[1]);
                const fromY = parseFloat(fromMatch[2]);
                const toX = parseFloat(toMatch[1]);
                const toY = parseFloat(toMatch[2]);
                return {
                    x: fromX + ((toX - fromX) * progress),
                    y: fromY + ((toY - fromY) * progress)
                };
            }
        }
    }
    // Fallback: parse from computed style
    const style = window.getComputedStyle(element);
    const transform = style.transform;
    if (transform && transform !== 'none') {
        const match = (/matrix\((.+)\)/).exec(transform);
        if (match) {
            const values = match[1].split(', ');
            return {
                x: parseFloat(values[4]) || 0,
                y: parseFloat(values[5]) || 0
            };
        }
    }
    return {
        x: 0,
        y: 0
    };
}
// #endregion
//# sourceMappingURL=AnimationUtils.js.map