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

TDesign Component for React

/**
 * tdesign v1.16.6
 * (c) 2026 tdesign
 * @license MIT
 */

'use strict';

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

var slicedToArray = require('../../_chunks/dep-3281986a.js');
var React = require('react');
require('../../_chunks/dep-54373955.js');
require('../../_chunks/dep-ef5bfcf1.js');

var useScale = function useScale(imageScale, visible) {
  var _imageScale$max = imageScale.max,
    max = _imageScale$max === void 0 ? Infinity : _imageScale$max,
    _imageScale$min = imageScale.min,
    min = _imageScale$min === void 0 ? 0 : _imageScale$min,
    _imageScale$step = imageScale.step,
    step = _imageScale$step === void 0 ? 0.1 : _imageScale$step,
    _imageScale$defaultSc = imageScale.defaultScale,
    defaultScale = _imageScale$defaultSc === void 0 ? 1 : _imageScale$defaultSc;
  var calcDefaultScale = React.useCallback(function () {
    return Math.max(Math.min(defaultScale, max), min);
  }, [defaultScale, max, min]);
  var distance = React.useRef(0);
  var _useState = React.useState(calcDefaultScale()),
    _useState2 = slicedToArray._slicedToArray(_useState, 2),
    scale = _useState2[0],
    setScale = _useState2[1];
  var onZoom = React.useCallback(function () {
    setScale(function (scale2) {
      var newScale = scale2 + step;
      if (newScale < min) return min;
      if (newScale > max) return max;
      return newScale;
    });
  }, [max, min, step]);
  var onZoomOut = React.useCallback(function () {
    setScale(function (scale2) {
      var newScale = scale2 - step;
      if (newScale < min) return min;
      if (newScale > max) return max;
      return newScale;
    });
  }, [max, min, step]);
  var onResetScale = React.useCallback(function () {
    setScale(calcDefaultScale());
  }, [calcDefaultScale]);
  var onWheel = React.useCallback(function (e) {
    e.preventDefault();
    e.deltaY < 0 ? onZoom() : onZoomOut();
  }, [onZoom, onZoomOut]);
  var onTouchStart = React.useCallback(function (e) {
    if (e.touches.length !== 2) return;
    e.preventDefault();
    var _Array$from = Array.from(e.touches),
      _Array$from2 = slicedToArray._slicedToArray(_Array$from, 2),
      touch1 = _Array$from2[0],
      touch2 = _Array$from2[1];
    distance.current = Math.hypot(touch2.pageX - touch1.pageX, touch2.pageY - touch1.pageY);
  }, []);
  var onTouchMove = React.useCallback(function (e) {
    if (e.touches.length !== 2) return;
    e.preventDefault();
    var _Array$from3 = Array.from(e.touches),
      _Array$from4 = slicedToArray._slicedToArray(_Array$from3, 2),
      touch1 = _Array$from4[0],
      touch2 = _Array$from4[1];
    var currentDistance = Math.hypot(touch2.pageX - touch1.pageX, touch2.pageY - touch1.pageY);
    if (currentDistance > distance.current) {
      onZoom();
    } else {
      onZoomOut();
    }
    distance.current = currentDistance;
  }, [onZoom, onZoomOut]);
  var onTouchEnd = React.useCallback(function () {
    distance.current = 0;
  }, []);
  React.useEffect(function () {
    if (!visible) return;
    document.addEventListener("wheel", onWheel, {
      passive: false
    });
    document.addEventListener("touchstart", onTouchStart, {
      passive: false
    });
    document.addEventListener("touchmove", onTouchMove, {
      passive: false
    });
    document.addEventListener("touchend", onTouchEnd);
    return function () {
      document.removeEventListener("wheel", onWheel);
      document.removeEventListener("touchstart", onTouchStart);
      document.removeEventListener("touchmove", onTouchMove);
      document.removeEventListener("touchend", onTouchEnd);
    };
  }, [visible, onWheel, onTouchStart, onTouchMove, onTouchEnd]);
  return {
    scale: scale,
    onZoom: onZoom,
    onZoomOut: onZoomOut,
    onResetScale: onResetScale
  };
};

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