import { Host, h } from "@stencil/core";
import { closest } from "../../../utils/closest";
export class PdsTableHead {
    constructor() {
        /**
         * Adds top and bottom borders to the table head.
         * @defaultValue false
         */
        this.border = false;
        /**
         * Adds a subtle background color to the table head.
         * @defaultValue false
         */
        this.background = false;
        this.generateUniqueId = () => {
            const randomString = Math.random().toString(36).substring(2, 8);
            const timestamp = new Date().toISOString().replace(/[:.]/g, '-');
            const uniqueId = `${randomString}-${timestamp}`;
            return uniqueId;
        };
        this.handleInput = (ev) => {
            this.isSelected = !ev.target.checked;
            this.handleSelect(this.isSelected);
        };
        this.handleSelect = (isSelected) => {
            this.indeterminate = false;
            if (closest('pds-table-head', this.hostElement)) {
                this.pdsTableSelectAll.emit({ isSelected });
            }
        };
    }
    componentWillLoad() {
        if (this.isSelected) {
            this.handleSelect(this.isSelected);
        }
    }
    componentWillRender() {
        this.tableRef = this.hostElement.closest('pds-table');
        if (this.tableRef && this.tableRef.fixedColumn) {
            const tableCell = this.hostElement.querySelector('pds-table-head-cell:first-child');
            tableCell === null || tableCell === void 0 ? void 0 : tableCell.classList.add("is-fixed");
        }
    }
    render() {
        return (h(Host, { key: 'd5d5906bdb23794b911ecd5904a4cc58aa5380d6', role: "row", part: "head" }, this.tableRef && this.tableRef.selectable && (h("pds-table-head-cell", { key: '85df57fb4371e4fba855e16ce62c8329b49e08cf', part: this.tableRef.selectable ? 'checkbox-cell' : '' }, !this.tableRef.disableSelectAll && (h("pds-checkbox", { key: '92bd5565463e29d249d1ac71d9dc0d000f3eea79', componentId: this.generateUniqueId(), indeterminate: this.indeterminate, onInput: this.handleInput, label: "Select All Rows", hideLabel: true, checked: this.isSelected, part: "select-all-checkbox" })))), h("slot", { key: '494dc0395da229a264c38540479f36967601cc26' })));
    }
    static get is() { return "pds-table-head"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "$": ["pds-table-head.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pds-table-head.css"]
        };
    }
    static get properties() {
        return {
            "indeterminate": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [],
                    "text": "Determines if the select all checkbox is in an indeterminate state."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "indeterminate"
            },
            "isSelected": {
                "type": "boolean",
                "mutable": true,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Determines if the table row is currently selected."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "is-selected"
            },
            "border": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Adds top and bottom borders to the table head."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "border",
                "defaultValue": "false"
            },
            "background": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "defaultValue",
                            "text": "false"
                        }],
                    "text": "Adds a subtle background color to the table head."
                },
                "getter": false,
                "setter": false,
                "reflect": true,
                "attribute": "background",
                "defaultValue": "false"
            }
        };
    }
    static get events() {
        return [{
                "method": "pdsTableSelectAll",
                "name": "pdsTableSelectAll",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event that is emitted when the select all checkbox is clicked, carrying the selected value."
                },
                "complexType": {
                    "original": "{ isSelected: boolean }",
                    "resolved": "{ isSelected: boolean; }",
                    "references": {}
                }
            }];
    }
    static get elementRef() { return "hostElement"; }
}
//# sourceMappingURL=pds-table-head.js.map
