"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames3 = _interopRequireDefault(require("classnames"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _formatMessage = _interopRequireDefault(require("@instructure/quiz-common/lib/format-message"));

var _theme = _interopRequireDefault(require("./theme"));

var _dec, _class, _class2, _temp;

var styles = {
  componentId: 'cSfbM',
  template: function template(theme) {
    return "\n\n.cSfbM_ffKt{background-color:".concat(theme.DnDZoneBackgroundColor || 'inherit', ";border:").concat(theme.DnDZoneBorderWidth || 'inherit', " dashed ").concat(theme.DnDZoneBorderColor || 'inherit', ";display:flex;padding:").concat(theme.DnDZonePadding || 'inherit', "}\n\n.cSfbM_ffKt,.cSfbM_dDZW{justify-content:center;width:100%}\n\n.cSfbM_dDZW{background-color:").concat(theme.sidebarDnDZoneBackgroundColor || 'inherit', ";border:").concat(theme.sidebarDnDZoneBorderWidth || 'inherit', " dashed ").concat(theme.sidebarDnDZoneBorderColor || 'inherit', ";color:").concat(theme.sidebarDnDZoneColor || 'inherit', ";margin:").concat(theme.sidebarDnDZoneMargin || 'inherit', ";padding:").concat(theme.sidebarDnDZonePadding || 'inherit', ";text-align:center}\n\n[dir=ltr] .cSfbM_dDZW,[dir=rtl] .cSfbM_dDZW{text-align:center}\n\n.cSfbM_dDZW.cSfbM_baAw{margin-left:10%;width:90%}\n\n.cSfbM_gasz{display:flex;flex:1 0 100%;justify-content:center;width:100%}\n\n.cSfbM_bBLs{display:none;width:100%}");
  },
  'DnDZone': 'cSfbM_ffKt',
  'sidebarDnDZone': 'cSfbM_dDZW',
  'inSidebarStimulus': 'cSfbM_baAw',
  'wrapper': 'cSfbM_gasz',
  'hide': 'cSfbM_bBLs'
};
var DragAndDropZone = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(DragAndDropZone, _Component);

  function DragAndDropZone() {
    (0, _classCallCheck2.default)(this, DragAndDropZone);
    return (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(DragAndDropZone).apply(this, arguments));
  }

  (0, _createClass2.default)(DragAndDropZone, [{
    key: "shouldRender",
    value: function shouldRender() {
      var _this$props = this.props,
          inSidebar = _this$props.inSidebar,
          sidebarOpen = _this$props.sidebarOpen,
          inStimulus = _this$props.inStimulus,
          location = _this$props.location,
          draggingOver = _this$props.draggingOver,
          draggingAboveHalf = _this$props.draggingAboveHalf,
          dropIntoEmptyStimulus = _this$props.dropIntoEmptyStimulus;

      if (inSidebar && !sidebarOpen) {
        return false;
      }

      if (inStimulus) {
        if (location === 'above') {
          return draggingOver && draggingAboveHalf && !dropIntoEmptyStimulus;
        } else if (location === 'below') {
          return draggingOver && !draggingAboveHalf && !dropIntoEmptyStimulus;
        } else if (location === 'in') {
          return draggingOver && dropIntoEmptyStimulus;
        }
      } else if (location === 'above') {
        return draggingOver && draggingAboveHalf;
      } else if (location === 'below') {
        return draggingOver && !draggingAboveHalf;
      }

      return false;
    }
  }, {
    key: "render",
    value: function render() {
      var _classnames;

      var _this$props2 = this.props,
          inSidebar = _this$props2.inSidebar,
          inStimulus = _this$props2.inStimulus;
      var style = (0, _classnames3.default)((_classnames = {}, (0, _defineProperty2.default)(_classnames, styles.DnDZone, !inSidebar), (0, _defineProperty2.default)(_classnames, styles.sidebarDnDZone, inSidebar), (0, _defineProperty2.default)(_classnames, styles.inSidebarStimulus, inSidebar && inStimulus), _classnames));
      var wrapper = (0, _classnames3.default)(styles.wrapper, (0, _defineProperty2.default)({}, styles.hide, !this.shouldRender()));
      return _react.default.createElement("div", {
        className: wrapper
      }, _react.default.createElement("div", {
        className: style
      }, "Slepptu spurningu h\xE9r"));
    }
  }]);
  DragAndDropZone.displayName = "DragAndDropZone";
  return DragAndDropZone;
}(_react.Component), _class2.propTypes = {
  draggingAboveHalf: _propTypes.default.bool.isRequired,
  draggingOver: _propTypes.default.bool.isRequired,
  dropIntoEmptyStimulus: _propTypes.default.bool,
  inSidebar: _propTypes.default.bool,
  inStimulus: _propTypes.default.bool,
  location: _propTypes.default.oneOf(['above', 'below', 'in']).isRequired,
  sidebarOpen: _propTypes.default.bool
}, _class2.defaultProps = {
  draggingAboveHalf: false,
  draggingOver: false,
  dropIntoEmptyStimulus: false,
  inSidebar: false,
  inStimulus: false,
  sidebarOpen: true
}, _temp)) || _class);
exports.default = DragAndDropZone;