office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
30 lines (28 loc) • 1.66 kB
JavaScript
define(["require", "exports", "tslib", "react", "../../Utilities"], function (require, exports, tslib_1, React, Utilities_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Grid = (function (_super) {
tslib_1.__extends(Grid, _super);
function Grid(props) {
var _this = _super.call(this, props) || this;
_this._id = Utilities_1.getId();
return _this;
}
Grid.prototype.render = function () {
var _this = this;
var _a = this.props, items = _a.items, columnCount = _a.columnCount, onRenderItem = _a.onRenderItem, positionInSet = _a.positionInSet, setSize = _a.setSize;
// Array to store the cells in the correct row index
var rowsOfItems = Utilities_1.toMatrix(items, columnCount);
// Create the table/grid
return (React.createElement("table", { id: this._id, role: 'grid', "aria-posinset": positionInSet, "aria-setsize": setSize, style: { padding: '2px', outline: 'none' } },
React.createElement("tbody", null, rowsOfItems.map(function (rows, rowIndex) {
return (React.createElement("tr", { role: 'row', key: _this._id + '-' + rowIndex + '-row' }, rows.map(function (cell) {
return (React.createElement("td", { role: 'presentation', key: _this._id + '-' + cell.index + '-cell', style: { padding: '0px' } }, onRenderItem(cell, cell.index)));
})));
}))));
};
return Grid;
}(Utilities_1.BaseComponent));
exports.Grid = Grid;
});
//# sourceMappingURL=Grid.js.map