Exit Blur Out

export function exitBlurOut(el) {
  const _reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches
  const _duration = _reducedMotion ? 0.01 : 0.5
  const _delay = _reducedMotion ? 0 : 0

  const easing = 'linear(0.0000,0.0000,0.0001,0.0005,0.0011,0.0021,0.0036,0.0058,0.0086,0.0123,0.0169,0.0224,0.0291,0.0370,0.0463,0.0569,0.0691,0.0828,0.0983,0.1156,0.1349,0.1561,0.1795,0.2051,0.2330,0.2634,0.2963,0.3318,0.3701,0.4111,0.4552,0.5022,0.5524,0.6058,0.6626,0.7228,0.7865,0.8539,0.9250,1.0000)'
  const anim = el.animate(
    [
      { filter: 'blur(0px)', opacity: 1 },
      { filter: 'blur(10px)', opacity: 0 },
    ],
    { duration: _duration * 1000, delay: _delay * 1000, easing, fill: 'forwards' },
  )
  return () => {
    anim.cancel()
  }
}