[hooks] useScrollTopByDistance 추가

Detail Notes :

com.twin.app.shoptime/src/hooks/useScrollTopByDistance.js

@@ -0,0 +1,36 @@
+import { useCallback, useEffect, useRef } from "react";
+
+import { Job } from "@enact/core/util";
+
+export default function useScrollTopByDistance() {
+  const jobRef = useRef(new Job((func) => func(), 0));
+
+  useEffect(() => {
+    return () => jobRef.current.stop();
+  }, []);
+
+  const scrollTopByDistance = useCallback(
+    (markerSelector, targetSelector, scrollTop, gap = 0) => {
+      try {
+        const marker = document.querySelector(markerSelector);
+        const target = document.querySelector(targetSelector);
+
+        if (!marker || !target) {
+          throw new Error("marker or target not found");
+        }
+
+        const markerRect = marker.getBoundingClientRect();
+        const targetRect = target.getBoundingClientRect();
+
+        const distance = targetRect.top - markerRect.top - gap;
+
+        jobRef.current.start(() => scrollTop({ y: distance }));
+      } catch (error) {
+        console.error(error.message);
+      }
+    },
+    []
+  );
+
+  return { scrollTopByDistance };
+}