@ucloud-pccl/react-components
Version:
UCloud pccl react components
317 lines (316 loc) • 16.2 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
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 _newArrowCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/newArrowCheck"));
var _findIndex2 = _interopRequireDefault(require("lodash/findIndex"));
var _each2 = _interopRequireDefault(require("lodash/each"));
var _indexOf2 = _interopRequireDefault(require("lodash/indexOf"));
var _find2 = _interopRequireDefault(require("lodash/find"));
var _filter2 = _interopRequireDefault(require("lodash/filter"));
var _keys2 = _interopRequireDefault(require("lodash/keys"));
var _debounce2 = _interopRequireDefault(require("lodash/debounce"));
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _SimpleStore = _interopRequireDefault(require("../../stores/SimpleStore"));
var _excluded = ["innerRef", "onItemsChange"];
var _this = void 0;
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
var noop = function noop() {
(0, _newArrowCheck2.default)(this, _this);
}.bind(void 0);
var storeDecorator = function storeDecorator(_ref) {
var _this2 = this;
(0, _newArrowCheck2.default)(this, _this);
var _ref$valueName = _ref.valueName,
valueName = _ref$valueName === void 0 ? 'value' : _ref$valueName,
_ref$onChangeName = _ref.onChangeName,
onChangeName = _ref$onChangeName === void 0 ? 'onChange' : _ref$onChangeName,
_ref$childValueName = _ref.childValueName,
childValueName = _ref$childValueName === void 0 ? 'value' : _ref$childValueName,
StoreContext = _ref.StoreContext,
getItemValue = _ref.getItemValue,
_ref$getValue = _ref.getValue,
getValue = _ref$getValue === void 0 ? function (v) {
(0, _newArrowCheck2.default)(this, _this2);
return v;
}.bind(this) : _ref$getValue,
_ref$setValue = _ref.setValue,
setValue = _ref$setValue === void 0 ? function (v) {
(0, _newArrowCheck2.default)(this, _this2);
return v;
}.bind(this) : _ref$setValue,
_ref$callOnChangeBefo = _ref.callOnChangeBeforeMounted,
callOnChangeBeforeMounted = _ref$callOnChangeBefo === void 0 ? false : _ref$callOnChangeBefo;
return function (Parent) {
var _this3 = this,
_StoreWrappedComponent;
(0, _newArrowCheck2.default)(this, _this2);
if (!StoreContext) {
console.error('Must pass in StoreContext');
}
if (!getItemValue) {
getItemValue = function getItemValue(item) {
(0, _newArrowCheck2.default)(this, _this3);
return item.props[childValueName] === undefined ? item.uid : item.props[childValueName];
}.bind(this);
}
return _StoreWrappedComponent = /*#__PURE__*/function (_Component) {
function StoreWrappedComponent(props) {
var _this5 = this;
var _this4;
(0, _classCallCheck2.default)(this, StoreWrappedComponent);
_this4 = _callSuper(this, StoreWrappedComponent, [props]);
_this4.handleValueChange = function (value) {
(0, _newArrowCheck2.default)(this, _this5);
var selectable = _this4.props.selectable;
if (!selectable) {
return;
}
_this4.handleOnChange(value);
}.bind(this);
_this4.handleItemsChange = function (items) {
(0, _newArrowCheck2.default)(this, _this5);
_this4.store.setState({
items: items
});
_this4.onItemsChange(items);
_this4.forceUpdate();
}.bind(this);
_this4.onItemsChange = (0, _debounce2.default)(function (items) {
(0, _newArrowCheck2.default)(this, _this5);
var onItemsChange = _this4.props.onItemsChange;
onItemsChange(items);
}.bind(this));
_this4.handleOnChange = noop;
_this4._handleOnChange = (0, _debounce2.default)(function (value) {
(0, _newArrowCheck2.default)(this, _this5);
var multiple = _this4.props.multiple;
var onChange = _this4.props[onChangeName] || noop;
if (multiple) {
onChange(setValue(value), _this4.getAllSelectedStatus(setValue(value)));
} else {
onChange(setValue(value));
}
}.bind(this));
_this4.getCurrentValue = function (copy) {
(0, _newArrowCheck2.default)(this, _this5);
var value = getValue(_this4.props[valueName]) || [];
return copy ? (0, _toConsumableArray2.default)(value) : value;
}.bind(this);
_this4.getAllSelectedStatus = function (value) {
(0, _newArrowCheck2.default)(this, _this5);
var _this4$store$getState = _this4.store.getState(),
items = _this4$store$getState.items;
var itemLength = (0, _keys2.default)(items).length;
var valueLength = value.length;
return valueLength === 0 ? 'NONE' : valueLength === itemLength ? 'ALL' : 'PART';
}.bind(this);
_this4.getAllSelectedStatusOfMiddle = function (middle) {
var _this6 = this;
(0, _newArrowCheck2.default)(this, _this5);
var value = _this4.getCurrentValue();
var _this4$store$getState2 = _this4.store.getState(),
items = _this4$store$getState2.items;
var middleUid = middle.uid;
var middleItems = (0, _filter2.default)(items, function (item) {
(0, _newArrowCheck2.default)(this, _this6);
return item.parents[middleUid];
}.bind(this));
var middleValue = (0, _filter2.default)(value, function (v) {
var _this7 = this;
(0, _newArrowCheck2.default)(this, _this6);
return (0, _find2.default)(middleItems, function (item) {
(0, _newArrowCheck2.default)(this, _this7);
return getItemValue(item.item) === v;
}.bind(this));
}.bind(this));
var itemLength = middleItems.length;
var valueLength = middleValue.length;
return valueLength === 0 ? 'NONE' : valueLength === itemLength ? 'ALL' : 'PART';
}.bind(this);
_this4.appendItem = function (item) {
var parents = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
var uid = item.uid;
if (!uid) {
return console.error('Must have uid for store item');
}
var _this4$store$getState3 = _this4.store.getState(),
items = _this4$store$getState3.items;
if (uid in items) {
return console.error("Can't have same uid form diffent items: ".concat(uid));
}
_this4.handleItemsChange(_objectSpread(_objectSpread({}, items), {}, (0, _defineProperty2.default)({}, uid, {
item: item,
parents: parents
})));
};
_this4.removeItem = function (item) {
(0, _newArrowCheck2.default)(this, _this5);
var uid = item.uid;
if (!uid) {
return console.error('Must have uid for store item');
}
var _this4$store$getState4 = _this4.store.getState(),
items = _this4$store$getState4.items;
if (!(uid in items)) {
return console.error("There is no this item: ".concat(uid));
}
items = _objectSpread({}, items);
delete items[uid];
_this4.handleItemsChange(items);
}.bind(this);
_this4.toggleItem = function (item, selected) {
(0, _newArrowCheck2.default)(this, _this5);
var uid = item.uid;
if (!uid) {
return console.error('Must have uid for store item');
}
var itemValue = getItemValue(item);
var multiple = _this4.props.multiple;
var currentSelected = _this4.getItemSelected(item);
if (multiple) {
var value = _this4.getCurrentValue(true);
var itemIndex = (0, _indexOf2.default)(value, itemValue);
if (currentSelected && !selected) {
value.splice(itemIndex, 1);
_this4.handleValueChange(value);
} else if (!currentSelected && selected) {
value.push(itemValue);
_this4.handleValueChange(value);
}
} else {
if (currentSelected && !selected) {
_this4.handleValueChange([]);
} else if (!currentSelected && selected) {
_this4.handleValueChange([itemValue]);
}
}
}.bind(this);
_this4.getItemSelected = function (item) {
(0, _newArrowCheck2.default)(this, _this5);
var value = _this4.getCurrentValue();
var itemValue = getItemValue(item);
var multiple = _this4.props.multiple;
if (multiple) {
return (0, _indexOf2.default)(value, itemValue) >= 0;
} else {
return !!value.length && value[0] === itemValue;
}
}.bind(this);
_this4.selectAllOfMiddle = function (middle) {
var _this8 = this;
(0, _newArrowCheck2.default)(this, _this5);
var value = _this4.getCurrentValue(true);
var _this4$store$getState5 = _this4.store.getState(),
items = _this4$store$getState5.items;
var middleUid = middle.uid;
var middleItems = (0, _filter2.default)(items, function (item) {
(0, _newArrowCheck2.default)(this, _this8);
return item.parents[middleUid];
}.bind(this));
(0, _each2.default)(middleItems, function (item) {
(0, _newArrowCheck2.default)(this, _this8);
var itemValue = getItemValue(item.item);
if ((0, _indexOf2.default)(value, itemValue) === -1) {
value.push(itemValue);
}
}.bind(this));
_this4.handleValueChange(value);
}.bind(this);
_this4.unselectAllOfMiddle = function (middle) {
var _this9 = this;
(0, _newArrowCheck2.default)(this, _this5);
var value = _this4.getCurrentValue(true);
var _this4$store$getState6 = _this4.store.getState(),
items = _this4$store$getState6.items;
var middleUid = middle.uid;
var middleItems = (0, _filter2.default)(items, function (item) {
(0, _newArrowCheck2.default)(this, _this9);
return item.parents[middleUid];
}.bind(this));
value = (0, _filter2.default)(value, function (v) {
var _this10 = this;
(0, _newArrowCheck2.default)(this, _this9);
return (0, _findIndex2.default)(middleItems, function (item) {
(0, _newArrowCheck2.default)(this, _this10);
return getItemValue(item.item) === v;
}.bind(this)) === -1;
}.bind(this));
_this4.handleValueChange(value);
}.bind(this);
_this4.store = new _SimpleStore.default({
items: {}
});
if (callOnChangeBeforeMounted) {
_this4.handleOnChange = _this4._handleOnChange;
}
return _this4;
}
(0, _inherits2.default)(StoreWrappedComponent, _Component);
return (0, _createClass2.default)(StoreWrappedComponent, [{
key: "componentDidMount",
value: function componentDidMount() {
this.handleOnChange = this._handleOnChange;
}
}, {
key: "componentWillUnmount",
value: function componentWillUnmount() {
this.handleOnChange = noop;
}
}, {
key: "render",
value: function render() {
/* eslint-disable-next-line no-unused-vars*/
var _this$props = this.props,
innerRef = _this$props.innerRef,
onItemsChange = _this$props.onItemsChange,
rest = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
return /*#__PURE__*/_react.default.createElement(StoreContext.Provider, {
value: {
store: this.store,
multiple: this.props.multiple,
appendItem: this.appendItem,
removeItem: this.removeItem,
toggleItem: this.toggleItem,
getItemSelected: this.getItemSelected,
getAllSelectedStatusOfMiddle: this.getAllSelectedStatusOfMiddle,
selectAllOfMiddle: this.selectAllOfMiddle,
unselectAllOfMiddle: this.unselectAllOfMiddle,
selectable: this.props.selectable
}
}, /*#__PURE__*/_react.default.createElement(Parent, (0, _extends2.default)({
ref: innerRef
}, rest)));
}
}]);
}(_react.Component), _StoreWrappedComponent.displayName = "StoreWrapped".concat(Parent.name), _StoreWrappedComponent.propTypes = {
multiple: _propTypes.default.bool,
selectable: _propTypes.default.bool,
innerRef: _propTypes.default.any,
onItemsChange: _propTypes.default.func
}, _StoreWrappedComponent.defaultProps = {
multiple: Parent.defaultProps && Parent.defaultProps.multiple,
selectable: Parent.defaultProps && Parent.defaultProps.selectable,
onItemsChange: noop
}, _StoreWrappedComponent;
}.bind(this);
}.bind(void 0);
var _default = exports.default = storeDecorator;