@furystack/shades-common-components/esm/utils/promisify-animation.js

Common UI components for FuryStack Shades

/**
 * @param el The element to animate
 * @param keyframes A list of keyframe definitions
 * @param options Animation options
 * @returns A promise that resolves when the animation is complete or rejects if cancelled
 */
export const promisifyAnimation = async (el, keyframes, options) => new Promise((resolve, reject) => {
    if (!el) {
        return reject(new Error('No element provided'));
    }
    if (typeof el.animate !== 'function') {
        return resolve({});
    }
    const prefersReducedMotion = window.matchMedia?.('(prefers-reduced-motion: reduce)')?.matches;
    const resolvedOptions = typeof options === 'number' ? { duration: options } : { ...options };
    if (prefersReducedMotion) {
        resolvedOptions.duration = 0;
    }
    const animation = el.animate(keyframes, resolvedOptions);
    animation.onfinish = resolve;
    animation.oncancel = reject;
});
//# sourceMappingURL=promisify-animation.js.map