import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
import { u as useViewHandler } from './index-bbdfb97a.js';
import { useState, useRef } from 'react';
import classnames from 'classnames';
import { Vector2 } from '@crystaldesign/web-planner-logic';
import Draggable from 'react-draggable';
import { jsx } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import '@crystaldesign/diva-core';
import 'mobx-react-lite';
import '@babel/runtime/helpers/asyncToGenerator';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/regenerator';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/toConsumableArray';
import '@crystaldesign/diva-utils';
import 'mobx';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var mousePosOnScreenLastFrame = new Vector2(0, 0);
var Rotation3DGrid = function Rotation3DGrid(_ref) {
  var item = _ref.item,
    plannerUIProps = _ref.plannerUIProps;
  var viewHandler = useViewHandler();
  var _useState = useState(false),
    _useState2 = _slicedToArray(_useState, 2),
    isDragging = _useState2[0],
    setIsDragging = _useState2[1];
  var draggable = useRef(null); // https://github.com/react-grid-layout/react-draggable/blob/v4.4.2/lib/DraggableCore.js#L159-L171
  var mouseDownDetected = false;
  var onStartDragging = function onStartDragging(e) {
    mouseDownDetected = true;
    if (e.type == 'mousedown') {
      mousePosOnScreenLastFrame = new Vector2(e.clientX, e.clientY);
    } else if (e.type == 'touchstart') {
      mousePosOnScreenLastFrame = new Vector2(e.touches[0].clientX, e.touches[0].clientY);
    }
  };
  var onDragging = function onDragging(e) {
    if (mouseDownDetected && !isDragging) {
      var _item$onDragStartFunc;
      setIsDragging(true);
      (_item$onDragStartFunc = item.onDragStartFunction) === null || _item$onDragStartFunc === void 0 || _item$onDragStartFunc.call(item, item.setId, Number(item.elementId));
    } else if (isDragging) {
      var _viewHandler$productS, _viewHandler$productS2;
      var boundingLeft = (_viewHandler$productS = viewHandler.productState.planner3DGridElement) !== null && _viewHandler$productS !== void 0 && _viewHandler$productS.getBoundingClientRect().left ? viewHandler.productState.planner3DGridElement.getBoundingClientRect().left : 0;
      var boundingTop = (_viewHandler$productS2 = viewHandler.productState.planner3DGridElement) !== null && _viewHandler$productS2 !== void 0 && _viewHandler$productS2.getBoundingClientRect().top ? viewHandler.productState.planner3DGridElement.getBoundingClientRect().top : 0;
      if (e.type == 'mousemove') {
        var _item$onDragMoveFunct;
        (_item$onDragMoveFunct = item.onDragMoveFunction) === null || _item$onDragMoveFunct === void 0 || _item$onDragMoveFunct.call(item, item.setId, Number(item.elementId), new Vector2(e.clientX - boundingLeft, e.clientY - boundingTop));
        mousePosOnScreenLastFrame.x = e.clientX;
        mousePosOnScreenLastFrame.y = e.clientY;
      } else if (e.type == 'touchmove') {
        var _item$onDragMoveFunct2;
        (_item$onDragMoveFunct2 = item.onDragMoveFunction) === null || _item$onDragMoveFunct2 === void 0 || _item$onDragMoveFunct2.call(item, item.setId, Number(item.elementId), new Vector2(e.touches[0].clientX - boundingLeft, e.touches[0].clientY - boundingTop));
        mousePosOnScreenLastFrame.x = e.touches[0].clientX;
        mousePosOnScreenLastFrame.y = e.touches[0].clientY;
      }
    }
    mouseDownDetected = false;
  };
  var onDragEnd = function onDragEnd(e) {
    if (isDragging) {
      var _item$onDragEndFuncti;
      setIsDragging(false);
      (_item$onDragEndFuncti = item.onDragEndFunction) === null || _item$onDragEndFuncti === void 0 || _item$onDragEndFuncti.call(item, item.setId, Number(item.elementId));
    }
    mouseDownDetected = false;
  };
  return /*#__PURE__*/jsx(Draggable, {
    nodeRef: draggable,
    handle: ".handle3DRotation",
    onStart: function onStart(e) {
      onStartDragging(e);
    },
    onDrag: function onDrag(e) {
      onDragging(e);
    },
    onStop: function onStop(e) {
      onDragEnd();
    },
    children: /*#__PURE__*/jsx("div", {
      ref: draggable,
      style: {
        visibility: isDragging ? 'hidden' : 'visible',
        left: item.position.x + 'px',
        top: item.position.y + 'px'
      },
      className: classnames('handle3DRotation', plannerUIProps.classes.buttonGeneral, plannerUIProps.classes.rotation.rot3DGrid)
    })
  });
};

export { Rotation3DGrid as default };
