@postnord/web-components/esm/pn-table.entry.js

PostNord Web Components

/*!
 * Built with Stencil
 * By PostNord.
 */
import { r as registerInstance, g as getElement, h, a as Host } from './index-C247oTEA.js';

const pnTableCss = "pn-table{display:block;margin-bottom:1em}pn-table .pn-table-container table{width:100%}pn-table .pn-table-container table .column-wrapper{display:flex;gap:0.5em;width:100%;align-items:center}pn-table .pn-table-container table,pn-table .pn-table-container table th,pn-table .pn-table-container table td{padding:0;margin:0;border:0;outline:0;border-collapse:collapse;max-width:100%}pn-table .pn-table-container table th,pn-table .pn-table-container table td{text-align:left;line-height:2;vertical-align:middle;padding:1em 1.15em}pn-table .pn-table-container table th:first-child,pn-table .pn-table-container table td:first-child{border-radius:0.5em 0 0 0.5em}pn-table .pn-table-container table th:last-child,pn-table .pn-table-container table td:last-child{border-radius:0 0.5em 0.5em 0}pn-table .pn-table-container table th pn-icon,pn-table .pn-table-container table td pn-icon{vertical-align:middle}pn-table .pn-table-container table thead tr th,pn-table .pn-table-container table thead tr td{color:#005d92;font-weight:500}pn-table .pn-table-container table tbody tr th,pn-table .pn-table-container table tbody tr td{color:#2d2013;font-weight:400}pn-table.bordered .pn-table-container table{border-collapse:separate;border-spacing:0}pn-table.bordered .pn-table-container table thead tr:last-child th,pn-table.bordered .pn-table-container table thead tr:last-child td{border-bottom-width:0.0625em}pn-table.bordered .pn-table-container table thead tr:first-child th,pn-table.bordered .pn-table-container table thead tr:first-child td{border-top:0.0625em solid #005d92}pn-table.bordered .pn-table-container table thead tr th,pn-table.bordered .pn-table-container table thead tr td{border-bottom:0.0625em solid #005d92}pn-table.bordered .pn-table-container table thead tr th:first-child,pn-table.bordered .pn-table-container table thead tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0.5em 0 0}pn-table.bordered .pn-table-container table thead tr th:last-child,pn-table.bordered .pn-table-container table thead tr td:last-child{border-radius:0 0.5em 0 0;border-right:0.0625em solid #005d92}pn-table.bordered .pn-table-container table tbody tr th,pn-table.bordered .pn-table-container table tbody tr td{border-bottom:0.0625em solid #d3cecb}pn-table.bordered .pn-table-container table tbody tr th:first-child,pn-table.bordered .pn-table-container table tbody tr td:first-child{border-left:0.0625em solid #005d92;border-radius:0}pn-table.bordered .pn-table-container table tbody tr th:last-child,pn-table.bordered .pn-table-container table tbody tr td:last-child{border-right:0.0625em solid #005d92;border-radius:0}pn-table.bordered .pn-table-container table tbody tr:last-of-type th,pn-table.bordered .pn-table-container table tbody tr:last-of-type td{border-bottom:0.0625em solid #005d92}pn-table.bordered .pn-table-container table tbody tr:last-of-type th:last-child,pn-table.bordered .pn-table-container table tbody tr:last-of-type td:last-child{border-radius:0 0 0.5em 0}pn-table.bordered .pn-table-container table tbody tr:last-of-type th:first-child,pn-table.bordered .pn-table-container table tbody tr:last-of-type td:first-child{border-radius:0 0 0 0.5em}pn-table.bordered.striped .pn-table-container table tbody tr th,pn-table.bordered.striped .pn-table-container table tbody tr td{border-bottom-width:0}pn-table.bordered.striped .pn-table-container table tbody tr:last-child th,pn-table.bordered.striped .pn-table-container table tbody tr:last-child td{border-bottom-width:0.0625em}pn-table.striped .pn-table-container table tbody tr:nth-child(odd) th,pn-table.striped .pn-table-container table tbody tr:nth-child(odd) td{background-color:#effbff}pn-table.color-gray .pn-table-container table tbody tr:nth-child(odd) th,pn-table.color-gray .pn-table-container table tbody tr:nth-child(odd) td{background-color:#f9f8f8}";

const PnTable = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
    }
    get hostElement() { return getElement(this); }
    /** Use the gray variant instead of blue. */
    gray = false;
    /** Add border to table. */
    bordered = false;
    /** Make the table striped. */
    striped = false;
    getClassNames() {
        const classes = [this.striped && 'striped', this.bordered && 'bordered', this.gray ? 'color-gray' : 'color-blue'];
        return classes.filter(Boolean).join(' ');
    }
    render() {
        return (h(Host, { key: 'c46bc77bf7e40631d6229457a7d764cf356f1b3d', class: this.getClassNames() }, h("div", { key: 'e547b118837d48715f62cad80d0bfd31f10954d6', class: "pn-table-container" }, h("slot", { key: '6c750540cac0e6fbdb9b9857f7eb309c27566d53' }))));
    }
};
PnTable.style = pnTableCss;

export { PnTable as pn_table };
//# sourceMappingURL=pn-table.entry.js.map