@6thquake/react-material/esm/TransferDnD/DragListItem.js

React components that implement Google's Material Design.

"use strict";

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
Object.defineProperty(exports, "ListItemText", {
  enumerable: true,
  get: function get() {
    return _ListItemText.default;
  }
});
exports.DragListItem = void 0;

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 = _interopRequireDefault(require("react"));

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

var _withStyles = _interopRequireDefault(require("../styles/withStyles"));

var _ListItem = _interopRequireDefault(require("../ListItem"));

var _ListItemText = _interopRequireDefault(require("../ListItemText"));

var _reactDnd = require("react-dnd");

var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));

var _Checkbox = _interopRequireDefault(require("../Checkbox"));

/**
 * @ignore - do not document.
 */
var boxSource = {
  beginDrag: function beginDrag(props, monitor, component) {
    // 拖拽开始把水波层置为不显示
    component.refs.listItem.childNodes[0].childNodes[2].style.display = 'none';
    var direction = props.direction,
        value = props.value;
    return {
      direction: direction,
      value: value
    };
  }
};

var DLI =
/*#__PURE__*/
function (_React$Component) {
  (0, _inherits2.default)(DLI, _React$Component);

  function DLI(props) {
    var _this;

    (0, _classCallCheck2.default)(this, DLI);
    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(DLI).call(this, props));

    _this.handleToggle = function () {};

    _this.state = {};
    return _this;
  }

  (0, _createClass2.default)(DLI, [{
    key: "render",
    value: function render() {
      var _this$props = this.props,
          connectDragSource = _this$props.connectDragSource,
          value = _this$props.value,
          isChecked = _this$props.isChecked,
          toggleChecked = _this$props.toggleChecked,
          direction = _this$props.direction;
      return connectDragSource(_react.default.createElement("div", null, _react.default.createElement("div", {
        ref: "listItem"
      }, _react.default.createElement(_ListItem.default, {
        key: value.id,
        role: undefined,
        dense: true,
        button: true,
        onClick: function onClick() {
          toggleChecked(value, direction);
        }
      }, _react.default.createElement(_Checkbox.default, {
        checked: isChecked,
        tabIndex: -1,
        disableRipple: true
      }), _react.default.createElement(_ListItemText.default, {
        primary: "".concat(value.name)
      })))));
    }
  }]);
  return DLI;
}(_react.default.Component);

var DragListItem = (0, _reactDnd.DragSource)('just-transfer', boxSource, function (connect, monitor) {
  return {
    connectDragSource: connect.dragSource(),
    isDragging: monitor.isDragging()
  };
})(DLI);
exports.DragListItem = DragListItem;