import { LightningElement, api } from "lwc";

export default class CheckboxNative extends LightningElement {
    @api value!: string;
    @api label?: string;

    private _checked: boolean = false;
    private _indeterminate: boolean = false;

    @api
    get checked(): boolean {
        return this._checked;
    }
    set checked(value: boolean) {
        this._checked = value;
    }

    @api
    get indeterminate(): boolean {
        return this._indeterminate;
    }
    set indeterminate(value: boolean) {
        (this.template.querySelector("input")! as any).indeterminate = value;
        this._indeterminate = value;
    }

    private onChange(e: InputEvent) {
        this._checked = ((e.currentTarget as HTMLInputElement) || {}).checked;
        this.dispatchEvent(
            new CustomEvent("change", {
                detail: {
                    originalEvent: e,
                    checked: this._checked,
                    value: this.value
                }
            })
        );
    }
}