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

TDesign Component for React

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

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var slicedToArray = require('../../_chunks/dep-e17e2d31.js');
var React = require('react');
var isFunction = require('../../_chunks/dep-bed9d73e.js');
require('../../_chunks/dep-b7d577ac.js');
require('../../_chunks/dep-f0379c5f.js');
require('../../_chunks/dep-6d4d8660.js');
require('../../_chunks/dep-780eda7b.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 = React.useState(initPosition),
    _useState2 = slicedToArray._slicedToArray(_useState, 2),
    position = _useState2[0],
    setPosition = _useState2[1];
  var cacheMoveDataRef = React.useRef(null);
  var onMouseUp = React.useCallback(function () {
    if (!cacheMoveDataRef.current) return;
    cacheMoveDataRef.current = null;
    if (!move) return;
    isFunction.isFunction(onEnd) && onEnd();
  }, [move, onEnd]);
  var onMouseMove = React.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._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.isFunction(onUpdate) && onUpdate();
    });
  }, [move, onUpdate]);
  var onMouseDown = React.useCallback(function (event) {
    var screenX = event.screenX,
      screenY = event.screenY;
    cacheMoveDataRef.current = {
      screenX: screenX,
      screenY: screenY
    };
    if (!move) return;
    isFunction.isFunction(onStart) && onStart();
  }, [move, onStart]);
  React.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];
};

exports["default"] = usePosition;
//# sourceMappingURL=usePosition.js.map