use-draggable-example.5.tsx

function DraggableComponent() {
  const draggableDivRef = useRef<HTMLDivElement>();
  const drag$ = useDraggable(draggableDivRef);

  useEffect(() => {
    if (!drag$.current) {
      return () => {};
    }

    const dragSubscription = drag$.current.subscribe(e => {
      if (!draggableDivRef.current) {
        return;
      }

      draggableDivRef.current.style.transform = `translateY(${e.y}px)`;
    });
    return () => {
      dragSubscription.unsubscribe();
    };
  }, [drag$]);

  return (
    <div
      ref={draggableDivRef}
      touch-action="none"
      style={{ userSelect: "none", padding: "8px", backgroundColor: "#eee" }}
    >
      drag me
    </div>
  );
}