@scania/tegel/dist/esm/tds-block.entry.js

Tegel Design System

import { r as registerInstance, h, g as getElement } from './index-51d04e39.js';

const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);background-color:var(--tds-block-background);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{background-color:var(--tds-block-background-primary)}.tds-mode-variant-secondary{background-color:var(--tds-block-background-secondary)}.tds-block-even{background-color:var(--tds-block-background-even)}.tds-block-odd{background-color:var(--tds-block-background-odd)}";
const TdsBlockStyle0 = blockCss;

const TdsBlock = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.modeVariant = null;
        this.componentTag = 'div';
    }
    getNestingLevel() {
        let level = 0;
        let parent = this.host.parentElement;
        while (parent) {
            if (parent.tagName.toLowerCase() === 'tds-block') {
                level++;
            }
            parent = parent.parentElement;
        }
        return level;
    }
    render() {
        const TagType = this.componentTag;
        const nestingLevel = this.getNestingLevel();
        let evenOddClass = '';
        if (this.modeVariant === null) {
            if (nestingLevel % 2 === 0) {
                evenOddClass = 'tds-block-even';
            }
            else {
                evenOddClass = 'tds-block-odd';
            }
        }
        return (h(TagType, { key: '34385f3ac01d173e6bb568432418304186d261c7', class: `tds-block ${evenOddClass} ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("slot", { key: '569b04916fb165fb460711ec659ed2dc3e9ebd12' })));
    }
    get host() { return getElement(this); }
};
TdsBlock.style = TdsBlockStyle0;

export { TdsBlock as tds_block };