import React, { useEffect, useState } from 'react';
import { observer } from 'mobx-react';
import { observableProject } from '../../..//shell';
import './insertionView.less';
export default observer(function InsertionView() {
  var _useState = useState({}),
    style = _useState[0],
    setStyle = _useState[1];
  useEffect(function () {
    var insertRect = observableProject.designer.getInsertPointRect();
    if (!insertRect) {
      setStyle({});
    } else {
      var width = insertRect.width,
        left = insertRect.left,
        top = insertRect.top;
      setStyle({
        borderTopStyle: 'solid',
        width: width,
        left: left,
        top: top
      });
    }
  }, [observableProject.designer.dragon.dropLocation]);
  return /*#__PURE__*/React.createElement("div", {
    className: "vitis-insertion-view",
    style: style
  });
});