import { r as registerInstance, d as createEvent, h, c as getElement } from './core-1db051ba.js';
import './utils-3aef1637.js';
import { T as Tunnel } from './i18n.provider-15e382c4.js';
import { k as keyFromData } from './table.utils-110cc530.js';
import { i as isFocusable } from './a11y-3dcc958f.js';

var Translations;
(function (Translations) {
    Translations["DESELECT"] = "Deselect";
    Translations["SELECT"] = "Select";
})(Translations || (Translations = {}));
const RowSelectControl = class {
    constructor(hostRef) {
        registerInstance(this, hostRef);
        this.clickListener = (e) => { this.onRowSelect(e); };
        /**
         * The key for the row
         */
        this.labelFormatter = this.defaultLabelFormatter;
        /**
         * The mode of selection
         * Possible values are: `"batch"` and `"single`. Defaults to "single"
         */
        this.mode = 'single';
        /**
         * If true, will render a checkbox for batch selection and a radio button for single
         */
        this.showCheck = false;
        this.anjRowSelectClick = createEvent(this, "anjRowSelectClick", 7);
    }
    onSelected() {
        if (!this.rowEl || this.checkOnly()) {
            return;
        }
        if (this.selected) {
            this.rowEl.classList.add('anj-selected');
        }
        else {
            this.rowEl.classList.remove('anj-selected');
        }
    }
    async componentDidLoad() {
        this.rowEl = this.element.parentElement.parentElement;
        this.onSelected();
        if (!this.checkOnly()) {
            this.rowEl.classList.add('anj-selectable');
            this.rowEl.addEventListener('click', this.clickListener);
        }
    }
    componentDidUnload() {
        if (!this.checkOnly()) {
            this.rowEl.removeEventListener('click', this.clickListener);
        }
    }
    onRowSelect(event) {
        if (event && event instanceof MouseEvent && event.composedPath().find((e) => e.tagName !== 'TR' && isFocusable(e))) {
            return;
        }
        const checkbox = event ? event.target : undefined;
        if (!checkbox || checkbox.checked !== this.selected) {
            this.selected = checkbox ? checkbox.checked : !this.selected;
            this.anjRowSelectClick.emit({ key: keyFromData(this.rowKey) });
        }
    }
    defaultLabelFormatter(key, selected) {
        return selected ? `${this.translator(Translations.DESELECT)}: ${key}` : `${this.translator(Translations.SELECT)}: ${key}`;
    }
    checkOnly() {
        return (this.mode === 'batch' && this.showCheck);
    }
    render() {
        if (!this.showCheck)
            return;
        const label = this.labelFormatter(this.rowKey, this.selected);
        const className = 'anj-selection-control';
        return this.mode === 'batch' ?
            h("anj-checkbox", { value: `${this.rowKey}`, name: `${this.rowKey}-selected`, checked: this.selected, solo: true, "aria-label": label, class: className })
            : h("anj-radio", { value: `${this.rowKey}`, class: className, checked: this.selected, "aria-label": label, name: "anj-row-select", solo: true });
    }
    get element() { return getElement(this); }
    static get watchers() { return {
        "selected": ["onSelected"]
    }; }
    static get style() { return "anj-row-select-control[mode=batch] {\n  display: block;\n  line-height: 1;\n  margin: 0 0 -1px;\n}"; }
};
Tunnel.injectProps(RowSelectControl, ['translator']);

export { RowSelectControl as anj_row_select_control };
