import { NgClass } from '@angular/common';
import * as i0 from '@angular/core';
import { Injectable, inject, Injector, computed, signal, model, input, output, forwardRef, Component } from '@angular/core';
import * as i1 from '@angular/forms';
import { NgControl, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import { InteractiveContentDirective } from '@seniorsistemas/angular-components/interactive-content';
import { randomHash } from '@seniorsistemas/angular-components/utils';

class RadioButtonRegistryService {
    componentRefs = [];
    add(control, componentInstance) {
        this.componentRefs.push({
            componentInstance,
            formControl: control,
        });
    }
    remove(componentInstance) {
        this.componentRefs = this.componentRefs.filter((item) => item.componentInstance !== componentInstance);
    }
    select(componentInstance) {
        this.componentRefs.forEach((item) => {
            if (this.isSameGroup(item, componentInstance) && item.componentInstance !== componentInstance) {
                item.componentInstance.writeValue(componentInstance.value());
            }
        });
    }
    isSameGroup({ componentInstance, formControl }, currentComponentInstance) {
        if (!formControl) {
            return false;
        }
        const controlRoot = formControl.control?.root;
        return (controlRoot === componentInstance?.['control']?.control?.root &&
            componentInstance.name() === currentComponentInstance.name());
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonRegistryService, decorators: [{
            type: Injectable,
            args: [{
                    providedIn: 'root',
                }]
        }] });

class RadioButtonComponent {
    static ID = 0;
    radioButtonRegistry = inject(RadioButtonRegistryService);
    injector = inject(Injector);
    control = null;
    disabled = computed(() => {
        return this.buttonDisabled() || this.formItemDisabled();
    });
    onChange = () => { };
    onTouched = () => { };
    checked = null;
    formItemDisabled = signal(false);
    buttonDisabled = model(false);
    label = input.required();
    name = input.required();
    value = model.required();
    inputId = input(`RadioButton_${RadioButtonComponent.ID++}`);
    focusedInput = output();
    inputFocusLost = output();
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    setDisabledState(isDisabled) {
        this.formItemDisabled.set(isDisabled);
    }
    writeValue(value) {
        this.checked = value === this.value();
    }
    ngOnInit() {
        this.control = this.injector.get(NgControl, null);
        if (this.control) {
            this.radioButtonRegistry.add(this.control, this);
        }
    }
    ngOnDestroy() {
        if (this.control) {
            this.radioButtonRegistry.remove(this);
        }
    }
    setValue() {
        if (this.disabled()) {
            return;
        }
        this.checked = true;
        this.onChange(this.value());
        this.radioButtonRegistry.select(this);
        this.onTouched(this.value());
    }
    activedContent(event) {
        event.stopPropagation();
        event.preventDefault();
        this.setValue();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.14", type: RadioButtonComponent, isStandalone: true, selector: "s-radiobutton", inputs: { buttonDisabled: { classPropertyName: "buttonDisabled", publicName: "buttonDisabled", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonDisabled: "buttonDisabledChange", value: "valueChange", focusedInput: "focusedInput", inputFocusLost: "inputFocusLost" }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: forwardRef(() => RadioButtonComponent),
                multi: true,
            },
        ], ngImport: i0, template: "<div\n    class=\"flex items-center gap-3\"\n    (sInteractiveContent)=\"activedContent($event)\"\n    [stopPropagation]=\"true\"\n    [disabled]=\"disabled()\"\n    [tabindex]=\"disabled() ? -1 : 0\"\n>\n    <input\n        type=\"radio\"\n        [value]=\"value()\"\n        [checked]=\"checked\"\n        [name]=\"name()\"\n        [id]=\"inputId()\"\n        (change)=\"setValue()\"\n        [disabled]=\"disabled()\"\n        class=\"h-4 w-4 appearance-none rounded-[50%] transition-all ease-in-out disabled:opacity-50\"\n        [ngClass]=\"{\n            'border-2 border-primary': checked,\n            'border-[1px] border-grayscale-30': !checked,\n            'cursor-pointer': !disabled(),\n            'focus-within:!border-primary hover:border-[1px] hover:border-[#063951]': !disabled() && checked,\n            'hover:border-grayscale-50': !disabled() && !checked,\n        }\"\n        [stopPropagation]=\"true\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        (focus)=\"focusedInput.emit($event)\"\n        (blur)=\"inputFocusLost.emit($event)\"\n    />\n\n    <label\n        class=\"font-open-sans m-0 text-sm text-grayscale-90\"\n        [disabled]=\"disabled()\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        [stopPropagation]=\"true\"\n        [tabindex]=\"disabled() ? -1 : 0\"\n        [ngClass]=\"{\n            'cursor-pointer': !disabled(),\n            'opacity-50': disabled(),\n        }\"\n        [for]=\"inputId()\"\n    >\n        {{ label() }}\n    </label>\n</div>\n", dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled", "stopPropagation"], outputs: ["sInteractiveContent"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-radiobutton', standalone: true, imports: [FormsModule, NgClass, InteractiveContentDirective], providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => RadioButtonComponent),
                            multi: true,
                        },
                    ], template: "<div\n    class=\"flex items-center gap-3\"\n    (sInteractiveContent)=\"activedContent($event)\"\n    [stopPropagation]=\"true\"\n    [disabled]=\"disabled()\"\n    [tabindex]=\"disabled() ? -1 : 0\"\n>\n    <input\n        type=\"radio\"\n        [value]=\"value()\"\n        [checked]=\"checked\"\n        [name]=\"name()\"\n        [id]=\"inputId()\"\n        (change)=\"setValue()\"\n        [disabled]=\"disabled()\"\n        class=\"h-4 w-4 appearance-none rounded-[50%] transition-all ease-in-out disabled:opacity-50\"\n        [ngClass]=\"{\n            'border-2 border-primary': checked,\n            'border-[1px] border-grayscale-30': !checked,\n            'cursor-pointer': !disabled(),\n            'focus-within:!border-primary hover:border-[1px] hover:border-[#063951]': !disabled() && checked,\n            'hover:border-grayscale-50': !disabled() && !checked,\n        }\"\n        [stopPropagation]=\"true\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        (focus)=\"focusedInput.emit($event)\"\n        (blur)=\"inputFocusLost.emit($event)\"\n    />\n\n    <label\n        class=\"font-open-sans m-0 text-sm text-grayscale-90\"\n        [disabled]=\"disabled()\"\n        (sInteractiveContent)=\"activedContent($event)\"\n        [stopPropagation]=\"true\"\n        [tabindex]=\"disabled() ? -1 : 0\"\n        [ngClass]=\"{\n            'cursor-pointer': !disabled(),\n            'opacity-50': disabled(),\n        }\"\n        [for]=\"inputId()\"\n    >\n        {{ label() }}\n    </label>\n</div>\n" }]
        }] });

