function handleIntersect()

in packages/appear/src/web/visibility.ts [66:102]


function handleIntersect(entries: IntersectionObserverEntry[]) {
  entries.forEach((entry) => {
    const {
      target,
      boundingClientRect,
      intersectionRatio,
    } = entry;
    // No `top` value in polyfill.
    const currentY = boundingClientRect.y || boundingClientRect.top;
    const beforeY = parseInt(target.getAttribute('data-before-current-y'), 10) || currentY;

    // is in view
    if (
      intersectionRatio > 0.01 &&
      !isTrue(target.getAttribute('data-appeared')) &&
      !appearOnce(target as HTMLElement, VisibilityChangeEvent.appear)
    ) {
      target.setAttribute('data-appeared', 'true');
      target.setAttribute('data-has-appeared', 'true');
      target.dispatchEvent(createEvent(VisibilityChangeEvent.appear, {
        direction: currentY > beforeY ? VisibilityChangeDirection.up : VisibilityChangeDirection.down,
      }));
    } else if (
      intersectionRatio === 0 &&
      isTrue(target.getAttribute('data-appeared')) &&
      !appearOnce(target as HTMLElement, VisibilityChangeEvent.disappear)
    ) {
      target.setAttribute('data-appeared', 'false');
      target.setAttribute('data-has-disappeared', 'true');
      target.dispatchEvent(createEvent(VisibilityChangeEvent.disappear, {
        direction: currentY > beforeY ? VisibilityChangeDirection.up : VisibilityChangeDirection.down,
      }));
    }

    target.setAttribute('data-before-current-y', String(currentY));
  });
}