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

/**
 * @description Componente de escala de avaliação que permite ao usuário selecionar um nó de uma escala visual.
 * Implementa `ControlValueAccessor` para integração com Reactive Forms e Template-Driven Forms.
 * Ideal para pesquisas de satisfação (NPS, CSAT) e questionários de feedback.
 *
 * @example
 * ```html
 * <s-rating-scale
 *   [nodes]="ratingNodes"
 *   startLabel="Péssimo"
 *   endLabel="Ótimo"
 *   [(ngModel)]="rating"
 * />
 * ```
 *
 * @category Feedback
 */
class RatingScaleComponent {
    /**
     * @description Lista de nós que compõem a escala de avaliação. Campo obrigatório.
     * Cada `RatingScaleNode` define o valor, rótulo e cor do item na escala.
     */
    nodes;
    /** @description Rótulo exibido no início (extremidade esquerda) da escala. */
    startLabel;
    /** @description Rótulo exibido no final (extremidade direita) da escala. */
    endLabel;
    /**
     * @description Quando `true`, a escala fica desabilitada e o usuário não pode selecionar nenhum nó.
     *
     * @default false
     */
    disabled = false;
    value;
    _onChange;
    _onTouched;
    writeValue(value) {
        if (!this.disabled) {
            this.value = value;
        }
    }
    registerOnChange(onChange) {
        this._onChange = onChange;
    }
    registerOnTouched(onTouched) {
        this._onTouched = onTouched;
    }
    onSelect(rating) {
        this.value = rating;
        if (this._onChange) {
            this._onChange(this.value);
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: RatingScaleComponent, isStandalone: true, selector: "s-rating-scale", inputs: { nodes: "nodes", startLabel: "startLabel", endLabel: "endLabel", disabled: "disabled" }, providers: [
            {
                provide: NG_VALUE_ACCESSOR,
                useExisting: forwardRef(() => RatingScaleComponent),
                multi: true,
            },
        ], ngImport: i0, template: "<div\n    class=\"flex flex-col\"\n    [class.opacity-50]=\"disabled\">\n    <div class=\"flex\">\n        @for (node of nodes; track node.id) {\n            <button\n                class=\"flex flex-grow items-center justify-center rounded-xbig border border-secondary bg-grayscale-0 p-2 mx-0.5 first:ml-0 last:mr-0\"\n                [class.bg-hippie-blue-100]=\"value?.id === node.id && !disabled\"\n                [class.border-criticality-blue]=\"value?.id === node.id && !disabled\"\n                [class.text-criticality-blue]=\"value?.id === node.id && !disabled\"\n                [class.cursor-pointer]=\"!disabled\"\n                [class.hover:bg-grayscale-20]=\"!disabled\"\n                [class.focus:border-2]=\"!disabled\"\n                [class.focus:outline-none]=\"!disabled\"\n                tabindex=\"0\"\n                (click)=\"onSelect(node)\">\n                @if (node.icon) {\n                    <span\n                        class=\"m-1.5 text-base text-grayscale-60 fas\"\n                        [ngClass]=\"node.icon\">\n                    </span>\n                }\n                @if (node.title) {\n                    <span class=\"m-1.5 text-sm font-normal leading-[150%] text-grayscale-90\">{{ node.title }}</span>\n                }\n            </button>\n        }\n    </div>\n    <div class=\"flex justify-between py-3\">\n        <span class=\"font-open-sans text-sm font-normal leading-[150%] text-[#080808]\">{{ startLabel }}</span>\n        <span class=\"font-open-sans text-sm font-normal leading-[150%] text-[#080808]\">{{ endLabel }}</span>\n    </div>\n</div>", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: RatingScaleComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-rating-scale', providers: [
                        {
                            provide: NG_VALUE_ACCESSOR,
                            useExisting: forwardRef(() => RatingScaleComponent),
                            multi: true,
                        },
                    ], standalone: true, imports: [NgClass], template: "<div\n    class=\"flex flex-col\"\n    [class.opacity-50]=\"disabled\">\n    <div class=\"flex\">\n        @for (node of nodes; track node.id) {\n            <button\n                class=\"flex flex-grow items-center justify-center rounded-xbig border border-secondary bg-grayscale-0 p-2 mx-0.5 first:ml-0 last:mr-0\"\n                [class.bg-hippie-blue-100]=\"value?.id === node.id && !disabled\"\n                [class.border-criticality-blue]=\"value?.id === node.id && !disabled\"\n                [class.text-criticality-blue]=\"value?.id === node.id && !disabled\"\n                [class.cursor-pointer]=\"!disabled\"\n                [class.hover:bg-grayscale-20]=\"!disabled\"\n                [class.focus:border-2]=\"!disabled\"\n                [class.focus:outline-none]=\"!disabled\"\n                tabindex=\"0\"\n                (click)=\"onSelect(node)\">\n                @if (node.icon) {\n                    <span\n                        class=\"m-1.5 text-base text-grayscale-60 fas\"\n                        [ngClass]=\"node.icon\">\n                    </span>\n                }\n                @if (node.title) {\n                    <span class=\"m-1.5 text-sm font-normal leading-[150%] text-grayscale-90\">{{ node.title }}</span>\n                }\n            </button>\n        }\n    </div>\n    <div class=\"flex justify-between py-3\">\n        <span class=\"font-open-sans text-sm font-normal leading-[150%] text-[#080808]\">{{ startLabel }}</span>\n        <span class=\"font-open-sans text-sm font-normal leading-[150%] text-[#080808]\">{{ endLabel }}</span>\n    </div>\n</div>" }]
        }], propDecorators: { nodes: [{
                type: Input,
                args: [{ required: true }]
            }], startLabel: [{
                type: Input
            }], endLabel: [{
                type: Input
            }], disabled: [{
                type: Input
            }] } });

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

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

export { RatingScaleComponent, RatingScaleModule };
//# sourceMappingURL=seniorsistemas-angular-components-rating-scale.mjs.map
