"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 (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 __());
    };
})();
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
var react_1 = __importDefault(require("react"));
var prop_types_1 = __importDefault(require("prop-types"));
var classnames_1 = __importDefault(require("classnames"));
var Col_1 = __importDefault(require("react-bootstrap/lib/Col"));
var ButtonToolbar_1 = __importDefault(require("react-bootstrap/lib/ButtonToolbar"));
var Panel_1 = require("../../Panel");
var Block_1 = require("../../Block");
var Row_1 = require("../../Row");
var VIEW_MODE_DETAILS = 'VIEW_MODE_DETAILS';
var VIEW_MODE_FULL = 'VIEW_MODE_FULL';
var CommonListLayout = /** @class */ (function (_super) {
    __extends(CommonListLayout, _super);
    function CommonListLayout() {
        return _super !== null && _super.apply(this, arguments) || this;
    }
    CommonListLayout.prototype.renderListActionsToolbar = function () {
        if (!this.props.listActions) {
            if (this.props.viewMode === VIEW_MODE_FULL) {
                return null;
            }
            else if (!this.props.withoutToolbarGap) {
                return react_1.default.createElement("div", { className: "rc-list-actions-toolbar-gap" });
            }
            return null;
        }
        var classes = classnames_1.default({
            'bottom-border': this.props.viewMode === VIEW_MODE_FULL
        });
        return (react_1.default.createElement("div", { className: classes },
            react_1.default.createElement(ButtonToolbar_1.default, { className: "no-offset cta-toolbar" }, this.props.listActions)));
    };
    CommonListLayout.prototype.renderHeader = function () {
        var middleSection = null;
        var _a = this.props, filtersColSize = _a.filtersColSize, actionsColSize = _a.actionsColSize, filters = _a.filters, actions = _a.actions, head = _a.head, subhead = _a.subhead;
        if (!filters && !actions && !head && !subhead) {
            return null;
        }
        if (filters || actions) {
            middleSection = (react_1.default.createElement(Block_1.Block, { noOffset: true },
                react_1.default.createElement(Row_1.Row, null,
                    react_1.default.createElement(Col_1.default, { xs: filtersColSize }, filters),
                    react_1.default.createElement(Col_1.default, { xs: actionsColSize },
                        react_1.default.createElement("div", { className: "pull-right" }, actions)))));
        }
        return (react_1.default.createElement("div", null,
            react_1.default.createElement(Block_1.Block, { cancelTopOffset: true, cancelHorizontalOffset: true }, head),
            middleSection,
            subhead));
    };
    CommonListLayout.prototype.renderFooter = function () {
        var _a = this
            .props, viewMode = _a.viewMode, subFooter = _a.subFooter, renderCounterText = _a.renderCounterText, renderPagination = _a.renderPagination, withoutGrid = _a.withoutGrid;
        if (withoutGrid || viewMode !== VIEW_MODE_FULL) {
            return null;
        }
        var paginationBlock = null;
        if (this.props.hasPagination) {
            paginationBlock = (react_1.default.createElement(Col_1.default, { xs: 9, className: "vcenter text-right" }, renderPagination()));
        }
        return (react_1.default.createElement("div", null,
            react_1.default.createElement(Block_1.Block, { noOffset: true },
                react_1.default.createElement(Row_1.Row, null,
                    react_1.default.createElement(Col_1.default, { xs: 3, className: "vcenter" }, renderCounterText()),
                    paginationBlock)),
            subFooter));
    };
    CommonListLayout.prototype.renderDetails = function () {
        return this.props.details;
    };
    CommonListLayout.prototype.renderBody = function () {
        var _a = this.props, viewMode = _a.viewMode, list = _a.list, hasPagination = _a.hasPagination, listShortViewCol = _a.listShortViewCol, detailsShortViewCol = _a.detailsShortViewCol, renderPagination = _a.renderPagination;
        if (viewMode === VIEW_MODE_FULL) {
            return react_1.default.createElement("div", { "data-test-automation-id": "listContainer" }, list);
        }
        var paginationBlock = null;
        if (hasPagination) {
            paginationBlock = (react_1.default.createElement(Block_1.Block, { addLeftOffset: true, addRightOffset: true },
                react_1.default.createElement(Row_1.Row, null,
                    react_1.default.createElement(Col_1.default, { xs: 12 },
                        react_1.default.createElement("div", { className: "pull-right" }, renderPagination(false))))));
        }
        return (react_1.default.createElement(Row_1.Row, { className: "rc-list-wrapper" },
            react_1.default.createElement(Col_1.default, { xs: listShortViewCol, className: "rc-list-left" },
                react_1.default.createElement(Panel_1.Panel, { noPadding: true, noLeftBorder: true },
                    react_1.default.createElement(Block_1.Block, { "data-test-automation-id": "listContainer" }, list),
                    paginationBlock)),
            react_1.default.createElement(Col_1.default, { xs: detailsShortViewCol, "data-test-automation-id": "detailsContainer", className: "rc-list-details-container" }, this.renderDetails())));
    };
    CommonListLayout.prototype.renderPanelBody = function () {
        if (this.props['withoutGrid']) {
            return null;
        }
        return (react_1.default.createElement(Row_1.Row, null,
            react_1.default.createElement(Col_1.default, { xs: 12 },
                this.renderListActionsToolbar(),
                this.renderBody())));
    };
    CommonListLayout.prototype.render = function () {
        var _a = this.props, isTransparent = _a.isTransparent, cancelMinHeight = _a.cancelMinHeight;
        return (react_1.default.createElement(Panel_1.Panel, { testAutomationId: this.props.testAutomationId, className: classnames_1.default(this.props.className, 'rc-list-layout'), header: this.renderHeader(), footer: this.renderFooter(), isTransparent: isTransparent, noBorder: isTransparent, cancelMinHeight: cancelMinHeight, noPadding: true }, this.renderPanelBody()));
    };
    CommonListLayout.propTypes = {
        renderCounterText: prop_types_1.default.func.isRequired,
        renderPagination: prop_types_1.default.func.isRequired,
        className: prop_types_1.default.string,
        testAutomationId: prop_types_1.default.string,
        list: prop_types_1.default.node.isRequired,
        viewMode: prop_types_1.default.oneOf([VIEW_MODE_DETAILS, VIEW_MODE_FULL]),
        details: prop_types_1.default.node,
        head: prop_types_1.default.node,
        subhead: prop_types_1.default.node,
        filters: prop_types_1.default.node,
        filtersColSize: prop_types_1.default.number,
        actions: prop_types_1.default.node,
        actionsColSize: prop_types_1.default.number,
        listActions: prop_types_1.default.node,
        subFooter: prop_types_1.default.node,
        withoutToolbarGap: prop_types_1.default.bool,
        isTransparent: prop_types_1.default.bool,
        hasPagination: prop_types_1.default.bool,
        listShortViewCol: prop_types_1.default.number,
        detailsShortViewCol: prop_types_1.default.number,
        cancelMinHeight: prop_types_1.default.bool,
        withoutGrid: prop_types_1.default.bool
    };
    CommonListLayout.defaultProps = {
        className: null,
        testAutomationId: 'panel',
        viewMode: VIEW_MODE_FULL,
        details: null,
        head: null,
        subhead: null,
        filters: null,
        filtersColSize: 7,
        actions: null,
        actionsColSize: 5,
        listActions: null,
        subFooter: null,
        withoutToolbarGap: false,
        isTransparent: false,
        hasPagination: true,
        listShortViewCol: 4,
        detailsShortViewCol: 8,
        cancelMinHeight: false,
        withoutGrid: false
    };
    CommonListLayout.VIEW_MODE_DETAILS = VIEW_MODE_DETAILS;
    CommonListLayout.VIEW_MODE_FULL = VIEW_MODE_FULL;
    return CommonListLayout;
}(react_1.default.Component));
exports.CommonListLayout = CommonListLayout;
//# sourceMappingURL=CommonListLayout.js.map