ultra-design/lib/color-picker/move-container.js

'use strict';

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

var _pt = require('prop-types');
var React = require('react');
var colorTransform = require('./color-transform.js');
var jsxRuntime = require('@emotion/react/jsx-runtime');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var _pt__default = /*#__PURE__*/_interopDefaultLegacy(_pt);

var MoveContainer = function MoveContainer(_ref) {
  var className = _ref.className,
      style = _ref.style,
      onChange = _ref.onChange,
      children = _ref.children;
  var divRef = React.useRef(null);

  var move = function move(e) {
    if (divRef.current) {
      var div = divRef.current;

      var _div$getBoundingClien = div.getBoundingClientRect(),
          width = _div$getBoundingClien.width,
          height = _div$getBoundingClien.height,
          left = _div$getBoundingClien.left,
          top = _div$getBoundingClien.top;

      var x = colorTransform.clamp(e.clientX - left, width, 0);
      var y = colorTransform.clamp(e.clientY - top, height, 0);
      onChange({
        x: x,
        y: y
      });
    }
  };

  var onMouseDown = function onMouseDown(e) {
    if (e.button !== 0) return;
    move(e);

    var onMouseMove = function onMouseMove(e) {
      move(e);
    };

    var onMouseUp = function onMouseUp(e) {
      document.removeEventListener('mousemove', onMouseMove, false);
      document.removeEventListener('mouseup', onMouseUp, false);
      move(e);
    };

    document.addEventListener('mousemove', onMouseMove, false);
    document.addEventListener('mouseup', onMouseUp, false);
  };

  return jsxRuntime.jsx("div", {
    ref: divRef,
    className: className,
    style: style,
    onMouseDown: onMouseDown,
    children: children
  });
};

MoveContainer.propTypes = {
  className: _pt__default["default"].string,
  onChange: _pt__default["default"].func.isRequired
};
var MoveContainer$1 = MoveContainer;

exports["default"] = MoveContainer$1;