armstrong-react
Version:
Rocketmakers Armstrong library of React components
129 lines (128 loc) • 6.23 kB
JavaScript
"use strict";
var __extends = (this && this.__extends) || function (d, b) {
for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
var __assign = (this && this.__assign) || Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
var React = require("react");
var _ = require("underscore");
var classBuilder_1 = require("./../../utilities/classBuilder");
var uiHelpers_1 = require("./../../utilities/uiHelpers");
var Grid = (function (_super) {
__extends(Grid, _super);
function Grid() {
_super.apply(this, arguments);
}
Grid.prototype.render = function () {
var originalClassName = this.props.className;
var attrs = _.omit(this.props, "className");
var classes = classBuilder_1.classNames(originalClassName, "grid", classBuilder_1.cd("fill-container", this.props.fillContainer), classBuilder_1.cd("grid-debug", this.props.debugMode), classBuilder_1.cd("table-grid", this.props.table));
return (React.createElement("div", __assign({}, attrs, this.props, {className: classes})));
};
return Grid;
}(React.Component));
exports.Grid = Grid;
var Row = (function (_super) {
__extends(Row, _super);
function Row() {
_super.apply(this, arguments);
}
Row.prototype.render = function () {
var attrs = _.omit(this.props, "className", "fixed");
var classes = classBuilder_1.classNames(this.props.className, "row", classBuilder_1.cd("no-flex", !!this.props.fixed), classBuilder_1.cd("wrap-row", !!this.props.maxCols));
var styles = this.props.style;
var colStyles;
if (typeof this.props.fixed === "number") {
styles = _.extend({ height: this.props.fixed + "px" }, styles);
}
if (this.props.maxCols) {
colStyles = { flexBasis: 100 / this.props.maxCols + "%", maxWidth: 100 / this.props.maxCols + "%" };
}
return React.createElement("div", __assign({}, attrs, this.props, {className: classes, style: styles}), React.Children.map(this.props.children, function (c) {
return c ? React.cloneElement(c, { style: colStyles ? _.extend(colStyles, c.props.style) : c.props.style }) : null;
}));
};
return Row;
}(React.Component));
exports.Row = Row;
var Col = (function (_super) {
__extends(Col, _super);
function Col() {
_super.apply(this, arguments);
}
Col.prototype.render = function () {
var centerClasses = uiHelpers_1.LayoutHelpers.GetAlignment(this.props.centerContent);
var classes = classBuilder_1.classNames("col", this.props.className, classBuilder_1.cd("no-flex", this.props.fixed !== undefined), classBuilder_1.cd("col" + this.props.spans, this.props.spans !== undefined), centerClasses);
var attrs = _.omit(this.props, "className", "fixed", "spans");
var styles = this.props.style;
if (typeof this.props.fixed === "number") {
styles = _.extend({ maxWidth: this.props.fixed + "px", width: "100%" }, styles);
}
if (this.props.children) {
var elementOne;
if (_.isArray(this.props.children)) {
elementOne = this.props.children[0];
}
else {
elementOne = this.props.children;
}
if (elementOne && React.isValidElement(elementOne)) {
if (elementOne.props.className && elementOne.props.className.indexOf("flex-override") !== -1) {
styles = _.extend({ position: "relative" }, styles);
}
}
}
return React.createElement("div", __assign({}, attrs, this.props, {className: classes, style: styles}));
};
return Col;
}(React.Component));
exports.Col = Col;
var SingleColumnRow = (function (_super) {
__extends(SingleColumnRow, _super);
function SingleColumnRow() {
_super.apply(this, arguments);
}
SingleColumnRow.prototype.render = function () {
var centerClasses = uiHelpers_1.LayoutHelpers.GetAlignment(this.props.centerContent);
var classes = classBuilder_1.classNames("row", classBuilder_1.cd("no-flex", this.props.fixed !== undefined), this.props.className);
var styles = this.props.style;
if (this.props.children) {
var elementOne;
if (_.isArray(this.props.children)) {
elementOne = this.props.children[0];
}
else {
elementOne = this.props.children;
}
if (elementOne && React.isValidElement(elementOne)) {
if (elementOne.props.className && elementOne.props.className.indexOf("flex-override") !== -1) {
styles = _.extend({ position: "relative" }, styles);
}
}
}
return (React.createElement("div", __assign({}, this.props, {className: classes}), React.createElement("div", {className: classBuilder_1.classNames('col', centerClasses)}, this.props.children)));
};
return SingleColumnRow;
}(React.Component));
exports.SingleColumnRow = SingleColumnRow;
var FixedCentralColumnRow = (function (_super) {
__extends(FixedCentralColumnRow, _super);
function FixedCentralColumnRow() {
_super.apply(this, arguments);
}
FixedCentralColumnRow.prototype.render = function () {
var centerClasses = uiHelpers_1.LayoutHelpers.GetAlignment(this.props.centerContent);
var classes = classBuilder_1.classNames("row", "fixed-central-col-row", classBuilder_1.cd("no-flex", this.props.fixed !== undefined), this.props.className);
return (React.createElement("div", __assign({}, this.props, {className: classes}), React.createElement("div", {className: classBuilder_1.classNames('col', 'fixed-central-col', centerClasses)}, this.props.children)));
};
return FixedCentralColumnRow;
}(React.Component));
exports.FixedCentralColumnRow = FixedCentralColumnRow;