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

PostNord Web Components

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

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