import { Host, h } from "@stencil/core";
export class PdsTableCell {
    constructor() {
        this.handleScroll = () => {
            if (this.tableRef.scrollLeft > 0) {
                this.tableScrolling = true;
            }
            else {
                this.tableScrolling = false;
            }
        };
        this.truncate = undefined;
        this.tableScrolling = false;
    }
    componentWillRender() {
        this.tableRef = this.hostElement.closest('pds-table');
    }
    componentDidLoad() {
        if (this.tableRef && this.tableRef.responsive && this.tableRef.fixedColumn) {
            this.tableRef.addEventListener('scroll', this.handleScroll);
        }
    }
    classNames() {
        const classNames = [];
        if (this.tableRef && this.tableRef.compact) {
            classNames.push('is-compact');
        }
        if (this.truncate) {
            classNames.push('is-truncated');
        }
        if (this.tableRef && this.tableRef.fixedColumn && this.tableScrolling) {
            classNames.push('has-scrolled');
        }
        return classNames.join(' ');
    }
    render() {
        return (h(Host, { key: '28e14af2a71566974799bd9894be69257ad0c819', class: this.classNames(), role: "gridcell", style: this.tableRef &&
                this.tableRef.fixedColumn &&
                this.tableRef.selectable
                ? { '--fixed-cell-position': '40px' }
                : {} }, h("slot", { key: 'c2c98f8cfc27c4f7ee30a488c67c7601cbd882ad' })));
    }
    static get is() { return "pds-table-cell"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["../../../global/styles/base.scss", "pds-table-cell.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["../../../global/styles/base.css", "pds-table-cell.css"]
        };
    }
    static get properties() {
        return {
            "truncate": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Truncates content to a max width of 100px and adds an ellipsis."
                },
                "attribute": "truncate",
                "reflect": false
            }
        };
    }
    static get states() {
        return {
            "tableScrolling": {}
        };
    }
    static get elementRef() { return "hostElement"; }
}
//# sourceMappingURL=pds-table-cell.js.map