class RadioButtonGroupComponent {
    onChange = () => { };
    onTouched = () => { };
    modelValue = signal(undefined);
    disabled = model(false);
    items = input.required();
    inputName = input.required();
    viewMode = input('horizontal');
    registerOnChange(fn) {
        this.onChange = fn;
    }
    registerOnTouched(fn) {
        this.onTouched = fn;
    }
    setDisabledState(isDisabled) {
        this.disabled.set(isDisabled);
    }
    writeValue(value) {
        this.modelValue.set(value);
    }
    radioButtonItems = computed(() => {
        const items = this.items();
        return items.map((item) => {
            return {
                ...item,
                hash: randomHash(),
            };
        });
    });
    setValue(value) {
        if (this.disabled()) {
            return;
        }
        this.onChange(value);
        this.onTouched(value);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RadioButtonGroupComponent, isStandalone: true, selector: "s-radiobutton-group", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, inputName: { classPropertyName: "inputName", publicName: "inputName", isSignal: true, isRequired: true, transformFunction: null }, viewMode: { classPropertyName: "viewMode", publicName: "viewMode", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { disabled: "disabledChange" }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: forwardRef(() => RadioButtonGroupComponent),
                multi: true,
            },
        ], ngImport: i0, template: "<section\n    class=\"flex gap-2\"\n    [class.flex-col]=\"viewMode() === 'horizontal'\"\n>\n    @for (radioButtonItem of radioButtonItems(); track radioButtonItem.hash) {\n        @let itemDisabled = disabled() ? true : radioButtonItem.disabled || false;\n\n        <s-radiobutton\n            [(ngModel)]=\"modelValue\"\n            (ngModelChange)=\"setValue($event)\"\n            [value]=\"radioButtonItem.value\"\n            [buttonDisabled]=\"itemDisabled\"\n            [name]=\"inputName()\"\n            [label]=\"radioButtonItem.label\"\n        >\n        </s-radiobutton>\n    }\n</section>\n", dependencies: [{ 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"] }, { kind: "component", type: RadioButtonComponent, selector: "s-radiobutton", inputs: ["buttonDisabled", "label", "name", "value", "inputId"], outputs: ["buttonDisabledChange", "valueChange", "focusedInput", "inputFocusLost"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RadioButtonGroupComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-radiobutton-group', standalone: true, imports: [FormsModule, RadioButtonComponent], providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => RadioButtonGroupComponent),
                            multi: true,
                        },
                    ], template: "<section\n    class=\"flex gap-2\"\n    [class.flex-col]=\"viewMode() === 'horizontal'\"\n>\n    @for (radioButtonItem of radioButtonItems(); track radioButtonItem.hash) {\n        @let itemDisabled = disabled() ? true : radioButtonItem.disabled || false;\n\n        <s-radiobutton\n            [(ngModel)]=\"modelValue\"\n            (ngModelChange)=\"setValue($event)\"\n            [value]=\"radioButtonItem.value\"\n            [buttonDisabled]=\"itemDisabled\"\n            [name]=\"inputName()\"\n            [label]=\"radioButtonItem.label\"\n        >\n        </s-radiobutton>\n    }\n</section>\n" }]
        }] });

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

export { RadioButtonComponent, RadioButtonGroupComponent };
//# sourceMappingURL=seniorsistemas-angular-components-radio-button.mjs.map
