"use strict";

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

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

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

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

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

var _mobxReactLite = require("mobx-react-lite");

var _reactBeautifulDnd = require("react-beautiful-dnd");

var _sortBy = _interopRequireDefault(require("lodash/sortBy"));

var _TabsContext = _interopRequireDefault(require("../../TabsContext"));

var _Item = _interopRequireDefault(require("./Item"));

var Group = function Group(props) {
  var header = props.header,
      records = props.records,
      value = props.value,
      nodeSuffix = props.nodeSuffix,
      defaultKey = props.defaultKey;

  var _useContext = (0, _react.useContext)(_TabsContext["default"]),
      prefixCls = _useContext.prefixCls,
      tabDraggable = _useContext.tabDraggable;

  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, header && /*#__PURE__*/_react["default"].createElement("div", {
    className: "".concat(prefixCls, "-customization-group-header")
  }, header), /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Droppable, {
    isDropDisabled: !tabDraggable,
    droppableId: value,
    key: "group"
  }, function (droppableProvided) {
    return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
      ref: droppableProvided.innerRef,
      className: "".concat(prefixCls, "-customization-group")
    }, droppableProvided && droppableProvided.droppableProps), (0, _sortBy["default"])(records, [function (r) {
      return r.get('sort');
    }]).map(function (record, index, list) {
      return /*#__PURE__*/_react["default"].createElement(_reactBeautifulDnd.Draggable, {
        key: record.key,
        draggableId: String(record.key),
        index: index
      }, function (provided, snapshot) {
        return /*#__PURE__*/_react["default"].createElement(_Item["default"], {
          key: record.key,
          record: record,
          suffix: nodeSuffix,
          index: index,
          records: list,
          provided: provided,
          snapshot: snapshot,
          defaultKey: defaultKey
        });
      });
    }), droppableProvided && droppableProvided.placeholder);
  }));
};

Group.displayName = 'Group';

var _default = (0, _mobxReactLite.observer)(Group);

exports["default"] = _default;
//# sourceMappingURL=Group.js.map
