@up-group-ui/react-controls
Version:
Up shared react controls
67 lines • 5.29 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var jsx_runtime_1 = require("react/jsx-runtime");
var react_1 = (0, tslib_1.__importDefault)(require("react"));
var Item_1 = (0, tslib_1.__importDefault)(require("./Item"));
var utils_1 = require("../utils");
var canResizeLeft = function (item, canResize) {
var value = (0, utils_1._get)(item, 'canResize') !== undefined ? (0, utils_1._get)(item, 'canResize') : canResize;
return value === 'left' || value === 'both';
};
var canResizeRight = function (item, canResize) {
var value = (0, utils_1._get)(item, 'canResize') !== undefined ? (0, utils_1._get)(item, 'canResize') : canResize;
return value === 'right' || value === 'both' || value === true;
};
var Items = (function (_super) {
(0, tslib_1.__extends)(Items, _super);
function Items(p, c) {
return _super.call(this, p, c) || this;
}
Items.prototype.render = function () {
var _this = this;
var _a = this.props, canvasTimeStart = _a.canvasTimeStart, canvasTimeEnd = _a.canvasTimeEnd, dimensionItems = _a.dimensionItems;
var _b = this.props.keys, itemIdKey = _b.itemIdKey, itemGroupKey = _b.itemGroupKey;
var groupOrders = this.getGroupOrders();
var visibleItems = this.getVisibleItems(canvasTimeStart, canvasTimeEnd, groupOrders);
var sortedDimensionItems = (0, utils_1.keyBy)(dimensionItems, 'id');
return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'rct-items' }, { children: visibleItems
.filter(function (item) { return sortedDimensionItems[(0, utils_1._get)(item, itemIdKey)]; })
.map(function (item) { return ((0, jsx_runtime_1.jsx)(Item_1.default, { item: item, keys: _this.props.keys, order: groupOrders[(0, utils_1._get)(item, itemGroupKey)], dimensions: sortedDimensionItems[(0, utils_1._get)(item, itemIdKey)].dimensions, selected: _this.props.selectedItem === (0, utils_1._get)(item, itemIdKey), canChangeGroup: (0, utils_1._get)(item, 'canChangeGroup') !== undefined ? (0, utils_1._get)(item, 'canChangeGroup') : _this.props.canChangeGroup, canMove: (0, utils_1._get)(item, 'canMove') !== undefined ? (0, utils_1._get)(item, 'canMove') : _this.props.canMove, canResizeLeft: canResizeLeft(item, _this.props.canResize), canResizeRight: canResizeRight(item, _this.props.canResize), canSelect: (0, utils_1._get)(item, 'canSelect') !== undefined ? (0, utils_1._get)(item, 'canSelect') : _this.props.canSelect, useResizeHandle: _this.props.useResizeHandle, topOffset: _this.props.topOffset, groupHeights: _this.props.groupHeights, groupTops: _this.props.groupTops, canvasTimeStart: _this.props.canvasTimeStart, canvasTimeEnd: _this.props.canvasTimeEnd, canvasWidth: _this.props.canvasWidth, lineHeight: _this.props.lineHeight, dragSnap: _this.props.dragSnap, minResizeWidth: _this.props.minResizeWidth, onResizing: _this.props.itemResizing, onResized: _this.props.itemResized, moveResizeValidator: _this.props.moveResizeValidator, onDrag: _this.props.itemDrag, onDrop: _this.props.itemDrop, onItemDoubleClick: _this.props.onItemDoubleClick, onContextMenu: _this.props.onItemContextMenu, onSelect: _this.props.itemSelect }, (0, utils_1._get)(item, itemIdKey))); }) }), void 0));
};
Items.prototype.shouldComponentUpdate = function (nextProps, nextState) {
return !((0, utils_1.arraysEqual)(nextProps.groups, this.props.groups) &&
(0, utils_1.arraysEqual)(nextProps.items, this.props.items) &&
nextProps.keys === this.props.keys &&
nextProps.canvasTimeStart === this.props.canvasTimeStart &&
nextProps.canvasTimeEnd === this.props.canvasTimeEnd &&
nextProps.canvasWidth === this.props.canvasWidth &&
nextProps.selectedItem === this.props.selectedItem &&
nextProps.lineHeight === this.props.lineHeight &&
nextProps.dragSnap === this.props.dragSnap &&
nextProps.minResizeWidth === this.props.minResizeWidth &&
nextProps.canChangeGroup === this.props.canChangeGroup &&
nextProps.canMove === this.props.canMove &&
nextProps.canResize === this.props.canResize &&
nextProps.canSelect === this.props.canSelect &&
nextProps.dimensionItems === this.props.dimensionItems &&
nextProps.topOffset === this.props.topOffset);
};
Items.prototype.getGroupOrders = function () {
var groupIdKey = this.props.keys.groupIdKey;
var groupOrders = {};
for (var i = 0; i < this.props.groups.length; i++) {
groupOrders[(0, utils_1._get)(this.props.groups[i], groupIdKey)] = i;
}
return groupOrders;
};
Items.prototype.getVisibleItems = function (canvasTimeStart, canvasTimeEnd, groupOrders) {
var _a = this.props.keys, itemTimeStartKey = _a.itemTimeStartKey, itemTimeEndKey = _a.itemTimeEndKey;
return this.props.items.filter(function (item) {
return (0, utils_1._get)(item, itemTimeStartKey) <= canvasTimeEnd && (0, utils_1._get)(item, itemTimeEndKey) >= canvasTimeStart;
});
};
return Items;
}(react_1.default.Component));
exports.default = Items;
//# sourceMappingURL=Items.js.map