[motion] 뷰포트 감지 훅(useInView) 사용 방법

import { motion, useInView } from "motion/react";
import { ReactNode, useRef } from "react";

export const AnimationBlock = () => {
  const inViewRef = useRef(null);
  const isInView = useInView(inViewRef);

  // 다른 모든 애니메이션 타입
  return (
    <div ref={inViewRef}>
      <motion.div
        key={...}
        initial="..."
        animate={isInView ? "visible" : "hidden"}
        variants={...}
        transition={....}
      >
        안뇽✨
        {isInView ? "visible" : "hidden"}
      </motion.div>
    </div>
  );
};