@ucloud-fe/react-components 1.3.9 → 1.3.13

package/lib/components/Table/TableRow.js

@@ -9,104 +9,90 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
 var _newArrowCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/newArrowCheck"));
 
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
-
 var _Popover = _interopRequireDefault(require("../../components/Popover"));
 
+var _DragWrap = require("./DragWrap");
+
+var _this2 = void 0;
+
 var _excluded = ["record", "contextMenu"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var TableRow = /*#__PURE__*/function (_PureComponent) {
-  (0, _inherits2.default)(TableRow, _PureComponent);
-
-  var _super = _createSuper(TableRow);
+var TableRowWithContextMenu = /*#__PURE__*/_react.default.memo(function TableRowWithContextMenu(_ref) {
+  var _this = this;
+
+  var record = _ref.record,
+      contextMenu = _ref.contextMenu,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+
+  var _useState = (0, _react.useState)(false),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      contextMenuVisible = _useState2[0],
+      setContextMenuVisible = _useState2[1];
+
+  var hideContextMenu = (0, _react.useCallback)(function () {
+    (0, _newArrowCheck2.default)(this, _this);
+    setContextMenuVisible(false);
+  }.bind(this), []);
+
+  if (contextMenu) {
+    return /*#__PURE__*/_react.default.createElement(_Popover.default, {
+      popup: /*#__PURE__*/_react.default.createElement("div", null, contextMenu(record, hideContextMenu)),
+      trigger: ['contextMenu'],
+      hideAction: ['click'],
+      visible: contextMenuVisible,
+      onVisibleChange: setContextMenuVisible,
+      animation: null,
+      alignPoint: true
+    }, /*#__PURE__*/_react.default.createElement("tr", rest));
+  }
 
-  function TableRow() {
-    var _this2 = this;
+  return /*#__PURE__*/_react.default.createElement("tr", rest);
+});
 
-    var _this;
+var TableRowWithDrag = /*#__PURE__*/_react.default.memo(function TableRowWithDrag(props) {
+  var _useContext = (0, _react.useContext)(_DragWrap.DragContext),
+      dragProps = _useContext.dragProps,
+      dropProps = _useContext.dropProps;
 
-    (0, _classCallCheck2.default)(this, TableRow);
+  return /*#__PURE__*/_react.default.createElement(TableRowWithContextMenu, (0, _extends2.default)({}, props, dragProps, dropProps, {
+    draggable: false
+  }));
+});
 
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
+var TableRow = function TableRow(_ref2) {
+  (0, _newArrowCheck2.default)(this, _this2);
+  var restProps = (0, _extends2.default)({}, _ref2);
 
-    _this = _super.call.apply(_super, [this].concat(args));
-    _this.state = {
-      contextMenuVisible: false
-    };
+  var _useContext2 = (0, _react.useContext)(_DragWrap.DragContext),
+      draggable = _useContext2.draggable;
 
-    _this.hideContextMenu = function () {
-      (0, _newArrowCheck2.default)(this, _this2);
+  if (draggable) return /*#__PURE__*/_react.default.createElement(TableRowWithDrag, restProps);
+  return /*#__PURE__*/_react.default.createElement(TableRowWithContextMenu, restProps);
+}.bind(void 0);
 
-      _this.setState({
-        contextMenuVisible: false
-      });
-    }.bind(this);
+TableRow.propTypes = {
+  record: _propTypes.default.any.isRequired,
+  contextMenu: _propTypes.default.func,
+  draggable: _propTypes.default.bool,
+  'data-row-key': _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number])
+};
 
-    return _this;
-  }
+var _default = /*#__PURE__*/_react.default.memo(TableRow);
 
-  (0, _createClass2.default)(TableRow, [{
-    key: "render",
-    value: function render() {
-      var _this3 = this;
-
-      var _this$props = this.props,
-          record = _this$props.record,
-          contextMenu = _this$props.contextMenu,
-          rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
-      var contextMenuVisible = this.state.contextMenuVisible;
-
-      if (contextMenu) {
-        return /*#__PURE__*/_react.default.createElement(_Popover.default, {
-          popup: /*#__PURE__*/_react.default.createElement("div", null, contextMenu(record, this.hideContextMenu)),
-          trigger: ['contextMenu'],
-          hideAction: ['click'],
-          visible: contextMenuVisible,
-          onVisibleChange: function (visible) {
-            (0, _newArrowCheck2.default)(this, _this3);
-            return this.setState({
-              contextMenuVisible: visible
-            });
-          }.bind(this),
-          animation: null,
-          alignPoint: true
-        }, /*#__PURE__*/_react.default.createElement("tr", rest));
-      }
-
-      return /*#__PURE__*/_react.default.createElement("tr", rest);
-    }
-  }]);
-  return TableRow;
-}(_react.PureComponent);
-
-exports.default = TableRow;
-TableRow.propTypes = {
-  record: _propTypes.default.object,
-  contextMenu: _propTypes.default.func
-};
+exports.default = _default;