var _excluded = ["paddingBottom"];

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? Object(arguments[i]) : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

/* eslint-disable */
import React from 'react';
import DesignerBox from './DesignerBox';
import RendererBox from './RendererBox';
/**
 * @class MagicBox
 * MagicBox 是整个设计器和渲染器的核心，MagicBox 在逻辑上可以看成超级 DIV，它在 DIV 的基础上增加了拖拽布局和渲染功能。
 * 重要：因为 react-dnd 目前只能支持函数式组件，所以这里只能写成函数形式。
 *
 * MagicBox 分成2个内部组件分别实现设计器和渲染器功能：DesignerBox 和 RendererBox。
 * 在 designer 模式和 renderer 模式下具有不同的外观和功能。
 * - 在 designer 模式下，具有拖拽布局功能。
 * - 在 renderer 模式下纯展现，其功能退化成一层空的容器 div，不再具有设计器功能。
 *
 * @author zhang.xiaofei38@iwhalecloud.com
 * @see https://react-dnd.github.io/react-dnd/
 */

var MagicBox = function MagicBox(_ref) {
  var id = _ref.id,
      pid = _ref.pid,
      index = _ref.index,
      nodeData = _ref.nodeData,
      children = _ref.children,
      onHover = _ref.onHover,
      onDrop = _ref.onDrop,
      componentMap = _ref.componentMap,
      onComponentClick = _ref.onComponentClick,
      _ref$style = _ref.style,
      style = _ref$style === void 0 ? {} : _ref$style,
      className = _ref.className,
      _ref$acceptTypes = _ref.acceptTypes,
      acceptTypes = _ref$acceptTypes === void 0 ? ['MagicBox', 'MRow'] : _ref$acceptTypes,
      _ref$isValidDest = _ref.isValidDest,
      isValidDest = _ref$isValidDest === void 0 ? false : _ref$isValidDest,
      _ref$canDrag = _ref.canDrag,
      canDrag = _ref$canDrag === void 0 ? true : _ref$canDrag,
      _ref$isLeaf = _ref.isLeaf,
      isLeaf = _ref$isLeaf === void 0 ? false : _ref$isLeaf,
      _ref$isSelected = _ref.isSelected,
      isSelected = _ref$isSelected === void 0 ? false : _ref$isSelected,
      _ref$innerDirection = _ref.innerDirection,
      innerDirection = _ref$innerDirection === void 0 ? 'vertical' : _ref$innerDirection,
      _ref$mode = _ref.mode,
      mode = _ref$mode === void 0 ? 'designer' : _ref$mode,
      terminalType = _ref.terminalType,
      pageModuleName = _ref.pageModuleName;
  var tempProps = {
    id: id,
    pid: pid,
    index: index,
    nodeData: nodeData,
    children: children,
    onHover: onHover,
    onDrop: onDrop,
    componentMap: componentMap,
    onComponentClick: onComponentClick,
    style: style,
    className: className,
    acceptTypes: acceptTypes,
    isValidDest: isValidDest,
    canDrag: canDrag,
    isLeaf: isLeaf,
    isSelected: isSelected,
    innerDirection: innerDirection,
    mode: mode,
    terminalType: terminalType
  };

  if (nodeData && nodeData.style && nodeData.type === 'MPlotArea') {
    var _nodeData$style = nodeData.style,
        paddingBottom = _nodeData$style.paddingBottom,
        otherStyle = _objectWithoutProperties(_nodeData$style, _excluded);

    tempProps.style = _objectSpread({}, tempProps.style, otherStyle);
    tempProps.spacing = paddingBottom || '0';
  } else {
    tempProps.style = _objectSpread({}, tempProps.style, nodeData.style);
  }

  var tag = /*#__PURE__*/React.createElement(React.Fragment, null);

  if (mode === 'designer') {
    tag = /*#__PURE__*/React.createElement(DesignerBox, tempProps);
  } else if (mode === 'renderer') {
    tag = /*#__PURE__*/React.createElement(RendererBox, tempProps);
  }

  return /*#__PURE__*/React.createElement("div", {
    id: pageModuleName
  }, tag);
};

export default MagicBox;