@vlsergey/react-bootstrap-pagetable/lib/cjs/controlled/DefaultHeaderFooter.js

Complex solution to work with pageable data, including sorting, filtering, actions, changing displayed columns, etc.

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DefaultFooter = exports.DefaultHeader = void 0;
var tslib_1 = require("tslib");
/** @jsx jsx */
var react_1 = require("@emotion/react");
var react_2 = tslib_1.__importDefault(require("react"));
var ControlledContext_1 = require("./ControlledContext");
var DivHideIfEmpty_1 = tslib_1.__importDefault(require("./DivHideIfEmpty"));
var DefaultHeaderFooter = function (_a) {
    var elements = _a.elements;
    return react_1.jsx(DivHideIfEmpty_1.default, { css: react_1.css("& > div {\n    align-items: center;\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    margin-bottom: 1em;\n    margin-top: 1em;\n  }\n  & > div > div {\n    align-items: center;\n    display: flex;\n  }\n  & > div > div > div {\n    padding-left: .5em;\n    padding-right: .5em;\n  }\n  & > div:empty {\n    display: none;\n  }\n  & > div > div:empty {\n    display: none;\n  }\n  & > div > div > div:empty {\n    display: none;\n  }\n  & > div > div > div:first-of-type {\n    padding-left: 0;\n  }\n  & > div > div > div:last-of-type {\n    padding-right: 0;\n  }\n  ") }, elements.map(function (line, index1) { return react_1.jsx(DivHideIfEmpty_1.default, { key: index1 }, line.map(function (column, columnIndex) { return react_1.jsx(DivHideIfEmpty_1.default, { key: columnIndex }, column.map(function (child, index) {
        return react_1.jsx(DivHideIfEmpty_1.default, { key: index }, react_2.default.createElement(child));
    })); })); }));
};
var DefaultHeader = function () {
    var headerElements = ControlledContext_1.useControlledContext().headerElements;
    return react_1.jsx(DefaultHeaderFooter, { elements: headerElements });
};
exports.DefaultHeader = DefaultHeader;
var DefaultFooter = function () {
    var footerElements = ControlledContext_1.useControlledContext().footerElements;
    return react_1.jsx(DefaultHeaderFooter, { elements: footerElements });
};
exports.DefaultFooter = DefaultFooter;