cosmo-ui
Version:
Common React components
55 lines • 2.37 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = require("react");
var cx = require("classnames");
var column_1 = require("./column");
var icon_1 = require("./icon");
var row_1 = require("./row");
var divider_1 = require("./divider");
var styles = require('../../src/styles/components/form-box.scss');
var borders = require('../../src/styles/common/borders.scss');
var xs = {
flexDirection: 'column',
justifyContent: 'center',
};
var md = {
flexDirection: 'row',
justifyContent: 'flex-start',
};
var FormBox = (function (_super) {
tslib_1.__extends(FormBox, _super);
function FormBox() {
return _super !== null && _super.apply(this, arguments) || this;
}
FormBox.prototype.render = function () {
var IconComponent = this.props.IconComponent;
return (React.createElement(column_1.Column, { className: this.classNames() },
React.createElement(row_1.Row, { column: "xs", row: "md", align: "center", className: styles.inner },
IconComponent
? IconComponent
: React.createElement(icon_1.Icon, { icon: "motorbike", className: styles.icon, fill: "primary", size: 34 }),
React.createElement(column_1.Column, null,
React.createElement("h4", { className: styles.title }, this.props.title),
React.createElement("p", { className: styles.label }, this.props.subtitle))),
React.createElement(divider_1.Divider, { dotted: true }),
React.createElement(column_1.Column, { className: styles.inner },
this.props.children,
this.props.errors.length
? React.createElement(row_1.Row, { className: styles.error },
"*",
this.props.errors[0])
: null)));
};
FormBox.prototype.classNames = function () {
var _a = this.props, valid = _a.valid, errors = _a.errors;
return cx(this.props.className, styles.container, (_b = {},
_b[borders.error] = errors.length > 0,
_b[borders.success] = valid && !errors.length,
_b));
var _b;
};
return FormBox;
}(React.Component));
exports.FormBox = FormBox;
//# sourceMappingURL=form-box.js.map