import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { d as defineCustomElement$3 } from './pds-checkbox2.js';
import { d as defineCustomElement$2 } from './pds-table-cell2.js';

const pdsTableRowCss = ":host{--background-fixed:var(--pine-color-base-white);--background-interactive:var(--pine-color-neutral-grey-200);border-color:inherit;display:table-row;vertical-align:inherit}:host::part(checkbox-cell){background-color:var(--background-fixed);left:0;position:-webkit-sticky;position:sticky;z-index:1}:host(:hover),:host(:hover)::part(checkbox-cell),:host(:hover) ::slotted(pds-table-cell),:host(.is-selected),:host(.is-selected)::part(checkbox-cell),:host(.is-selected) ::slotted(pds-table-cell){background:var(--background-interactive)}";
const PdsTableRowStyle0 = pdsTableRowCss;

const PdsTableRow$1 = /*@__PURE__*/ proxyCustomElement(class PdsTableRow extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        this.pdsTableRowSelected = createEvent(this, "pdsTableRowSelected", 7);
        this.handleCheckboxClick = () => {
            this.isSelected = !this.isSelected; // Toggle the selected state
            const selectedIndex = Array.from(this.hostElement.parentNode.children).indexOf(this.hostElement);
            this.pdsTableRowSelected.emit({ rowIndex: selectedIndex, isSelected: this.isSelected });
        };
        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.isSelected = false;
    }
    classNames() {
        const classNames = [];
        if (this.isSelected) {
            classNames.push("is-selected");
        }
        return classNames.join('  ');
    }
    componentWillRender() {
        this.tableRef = this.hostElement.closest('pds-table');
        if (this.tableRef && this.tableRef.fixedColumn) {
            const tableCell = this.hostElement.querySelector('pds-table-cell');
            tableCell === null || tableCell === void 0 ? void 0 : tableCell.classList.add("is-fixed");
        }
    }
    render() {
        return (h(Host, { key: 'b809dac3a76a195446be9cec359887f701213c83', class: this.classNames(), role: "row" }, this.tableRef && this.tableRef.selectable && (h("pds-table-cell", { part: this.tableRef.fixedColumn ? 'checkbox-cell' : '', class: this.tableRef.selectable ? 'has-checkbox' : '' }, h("pds-checkbox", { componentId: this.generateUniqueId(), onClick: this.handleCheckboxClick, label: "Select Row", labelHidden: true, checked: this.isSelected }))), h("slot", { key: '30e8125faa0238ff4c9d2e2ce4dc927173ab35ef' })));
    }
    get hostElement() { return this; }
    static get style() { return PdsTableRowStyle0; }
}, [1, "pds-table-row", {
        "isSelected": [32]
    }]);
function defineCustomElement$1() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pds-table-row", "pds-checkbox", "pds-table-cell"];
    components.forEach(tagName => { switch (tagName) {
        case "pds-table-row":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PdsTableRow$1);
            }
            break;
        case "pds-checkbox":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "pds-table-cell":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
    } });
}

const PdsTableRow = PdsTableRow$1;
const defineCustomElement = defineCustomElement$1;

export { PdsTableRow, defineCustomElement };

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