import React from "react";
import { useHandler } from "../../../../hooks/useHandler";
import { connect } from "../../../redux";
import { getPlugins } from "../../../../plugins";
import { getActiveElementWithChildren } from "../../../selectors";

var DeleteAction = function DeleteAction(props) {
  var element = props.element,
      children = props.children,
      state = props.state;
  var onClick = useHandler(props, function (_ref) {
    var element = _ref.element,
        deleteElement = _ref.deleteElement,
        deactivateElement = _ref.deactivateElement;
    return function () {
      deactivateElement();
      deleteElement({
        element: element
      });
    };
  });
  var plugin = getPlugins("pb-editor-page-element").find(function (pl) {
    return pl.elementType === element.type;
  });

  if (!plugin) {
    return null;
  }

  if (typeof plugin.canDelete === "function") {
    if (!plugin.canDelete({
      element: element,
      state: state
    })) {
      return null;
    }
  }

  return /*#__PURE__*/React.cloneElement(children, {
    onClick: onClick
  });
};

var mapDispatchToProps = function mapDispatchToProps(dispatch) {
  return {
    deactivateElement: function deactivateElement() {
      dispatch({
        type: 'ui/deactivateElement'
      });
    },
    deleteElement: function deleteElement(payload) {
      dispatch({
        type: 'appBuilder/deleteElement',
        payload: payload
      });
    }
  };
};

export default connect(function (state, props) {
  var param = {};

  if (!props.element) {
    param.element = getActiveElementWithChildren(state);
  }

  param.state = state;
  return param;
}, mapDispatchToProps)(DeleteAction);
//# sourceMappingURL=DeleteAction.js.map