import * as i0 from '@angular/core';
import { forwardRef, Component, Input, NgModule } from '@angular/core';
import * as i1 from '@angular/forms';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';

/**
 * @description Componente de lista de checkboxes hierárquica, com suporte a estados
 * pai/filho e indeterminado. Ao marcar/desmarcar o item pai, todos os filhos são
 * afetados, e o estado do pai é calculado automaticamente com base nos filhos.
 * Implementa {@link ControlValueAccessor} para uso em formulários Angular.
 *
 * @example
 * ```html
 * <s-checkbox-list
 *   formControlName="permissoes"
 *   [data]="estruturaPermissoes" />
 * ```
 *
 * @category Inputs
 */
class CheckboxListComponent {
    /**
     * @description Estrutura de dados que define o item raiz e seus filhos.
     * Cada `CheckboxListData` pode conter o label, estado inicial e uma lista de filhos recursiva.
     * Campo obrigatório.
     */
    data;
    state = {
        checked: false,
        indeterminate: false,
        children: {},
    };
    _onChange = () => { };
    _onTouched = () => { };
    writeValue(value) {
        if (value) {
            this.state = value;
        }
        else {
            this.state = {
                checked: false,
                indeterminate: false,
                disabled: false,
                children: this._initializeChildren(this.data),
            };
        }
    }
    get renderType() {
        return this.data.renderType ?? 'inline';
    }
    registerOnChange(onChange) {
        this._onChange = onChange;
    }
    registerOnTouched(onTouched) {
        this._onTouched = onTouched;
    }
    _initializeChildren(item) {
        const childrenState = {};
        if (item.children) {
            item.children.forEach((child) => {
                childrenState[child.label] = {
                    checked: false,
                    indeterminate: false,
                    children: this._initializeChildren(child),
                };
            });
        }
        return childrenState;
    }
    getCheckboxState(item, label) {
        if (item) {
            return item[label];
        }
        else {
            return {};
        }
    }
    updateParent() {
        const _getProperty = (obj, field) => {
            if (obj) {
                return obj[field];
            }
            else {
                return null;
            }
        };
        if (this.data.children && this.data.children.length > 0) {
            const allChecked = this.data.children.every((child) => _getProperty(this.state.children, child.label)?.checked);
            const someChecked = this.data.children.some((child) => _getProperty(this.state.children, child.label)?.checked ||
                _getProperty(this.state.children, child.label)?.indeterminate);
            this.state.checked = allChecked;
            this.state.indeterminate = !allChecked && someChecked;
        }
        this._onChange(this.state);
        this._onTouched();
    }
    onCheckboxChange() {
        if (this.state.disabled) {
            return;
        }
        this.state.checked = !this.state.checked;
        this.state.indeterminate = false;
        this._toggleChildrenCheck(this.data, this.state, this.state.checked);
        this._onChange(this.state);
        this._onTouched();
    }
    _toggleChildrenCheck(item, state, checked) {
        if (item.children?.length) {
            item.children.forEach((child) => {
                if (state.children && !state.children[child.label]) {
                    state.children[child.label] = {
                        checked: false,
                        indeterminate: false,
                        children: this._initializeChildren(child),
                    };
                }
                if (state.children) {
                    state.children[child.label].checked = checked;
                    state.children[child.label].indeterminate = false;
                }
                if (child.children && state.children) {
                    this._toggleChildrenCheck(child, state.children[child.label], checked);
                }
            });
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: CheckboxListComponent, isStandalone: true, selector: "s-checkbox-list", inputs: { data: "data" }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: forwardRef(() => CheckboxListComponent),
                multi: true,
            },
        ], ngImport: i0, template: "<div class=\"flex flex-col gap-[10px] mb-[10px]\">\r\n    <label>\r\n        <div\r\n            class=\"flex text-grayscale-90 font-open-sans text-sm gap-3\"\r\n            [class.items-center]=\"renderType === 'inline'\"\r\n            [class.flex-col-reverse]=\"renderType === 'block'\"\r\n            [class.opacity-50]=\"state.disabled\"\r\n            [class.cursor-auto]=\"state.disabled\"\r\n        >\r\n            <input\r\n                type=\"checkbox\"\r\n                class=\"checkbox-input appearance-none border rounded-medium cursor-pointer shrink-0 h-5 w-5 relative\"\r\n                [class.bg-grayscale-0]=\"!state.checked && !state.indeterminate\"\r\n                [class.border-grayscale-30]=\"!state.checked && !state.indeterminate\"\r\n                [class.bg-criticality-blue]=\"state.checked || state.indeterminate\"\r\n                [class.border-criticality-blue]=\"state.checked || state.indeterminate\"\r\n                [class.checkbox-input--checked]=\"state.checked\"\r\n                [class.checkbox-input--indeterminate]=\"state.indeterminate\"\r\n                [class.hover:bg-hippie-blue-50]=\"!state.disabled && !state.checked && !state.indeterminate\"\r\n                [disabled]=\"state.disabled\"\r\n                (change)=\"onCheckboxChange()\"\r\n                [attr.aria-checked]=\"state.indeterminate ? 'mixed' : state.checked\"\r\n                [attr.aria-disabled]=\"state.disabled\"\r\n            />\r\n            {{ data.label }}\r\n        </div>\r\n    </label>\r\n    @if (data.children && data.children.length) {\r\n        <div class=\"ml-5\">\r\n            @for (child of data.children; track child) {\r\n                <s-checkbox-list\r\n                    [data]=\"child\"\r\n                    [ngModel]=\"getCheckboxState(state.children, child.label)\"\r\n                    (ngModelChange)=\"updateParent()\"\r\n                >\r\n                </s-checkbox-list>\r\n            }\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [".checkbox-input--checked:after{border:solid white;border-width:0 2px 2px 0;content:\"\";height:12px;left:6px;position:absolute;top:2px;transform:rotate(45deg);width:6px}.checkbox-input--indeterminate:after{background-color:#fff;content:\"\";height:2px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:10px}\n"], dependencies: [{ kind: "component", type: CheckboxListComponent, selector: "s-checkbox-list", inputs: ["data"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-checkbox-list', providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => CheckboxListComponent),
                            multi: true,
                        },
                    ], standalone: true, imports: [CheckboxListComponent, FormsModule], template: "<div class=\"flex flex-col gap-[10px] mb-[10px]\">\r\n    <label>\r\n        <div\r\n            class=\"flex text-grayscale-90 font-open-sans text-sm gap-3\"\r\n            [class.items-center]=\"renderType === 'inline'\"\r\n            [class.flex-col-reverse]=\"renderType === 'block'\"\r\n            [class.opacity-50]=\"state.disabled\"\r\n            [class.cursor-auto]=\"state.disabled\"\r\n        >\r\n            <input\r\n                type=\"checkbox\"\r\n                class=\"checkbox-input appearance-none border rounded-medium cursor-pointer shrink-0 h-5 w-5 relative\"\r\n                [class.bg-grayscale-0]=\"!state.checked && !state.indeterminate\"\r\n                [class.border-grayscale-30]=\"!state.checked && !state.indeterminate\"\r\n                [class.bg-criticality-blue]=\"state.checked || state.indeterminate\"\r\n                [class.border-criticality-blue]=\"state.checked || state.indeterminate\"\r\n                [class.checkbox-input--checked]=\"state.checked\"\r\n                [class.checkbox-input--indeterminate]=\"state.indeterminate\"\r\n                [class.hover:bg-hippie-blue-50]=\"!state.disabled && !state.checked && !state.indeterminate\"\r\n                [disabled]=\"state.disabled\"\r\n                (change)=\"onCheckboxChange()\"\r\n                [attr.aria-checked]=\"state.indeterminate ? 'mixed' : state.checked\"\r\n                [attr.aria-disabled]=\"state.disabled\"\r\n            />\r\n            {{ data.label }}\r\n        </div>\r\n    </label>\r\n    @if (data.children && data.children.length) {\r\n        <div class=\"ml-5\">\r\n            @for (child of data.children; track child) {\r\n                <s-checkbox-list\r\n                    [data]=\"child\"\r\n                    [ngModel]=\"getCheckboxState(state.children, child.label)\"\r\n                    (ngModelChange)=\"updateParent()\"\r\n                >\r\n                </s-checkbox-list>\r\n            }\r\n        </div>\r\n    }\r\n</div>\r\n", styles: [".checkbox-input--checked:after{border:solid white;border-width:0 2px 2px 0;content:\"\";height:12px;left:6px;position:absolute;top:2px;transform:rotate(45deg);width:6px}.checkbox-input--indeterminate:after{background-color:#fff;content:\"\";height:2px;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:10px}\n"] }]
        }], propDecorators: { data: [{
                type: Input,
                args: [{ required: true }]
            }] } });

class CheckboxListModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListModule, imports: [CheckboxListComponent], exports: [CheckboxListComponent] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListModule, imports: [CheckboxListComponent] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: CheckboxListModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [CheckboxListComponent],
                    exports: [CheckboxListComponent],
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { CheckboxListComponent, CheckboxListModule };
//# sourceMappingURL=seniorsistemas-angular-components-checkbox-list.mjs.map
