choerodon-ui/lib/ripple/MouseDown.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _util = require("choerodon-ui/shared/util");

var _react = require("react");

function wrapEvent(element, eventName, callback) {
  return function (e) {
    var originalEvent = element.props[eventName];

    if (originalEvent) {
      originalEvent(e);
    }

    callback(e);
  };
}

var MouseDown = function MouseDown(props) {
  var _useState = (0, _react.useState)(),
      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
      size = _useState2[0],
      setSize = _useState2[1];

  var show = (0, _react.useCallback)(function (e) {
    var currentTarget = e.currentTarget;
    var pos = currentTarget.getBoundingClientRect();
    var ownerDocument = currentTarget.ownerDocument;
    var defaultView = ownerDocument && ownerDocument.defaultView;
    setSize({
      x: (0, _util.transformZoomData)(e.clientX) - pos.left,
      y: (0, _util.transformZoomData)(e.clientY) - pos.top,
      width: currentTarget.clientWidth,
      height: currentTarget.clientHeight,
      position: defaultView ? defaultView.getComputedStyle(currentTarget).position : null
    });
  }, []);
  var hide = (0, _react.useCallback)(function () {
    setSize(undefined);
  }, []);
  var children = props.children,
      rippleChild = props.rippleChild;
  var element = children(rippleChild, size);
  var newProps = {
    onMouseDown: wrapEvent(element, 'onMouseDown', show)
  };

  if (size) {
    (0, _extends2["default"])(newProps, {
      onMouseUp: wrapEvent(element, 'onMouseUp', hide),
      onMouseLeave: wrapEvent(element, 'onMouseLeave', hide),
      onDragEnd: wrapEvent(element, 'onDragEnd', hide)
    });
  }

  return /*#__PURE__*/(0, _react.cloneElement)(element, newProps);
};

MouseDown.displayName = 'MouseDown';

var _default = /*#__PURE__*/(0, _react.memo)(MouseDown);

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