tdesign-react/es/hooks/useDrag.js

TDesign Component for React

/**
 * tdesign v1.13.2
 * (c) 2025 tdesign
 * @license MIT
 */

import { useRef, useEffect } from 'react';

var useDrag = function useDrag(ref, options) {
  var start = options.start,
    end = options.end,
    drag = options.drag;
  var isDraggingRef = useRef(false);
  var getCoordinate = function getCoordinate(event) {
    try {
      var _ref$current;
      var rect = (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.getBoundingClientRect();
      var left = event.clientX - rect.left;
      var top = event.clientY - rect.top;
      return {
        y: Math.min(Math.max(0, top), rect.height),
        x: Math.min(Math.max(0, left), rect.width)
      };
    } catch (error) {
      return {
        y: null,
        x: null
      };
    }
  };
  var handlePointerMove = function handlePointerMove(e) {
    if (isDraggingRef.current) drag(getCoordinate(e), e);
  };
  var _handlePointerUp = function handlePointerUp(e) {
    isDraggingRef.current = false;
    end(getCoordinate(e), e);
    document.removeEventListener("mouseup", _handlePointerUp);
    document.removeEventListener("mousemove", handlePointerMove);
  };
  var handlePointerDown = function handlePointerDown(e) {
    isDraggingRef.current = true;
    start(getCoordinate(e), e);
    document.addEventListener("mouseup", _handlePointerUp);
    document.addEventListener("mousemove", handlePointerMove);
  };
  useEffect(function () {
    var element = ref.current;
    if (element) {
      element.addEventListener("mousedown", handlePointerDown);
    }
    return function () {
      if (element) {
        element.removeEventListener("mousedown", handlePointerDown);
      }
    };
  }, []);
  return {
    isDragging: isDraggingRef.current
  };
};

export { useDrag as default };
//# sourceMappingURL=useDrag.js.map