import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';

const pdsTableCellCss = ":host{--background-fixed:var(--pine-color-base-white);--box-shadow:3px 3px 6px -2px rgba(0, 0, 0, 0.2);--color:var(--pine-color-neutral-charcoal-200);--fixed-column-index:0;--font-size:var(--pine-font-size-body-sm);--line-height:var(--pine-line-height-sm);--padding:calc(var(--pine-spacing-md) / 2);--padding-compact:var(--pine-spacing-xxs);--fixed-cell-position:0;--max-width-truncated:100px;color:var(--color);display:table-cell;font-size:var(--font-size);line-height:var(--line-height);padding:var(--padding);vertical-align:inherit}:host(.is-compact){padding-block:var(--padding-compact)}:host(.is-fixed){background:var(--background-fixed);left:var(--fixed-cell-position);position:-webkit-sticky;position:sticky;z-index:1}:host(.has-scrolled.is-fixed){-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow)}:host(.is-truncated){max-width:var(--max-width-truncated);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.has-checkbox){vertical-align:middle;width:16px}";
const PdsTableCellStyle0 = pdsTableCellCss;

const PdsTableCell = /*@__PURE__*/ proxyCustomElement(class PdsTableCell extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        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: 'a4dc8a8339277b782f4a2ee0a675fe1cfba9882f', class: this.classNames(), role: "gridcell", style: this.tableRef &&
                this.tableRef.fixedColumn &&
                this.tableRef.selectable
                ? { '--fixed-cell-position': '40px' }
                : {} }, h("slot", { key: '1f00d0fe4e83ada31b33d760a34e2dfcb914be23' })));
    }
    get hostElement() { return this; }
    static get style() { return PdsTableCellStyle0; }
}, [1, "pds-table-cell", {
        "truncate": [4],
        "tableScrolling": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pds-table-cell"];
    components.forEach(tagName => { switch (tagName) {
        case "pds-table-cell":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PdsTableCell);
            }
            break;
    } });
}

export { PdsTableCell as P, defineCustomElement as d };

//# sourceMappingURL=pds-table-cell2.js.map