luna-data-grid
Version:
Grid for displaying datasets
719 lines (718 loc) • 30.7 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || (function () {
var extendStatics = function (d, b) {
extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
return extendStatics(d, b);
};
return function (d, b) {
if (typeof b !== "function" && b !== null)
throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.DataGridNode = void 0;
var _1 = __importDefault(require("licia/$"));
var stripIndent_1 = __importDefault(require("licia/stripIndent"));
var Component_1 = __importDefault(require("../share/Component"));
var each_1 = __importDefault(require("licia/each"));
var map_1 = __importDefault(require("licia/map"));
var escape_1 = __importDefault(require("licia/escape"));
var h_1 = __importDefault(require("licia/h"));
var toStr_1 = __importDefault(require("licia/toStr"));
var isEl_1 = __importDefault(require("licia/isEl"));
var isUndef_1 = __importDefault(require("licia/isUndef"));
var ResizeSensor_1 = __importDefault(require("licia/ResizeSensor"));
var throttle_1 = __importDefault(require("licia/throttle"));
var defaults_1 = __importDefault(require("licia/defaults"));
var naturalSort_1 = __importDefault(require("licia/naturalSort"));
var isNull_1 = __importDefault(require("licia/isNull"));
var isFn_1 = __importDefault(require("licia/isFn"));
var isRegExp_1 = __importDefault(require("licia/isRegExp"));
var isArr_1 = __importDefault(require("licia/isArr"));
var isStr_1 = __importDefault(require("licia/isStr"));
var trim_1 = __importDefault(require("licia/trim"));
var contain_1 = __importDefault(require("licia/contain"));
var toNum_1 = __importDefault(require("licia/toNum"));
var lowerCase_1 = __importDefault(require("licia/lowerCase"));
var clamp_1 = __importDefault(require("licia/clamp"));
var max_1 = __importDefault(require("licia/max"));
var min_1 = __importDefault(require("licia/min"));
var isOdd_1 = __importDefault(require("licia/isOdd"));
var now_1 = __importDefault(require("licia/now"));
var remove_1 = __importDefault(require("licia/remove"));
var pointerEvent_1 = __importDefault(require("licia/pointerEvent"));
var util_1 = require("../share/util");
var isHidden_1 = __importDefault(require("licia/isHidden"));
var $document = (0, _1.default)(document);
var MIN_COL_WIDTH = 24;
var ROW_HEIGHT = 20;
var DataGrid = (function (_super) {
__extends(DataGrid, _super);
function DataGrid(container, options) {
var _this = _super.call(this, container, { compName: 'data-grid' }, options) || this;
_this.resizeIdx = 0;
_this.resizeStartX = 0;
_this.resizeStartLeft = 0;
_this.resizeDeltaX = 0;
_this.nodes = [];
_this.displayNodes = [];
_this.colWidthsInitialized = false;
_this.colMap = {};
_this.selectedNode = null;
_this.isAscending = true;
_this.sorted = false;
_this.colWidths = [];
_this.spaceHeight = 0;
_this.topSpaceHeight = 0;
_this.lastScrollTop = 0;
_this.lastTimestamp = 0;
_this.speedToleranceFactor = 100;
_this.maxSpeedTolerance = 2000;
_this.minSpeedTolerance = 100;
_this.scrollTimer = null;
_this.onResizeColMove = function (e) {
var _a = _this, resizeIdx = _a.resizeIdx, $resizers = _a.$resizers, colWidths = _a.colWidths, $colgroup = _a.$colgroup;
e = e.origEvent;
var deltaX = (0, util_1.eventClient)('x', e) - _this.resizeStartX;
var leftColWidth = colWidths[resizeIdx];
var rightColWidth = colWidths[resizeIdx + 1];
var lowerBound = (0, min_1.default)(-leftColWidth + MIN_COL_WIDTH, 0);
var upperBound = (0, max_1.default)(rightColWidth - MIN_COL_WIDTH, 0);
deltaX = (0, clamp_1.default)(deltaX, lowerBound, upperBound);
$colgroup.each(function () {
var $cols = (0, _1.default)(this).find('col');
$cols.eq(resizeIdx).css('width', leftColWidth + deltaX + 'px');
$cols.eq(resizeIdx + 1).css('width', rightColWidth - deltaX + 'px');
});
_this.resizeDeltaX = deltaX;
var newLeft = _this.resizeStartLeft + deltaX;
$resizers.eq(resizeIdx).css('left', "".concat(newLeft, "px"));
};
_this.onResizeColEnd = function (e) {
_this.onResizeColMove(e);
var _a = _this, c = _a.c, colWidths = _a.colWidths, resizeIdx = _a.resizeIdx, resizeDeltaX = _a.resizeDeltaX;
var columns = _this.options.columns;
var leftCol = columns[resizeIdx];
var rightCol = columns[resizeIdx + 1];
var leftColWidth = colWidths[resizeIdx] + resizeDeltaX;
var rightColWidth = colWidths[resizeIdx + 1] - resizeDeltaX;
var totalWidth = leftColWidth + rightColWidth;
var totalWeight = leftCol.weight + rightCol.weight;
var leftWeight = totalWeight * (leftColWidth / totalWidth);
var rightWeight = totalWeight - leftWeight;
leftCol.weight = leftWeight;
rightCol.weight = rightWeight;
_this.applyColWeights();
(0, _1.default)(document.body).rmClass(c('resizing'));
$document.off((0, pointerEvent_1.default)('move'), _this.onResizeColMove);
$document.off((0, pointerEvent_1.default)('up'), _this.onResizeColEnd);
};
_this.onScroll = function () {
var _a = _this
.dataContainer, scrollHeight = _a.scrollHeight, clientHeight = _a.clientHeight, scrollTop = _a.scrollTop;
if (scrollTop <= 0)
return;
if (clientHeight + scrollTop > scrollHeight)
return;
var lastScrollTop = _this.lastScrollTop;
var lastTimestamp = _this.lastTimestamp;
var timestamp = (0, now_1.default)();
var duration = timestamp - lastTimestamp;
var distance = scrollTop - lastScrollTop;
var speed = Math.abs(distance / duration);
var speedTolerance = speed * _this.speedToleranceFactor;
if (duration > 1000) {
speedTolerance = 1000;
}
if (speedTolerance > _this.maxSpeedTolerance) {
speedTolerance = _this.maxSpeedTolerance;
}
if (speedTolerance < _this.minSpeedTolerance) {
speedTolerance = _this.minSpeedTolerance;
}
_this.lastScrollTop = scrollTop;
_this.lastTimestamp = timestamp;
var topTolerance = 0;
var bottomTolerance = 0;
if (lastScrollTop < scrollTop) {
topTolerance = _this.minSpeedTolerance;
bottomTolerance = speedTolerance;
}
else {
topTolerance = speedTolerance;
bottomTolerance = _this.minSpeedTolerance;
}
if (_this.topSpaceHeight < scrollTop - topTolerance &&
_this.topSpaceHeight + _this.data.offsetHeight >
scrollTop + clientHeight + bottomTolerance) {
return;
}
_this.renderData({
topTolerance: topTolerance * 2,
bottomTolerance: bottomTolerance * 2,
});
if (_this.scrollTimer) {
clearTimeout(_this.scrollTimer);
}
_this.scrollTimer = setTimeout(function () {
_this.renderData();
}, 100);
};
_this.renderData = (0, throttle_1.default)(function (_a) {
var _b = _a === void 0 ? {} : _a, _c = _b.topTolerance, topTolerance = _c === void 0 ? 500 : _c, _d = _b.bottomTolerance, bottomTolerance = _d === void 0 ? 500 : _d;
if (_this.sortId && !_this.sorted) {
_this.sortNodes(_this.sortId, _this.isAscending);
}
var _e = _this, dataContainer = _e.dataContainer, displayNodes = _e.displayNodes, tableBody = _e.tableBody;
var scrollTop = dataContainer.scrollTop, clientHeight = dataContainer.clientHeight;
var top = scrollTop - topTolerance;
var bottom = scrollTop + clientHeight + bottomTolerance;
var topSpaceHeight = 0;
var currentHeight = 0;
var len = displayNodes.length;
var renderNodes = [];
var height = ROW_HEIGHT;
for (var i = 0; i < len; i++) {
var node = displayNodes[i];
if (currentHeight <= bottom) {
if (currentHeight + height > top) {
if (renderNodes.length === 0 && (0, isOdd_1.default)(i)) {
renderNodes.push(displayNodes[i - 1]);
topSpaceHeight -= height;
}
renderNodes.push(node);
}
else if (currentHeight < top) {
topSpaceHeight += height;
}
}
currentHeight += height;
}
_this.updateSpace(currentHeight);
_this.updateTopSpace(topSpaceHeight);
var frag = document.createDocumentFragment();
for (var i = 0, len_1 = renderNodes.length; i < len_1; i++) {
frag.appendChild(renderNodes[i].container);
}
frag.appendChild(_this.fillerRow);
tableBody.textContent = '';
tableBody.appendChild(frag);
}, 16);
_this.$container.attr('tabindex', '0');
_this.resizeSensor = new ResizeSensor_1.default(container);
_this.onResize = (0, throttle_1.default)(function () {
_this.updateHeight();
_this.updateWeights();
_this.renderData();
}, 16);
if (options.height) {
options.maxHeight = options.height;
options.minHeight = options.height;
}
_this.initOptions(options, {
minHeight: 41,
maxHeight: Infinity,
filter: '',
selectable: false,
});
var _a = _this.options, columns = _a.columns, minHeight = _a.minHeight, maxHeight = _a.maxHeight;
(0, each_1.default)(columns, function (column) {
(0, defaults_1.default)(column, {
sortable: false,
});
_this.colMap[column.id] = column;
});
if (maxHeight < minHeight) {
_this.setOption('maxHeight', minHeight);
}
_this.initTpl();
_this.$headerRow = _this.find('.header').find('tr');
_this.$fillerRow = _this.find('.filler-row');
_this.fillerRow = _this.$fillerRow.get(0);
_this.$data = _this.find('.data');
_this.data = _this.$data.get(0);
_this.$tableBody = _this.$data.find('tbody');
_this.tableBody = _this.$tableBody.get(0);
_this.$colgroup = _this.$container.find('colgroup');
_this.$dataContainer = _this.find('.data-container');
_this.dataContainer = _this.$dataContainer.get(0);
_this.$space = _this.find('.data-space');
_this.space = _this.$space.get(0);
_this.renderHeader();
_this.renderResizers();
_this.updateWeights();
_this.updateHeight();
_this.bindEvent();
return _this;
}
DataGrid.prototype.destroy = function () {
_super.prototype.destroy.call(this);
this.resizeSensor.destroy();
this.$container.rmAttr('tabindex');
};
DataGrid.prototype.remove = function (node) {
var _a = this, nodes = _a.nodes, displayNodes = _a.displayNodes;
(0, remove_1.default)(nodes, function (n) { return n === node; });
(0, remove_1.default)(displayNodes, function (n) { return n === node; });
if (node === this.selectedNode) {
this.selectNode(null);
}
this.renderData();
this.updateHeight();
};
DataGrid.prototype.append = function (data, options) {
if (options === void 0) { options = {}; }
(0, defaults_1.default)(options, {
selectable: this.options.selectable,
});
var node = new DataGridNode(this, data, options);
this.nodes.push(node);
var isVisible = this.filterNode(node);
if (isVisible) {
this.displayNodes.push(node);
}
if (this.sortId || isVisible) {
if (this.sortId) {
this.sorted = false;
}
this.renderData();
}
this.updateHeight();
return node;
};
DataGrid.prototype.setData = function (data, uniqueId) {
var _this = this;
var items = (0, map_1.default)(data, function (item) {
if (!(0, isArr_1.default)(item)) {
return [
item,
{
selectable: _this.options.selectable,
},
];
}
(0, defaults_1.default)(item[1], {
selectable: _this.options.selectable,
});
return item;
});
if (!uniqueId) {
this.clearData();
(0, each_1.default)(items, function (item) {
var node = new DataGridNode(_this, item[0], item[1]);
_this.nodes.push(node);
if (_this.filterNode(node)) {
_this.displayNodes.push(node);
}
});
}
else {
var nodesMap_1 = {};
(0, each_1.default)(this.nodes, function (node) {
nodesMap_1[node.data[uniqueId]] = node;
});
var nodes_1 = [];
var displayNodes_1 = [];
(0, each_1.default)(items, function (item) {
var id = item[0][uniqueId];
var node;
if (nodesMap_1[id]) {
node = nodesMap_1[id];
node.data = item[0];
node.render();
}
else {
node = new DataGridNode(_this, item[0], item[1]);
}
nodes_1.push(node);
if (_this.filterNode(node)) {
displayNodes_1.push(node);
}
});
if (this.selectedNode && !(0, contain_1.default)(nodes_1, this.selectedNode)) {
this.selectNode(null);
}
this.nodes = nodes_1;
this.displayNodes = displayNodes_1;
}
if (this.sortId) {
this.sorted = false;
}
this.renderData();
this.updateHeight();
};
DataGrid.prototype.clear = function () {
this.clearData();
this.renderData();
this.updateHeight();
};
DataGrid.prototype.fit = function () {
if ((0, isHidden_1.default)(this.container)) {
return;
}
var parent = this.$container.parent().get(0);
var style = window.getComputedStyle(parent);
var clientHeight = parent.clientHeight;
var paddingTop = (0, util_1.pxToNum)(style.paddingTop);
var paddingBottom = (0, util_1.pxToNum)(style.paddingBottom);
var height = clientHeight - paddingTop - paddingBottom;
this.setOption({
minHeight: height,
maxHeight: height,
});
};
DataGrid.prototype.clearData = function () {
this.nodes = [];
this.displayNodes = [];
this.selectNode(null);
};
DataGrid.prototype.updateHeight = function () {
var _a = this, $fillerRow = _a.$fillerRow, $container = _a.$container;
var _b = this.options, maxHeight = _b.maxHeight, minHeight = _b.minHeight;
var headerHeight = this.$headerRow.offset().height;
var borderTopWidth = (0, util_1.pxToNum)($container.css('border-top-width'));
var borderBottomWidth = (0, util_1.pxToNum)($container.css('border-bottom-width'));
var minusHeight = headerHeight + borderTopWidth + borderBottomWidth;
minHeight -= minusHeight;
if (minHeight < 0) {
minHeight = 0;
}
maxHeight -= minusHeight;
var len = this.displayNodes.length;
var height = 0;
if (len > 0) {
height = ROW_HEIGHT * len;
}
if (height > minHeight) {
$fillerRow.hide();
}
else {
$fillerRow.show();
}
if (height < minHeight) {
height = minHeight;
}
else if (height >= maxHeight) {
height = maxHeight;
}
this.$dataContainer.css({ height: height });
};
DataGrid.prototype.selectNode = function (node) {
if (!(0, isNull_1.default)(node) && !(node === null || node === void 0 ? void 0 : node.selectable)) {
return;
}
if (this.selectedNode === node) {
return;
}
if (this.selectedNode) {
this.selectedNode.deselect();
this.selectedNode = null;
if ((0, isNull_1.default)(node)) {
this.emit('deselect');
}
}
if (!(0, isNull_1.default)(node)) {
this.selectedNode = node;
node.select();
this.emit('select', node);
}
};
DataGrid.prototype.onResizeColStart = function (e) {
var _a = this, c = _a.c, resizeIdx = _a.resizeIdx, $resizers = _a.$resizers;
e.stopPropagation();
e.preventDefault();
e = e.origEvent;
this.resizeStartX = (0, util_1.eventClient)('x', e);
this.resizeStartLeft = (0, util_1.pxToNum)($resizers.eq(resizeIdx).css('left'));
(0, _1.default)(document.body).addClass(c('resizing'));
$document.on((0, pointerEvent_1.default)('move'), this.onResizeColMove);
$document.on((0, pointerEvent_1.default)('up'), this.onResizeColEnd);
};
DataGrid.prototype.bindEvent = function () {
var _this = this;
var _a = this, c = _a.c, $headerRow = _a.$headerRow, $tableBody = _a.$tableBody, $resizers = _a.$resizers, $dataContainer = _a.$dataContainer;
this.resizeSensor.addListener(this.onResize);
$dataContainer.on('scroll', this.onScroll);
var self = this;
$tableBody
.on('click', c('.node'), function (e) {
var _this = this;
self.selectNode(this.dataGridNode);
setTimeout(function () {
if (_this.hasDoubleClick) {
return;
}
self.emit('click', e.origEvent, _this.dataGridNode);
}, 200);
})
.on('dblclick', c('.node'), function (e) {
var _this = this;
e.stopPropagation();
this.hasDoubleClick = true;
self.emit('dblclick', e.origEvent, this.dataGridNode);
setTimeout(function () {
_this.hasDoubleClick = false;
}, 300);
})
.on('contextmenu', c('.node'), function (e) {
e.preventDefault();
e.stopPropagation();
self.selectNode(this.dataGridNode);
self.emit('contextmenu', e.origEvent, this.dataGridNode);
});
$headerRow.on('click', c('.sortable'), function (e) {
e.stopPropagation();
var $this = (0, _1.default)(this);
var id = $this.data('id');
var order = $this.data('order');
var isAscending = order !== 'descending';
$this.data('order', isAscending ? 'descending' : 'ascending');
$headerRow.find(c('.icon-caret-up')).hide();
$headerRow.find(c('.icon-caret-down')).hide();
var $iconUp = $this.find(c('.icon-caret-up'));
var $iconDown = $this.find(c('.icon-caret-down'));
if (isAscending) {
$iconUp.show();
}
else {
$iconDown.show();
}
self.sortNodes(id, isAscending);
self.renderData();
$headerRow.find('th').each(function () {
var $this = (0, _1.default)(this);
if ($this.data('id') !== id) {
$this.rmAttr('data-order');
}
});
});
$resizers.on((0, pointerEvent_1.default)('down'), function (e) {
var $this = (0, _1.default)(this);
self.resizeIdx = (0, toNum_1.default)($this.data('idx'));
self.onResizeColStart(e);
});
this.on('changeOption', function (name) {
switch (name) {
case 'minHeight':
case 'maxHeight':
_this.updateHeight();
break;
case 'filter':
_this.displayNodes = [];
(0, each_1.default)(_this.nodes, function (node) {
if (_this.filterNode(node)) {
_this.displayNodes.push(node);
}
});
if (_this.selectedNode && !_this.filterNode(_this.selectedNode)) {
_this.selectNode(null);
}
_this.renderData();
_this.updateHeight();
break;
}
});
};
DataGrid.prototype.sortNodes = function (id, isAscending) {
var column = this.colMap[id];
var comparator = column.comparator || naturalSort_1.default.comparator;
function sortFn(a, b) {
var aVal = a.data[id];
var bVal = b.data[id];
if ((0, isEl_1.default)(aVal)) {
aVal = aVal.innerText;
}
if ((0, isEl_1.default)(bVal)) {
bVal = bVal.innerText;
}
return isAscending ? comparator(aVal, bVal) : comparator(bVal, aVal);
}
this.nodes.sort(sortFn);
this.displayNodes.sort(sortFn);
this.sorted = true;
this.sortId = id;
this.isAscending = isAscending;
};
DataGrid.prototype.updateWeights = function () {
var _a = this, container = _a.container, $headerRow = _a.$headerRow;
var columns = this.options.columns;
var tableWidth = container.offsetWidth;
if (!this.colWidthsInitialized && tableWidth) {
for (var i = 0, len = columns.length; i < len; i++) {
var column = columns[i];
if (!column.weight) {
var thWidth = $headerRow.find('th').get(i)
.offsetWidth;
column.weight = (100 * thWidth) / tableWidth;
}
}
this.colWidthsInitialized = true;
}
this.applyColWeights();
};
DataGrid.prototype.applyColWeights = function () {
var _a = this, container = _a.container, $colgroup = _a.$colgroup;
var columns = this.options.columns;
var tableWidth = container.offsetWidth;
if (tableWidth <= 0) {
return;
}
var sumOfWeights = 0;
var len = columns.length;
for (var i = 0; i < len; i++) {
sumOfWeights += columns[i].weight;
}
var html = '';
var sum = 0;
var lastOffset = 0;
this.colWidths = [];
for (var i = 0; i < len; i++) {
var column = columns[i];
sum += column.weight;
var offset = ((sum * tableWidth) / sumOfWeights) | 0;
var width = offset - lastOffset;
if (width < MIN_COL_WIDTH) {
width = MIN_COL_WIDTH;
offset = lastOffset + width;
}
lastOffset = offset;
html += "<col style=\"width:".concat(width, "px\"></col>");
this.colWidths[i] = width;
}
$colgroup.html(html);
this.positionResizers();
};
DataGrid.prototype.positionResizers = function () {
var colWidths = this.colWidths;
var resizerLeft = [];
var len = colWidths.length - 1;
for (var i = 0; i < len; i++) {
resizerLeft[i] = (resizerLeft[i - 1] || 0) + colWidths[i];
}
for (var i = 0; i < len; i++) {
this.$resizers.eq(i).css('left', resizerLeft[i] + 'px');
}
};
DataGrid.prototype.updateTopSpace = function (height) {
this.topSpaceHeight = height;
this.data.style.top = height + 'px';
};
DataGrid.prototype.updateSpace = function (height) {
if (this.spaceHeight === height) {
return;
}
this.spaceHeight = height;
this.space.style.height = height + 'px';
};
DataGrid.prototype.filterNode = function (node) {
var filter = this.options.filter;
if (filter) {
if ((0, isFn_1.default)(filter)) {
return filter(node);
}
else if ((0, isRegExp_1.default)(filter)) {
return filter.test(node.text());
}
else if ((0, isStr_1.default)(filter)) {
filter = (0, trim_1.default)(filter);
if (filter) {
return (0, contain_1.default)((0, lowerCase_1.default)(node.text()), (0, lowerCase_1.default)(filter));
}
}
}
return true;
};
DataGrid.prototype.renderHeader = function () {
var c = this.c;
var html = '';
var fillerRowHtml = '';
(0, each_1.default)(this.options.columns, function (column) {
var title = (0, escape_1.default)(column.title);
if (column.sortable) {
html += c("\n <th class=\"sortable\" data-id=\"".concat(column.id, "\">\n ").concat(title, "\n <span class=\"icon-caret-up\"></span>\n <span class=\"icon-caret-down\"></span>\n </th>"));
}
else {
html += "<th>".concat(title, "</th>");
}
fillerRowHtml += '<td></td>';
});
this.$headerRow.html(html);
this.$fillerRow.html(fillerRowHtml);
};
DataGrid.prototype.renderResizers = function () {
var resizers = '';
var len = this.options.columns.length - 1;
for (var i = 0; i < len; i++) {
resizers += this.c("<div class=\"resizer\" data-idx=\"".concat(i, "\"></div>"));
}
this.$container.append(resizers);
this.$resizers = this.find('.resizer');
};
DataGrid.prototype.initTpl = function () {
this.$container.html(this.c((0, stripIndent_1.default)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n <div class=\"header-container\">\n <table class=\"header\">\n <colgroup></colgroup>\n <tbody>\n <tr></tr>\n </tbody>\n </table>\n </div>\n <div class=\"data-container\">\n <div class=\"data-space\">\n <table class=\"data\">\n <colgroup></colgroup>\n <tbody>\n <tr class=\"filler-row\"></tr>\n </tbody>\n </table>\n </div>\n </div>\n "], ["\n <div class=\"header-container\">\n <table class=\"header\">\n <colgroup></colgroup>\n <tbody>\n <tr></tr>\n </tbody>\n </table>\n </div>\n <div class=\"data-container\">\n <div class=\"data-space\">\n <table class=\"data\">\n <colgroup></colgroup>\n <tbody>\n <tr class=\"filler-row\"></tr>\n </tbody>\n </table>\n </div>\n </div>\n "])))));
};
return DataGrid;
}(Component_1.default));
exports.default = DataGrid;
var DataGridNode = (function () {
function DataGridNode(dataGrid, data, options) {
this.container = (0, h_1.default)('tr');
this.selectable = false;
;
this.container.dataGridNode = this;
this.$container = (0, _1.default)(this.container);
this.$container.addClass(dataGrid.c('node'));
this.dataGrid = dataGrid;
this.data = data;
if (options.selectable) {
this.selectable = options.selectable;
this.$container.addClass(dataGrid.c('selectable'));
}
this.render();
}
DataGridNode.prototype.text = function () {
return this.$container.text();
};
DataGridNode.prototype.select = function () {
this.$container.addClass(this.dataGrid.c('selected'));
};
DataGridNode.prototype.deselect = function () {
this.$container.rmClass(this.dataGrid.c('selected'));
};
DataGridNode.prototype.render = function () {
var _a = this, data = _a.data, $container = _a.$container, container = _a.container;
var columns = this.dataGrid.getOption('columns');
$container.html('');
(0, each_1.default)(columns, function (column) {
var td = (0, h_1.default)('td');
var val = data[column.id];
if (!(0, isUndef_1.default)(val)) {
if ((0, isEl_1.default)(val)) {
td.appendChild(val);
}
else {
td.innerText = (0, toStr_1.default)(val);
}
}
container.appendChild(td);
});
};
return DataGridNode;
}());
exports.DataGridNode = DataGridNode;
if (typeof module !== 'undefined') {
(0, util_1.exportCjs)(module, DataGrid);
}
var templateObject_1;