tdesign-react/es/image-viewer/hooks/usePosition.js

TDesign Component for React

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

import { _ as _slicedToArray } from '../../_chunks/dep-118954e6.js';
import { useState, useRef, useCallback, useEffect } from 'react';
import { isFunction } from 'lodash-es';
import '../../_chunks/dep-61f5e3d1.js';

var usePosition = function usePosition(_ref, $dom) {
  var initPosition = _ref.initPosition,
    _ref$move = _ref.move,
    move = _ref$move === void 0 ? true : _ref$move,
    onEnd = _ref.onMouseUp,
    onUpdate = _ref.onMouseMove,
    onStart = _ref.onMouseDown;
  var _useState = useState(initPosition),
    _useState2 = _slicedToArray(_useState, 2),
    position = _useState2[0],
    setPosition = _useState2[1];
  var cacheMoveDataRef = useRef(null);
  var onMouseUp = useCallback(function () {
    if (!cacheMoveDataRef.current) return;
    cacheMoveDataRef.current = null;
    if (!move) return;
    isFunction(onEnd) && onEnd();
  }, [move, onEnd]);
  var onMouseMove = useCallback(function (event) {
    if (!event.buttons) cacheMoveDataRef.current = null;
    if (!cacheMoveDataRef.current || cacheMoveDataRef.current.updating || !move) return;
    cacheMoveDataRef.current.updating = true;
    var _cacheMoveDataRef$cur = cacheMoveDataRef.current,
      oldX = _cacheMoveDataRef$cur.screenX,
      oldY = _cacheMoveDataRef$cur.screenY;
    var screenX = event.screenX,
      screenY = event.screenY;
    requestAnimationFrame(function () {
      if (!cacheMoveDataRef.current) return;
      setPosition(function (_ref2) {
        var _ref3 = _slicedToArray(_ref2, 2),
          X = _ref3[0],
          Y = _ref3[1];
        return [X + screenX - oldX, Y + screenY - oldY];
      });
      cacheMoveDataRef.current.screenX = screenX;
      cacheMoveDataRef.current.screenY = screenY;
      cacheMoveDataRef.current.updating = false;
      isFunction(onUpdate) && onUpdate();
    });
  }, [move, onUpdate]);
  var onMouseDown = useCallback(function (event) {
    var screenX = event.screenX,
      screenY = event.screenY;
    cacheMoveDataRef.current = {
      screenX: screenX,
      screenY: screenY
    };
    if (!move) return;
    isFunction(onStart) && onStart();
  }, [move, onStart]);
  useEffect(function () {
    var dom = $dom || document;
    dom.addEventListener("mousemove", onMouseMove);
    document.addEventListener("mouseup", onMouseUp);
    return function () {
      dom.removeEventListener("mousemove", onMouseMove);
      document.removeEventListener("mouseup", onMouseUp);
    };
  }, [$dom, move, onMouseMove, onMouseUp]);
  return [position, onMouseDown];
};

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