react-life-design/lib/DataTable/DataTable.js

Life Design UI components

"use strict";
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
    return cooked;
};
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 (b.hasOwnProperty(p)) d[p] = b[p]; };
        return extendStatics(d, b);
    };
    return function (d, b) {
        extendStatics(d, b);
        function __() { this.constructor = d; }
        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
    };
})();
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var styled_components_1 = require("styled-components");
var index_1 = require("../index");
var elementsHelper_1 = require("../utils/elementsHelper");
var styles_1 = require("../utils/styles");
var DataTableWrapper = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  max-height: 367px;\n  overflow-y: scroll;\n  margin-bottom: 25px;\n"], ["\n  max-height: 367px;\n  overflow-y: scroll;\n  margin-bottom: 25px;\n"])));
var DataHeader = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  font-size: ", "px;\n  padding-bottom: ", "px;\n  padding-left: ", "px;\n  border-bottom: 1px solid ", ";\n  min-width: 25%;\n  display: flex;\n  ", "\n"], ["\n  font-size: ", "px;\n  padding-bottom: ", "px;\n  padding-left: ", "px;\n  border-bottom: 1px solid ", ";\n  min-width: 25%;\n  display: flex;\n  ", "\n"])), index_1.Sizes.s2, index_1.Sizes.s1, index_1.Sizes.s1, index_1.Colors.line, styles_1.styledByMediaQuery("padding-left: " + index_1.Sizes.s4 + "px;"));
var TableLine = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: ", "px ", "px;\n\n  border-bottom: 1px solid ", ";\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  transition: all 0.3s;\n  position: relative;\n\n  ", "\n\n  &:hover {\n    background-color: ", ";\n  }\n"], ["\n  padding: ", "px ", "px;\n\n  border-bottom: 1px solid ", ";\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  transition: all 0.3s;\n  position: relative;\n\n  ", "\n\n  &:hover {\n    background-color: ", ";\n  }\n"])), index_1.Sizes.s3 + 1, index_1.Sizes.s1, index_1.Colors.line, styles_1.styledByMediaQuery("padding: " + (index_1.Sizes.s3 + 1) + "px " + index_1.Sizes.s4 + "px;"), index_1.Colors.heaven);
var DataTable = (function (_super) {
    __extends(DataTable, _super);
    function DataTable() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    DataTable.prototype.render = function () {
        var children = this.props.children;
        var isHeader = elementsHelper_1.getChildrenOfClass(DataHeader, children);
        var isContent = elementsHelper_1.getChildrenOfClass(TableLine, children);
        return (React.createElement(React.Fragment, null,
            isHeader,
            React.createElement(DataTableWrapper, null, isContent)));
    };
    DataTable.Header = DataHeader;
    DataTable.Line = TableLine;
    return DataTable;
}(React.PureComponent));
exports.default = DataTable;
var templateObject_1, templateObject_2, templateObject_3;
//# sourceMappingURL=DataTable.js.map