import * as i0 from '@angular/core';
import { inject, DestroyRef, Component, Input, NgModule } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { LocaleService } from '@seniorsistemas/angular-components/locale';
import { NgClass, NgStyle } from '@angular/common';

class ProgressBarDeterminateComponent {
    localeService = inject(LocaleService);
    _destroyRef = inject(DestroyRef);
    value;
    activeColor;
    numberFormatOptions;
    targetValue;
    targetLabel;
    showValue = true;
    numberFormat = new Intl.NumberFormat('pt-BR');
    ngOnInit() {
        this.validateValues();
        this.onGetLocale();
    }
    onGetLocale() {
        this.localeService.getLocale().pipe(takeUntilDestroyed(this._destroyRef)).subscribe({
            next: (locale) => {
                this.numberFormat = new Intl.NumberFormat(locale ?? 'pt-BR', this.numberFormatOptions);
            },
            error: () => {
                this.numberFormat = new Intl.NumberFormat('pt-BR', this.numberFormatOptions);
            },
        });
    }
    validateValues() {
        if (this.value < 0 || this.value > 100) {
            throw new Error('Invalid value for value');
        }
        if (this.targetValue && (this.targetValue < 0 || this.targetValue > 100)) {
            throw new Error('Invalid value for targetValue');
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarDeterminateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ProgressBarDeterminateComponent, isStandalone: true, selector: "s-progressbar-determinate", inputs: { value: "value", activeColor: "activeColor", numberFormatOptions: "numberFormatOptions", targetValue: "targetValue", targetLabel: "targetLabel", showValue: "showValue" }, ngImport: i0, template: "<div class=\"relative\">\n    <div class=\"h-6 w-full overflow-hidden rounded-small bg-[#d8d8d8]\">\n        <div\n            [ngClass]=\"{\n                'bg-criticality-blue': activeColor === 'blue',\n                'bg-criticality-green': activeColor === 'green',\n                'bg-criticality-red': activeColor === 'red',\n                'bg-criticality-yellow': activeColor === 'yellow',\n            }\"\n            [class.text-grayscale-90]=\"activeColor === 'yellow'\"\n            [class.text-grayscale-0]=\"activeColor !== 'yellow'\"\n            class=\"flex h-full select-none items-center justify-center font-open-sans text-sm leading-[150%]\"\n            [ngStyle]=\"{ width: value + '%' }\"\n        >\n            {{ showValue && value ? numberFormat?.format(value) + '%' : '' }}\n        </div>\n    </div>\n    @if (targetValue) {\n        <div\n            class=\"absolute bottom-[-38px] flex flex-col\"\n            [ngStyle]=\"{\n                left: targetValue <= 50 ? targetValue + '%' : 'unset',\n                right: targetValue > 50 ? 100 - targetValue + '%' : 'unset',\n                'align-items': targetValue > 50 ? 'flex-end' : 'flex-start',\n            }\"\n        >\n            <span class=\"my-2 h-10 w-px bg-[#333]\"></span>\n            <span\n                class=\"rounded-xxbig bg-hippie-blue-700 px-3 py-0.5 font-open-sans text-xs leading-[150%] text-[#e5eaea]\"\n            >\n                {{ targetLabel || numberFormat?.format(value) + '%' }}\n            </span>\n        </div>\n    }\n</div>\n\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarDeterminateComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-progressbar-determinate', standalone: true, imports: [NgClass, NgStyle], template: "<div class=\"relative\">\n    <div class=\"h-6 w-full overflow-hidden rounded-small bg-[#d8d8d8]\">\n        <div\n            [ngClass]=\"{\n                'bg-criticality-blue': activeColor === 'blue',\n                'bg-criticality-green': activeColor === 'green',\n                'bg-criticality-red': activeColor === 'red',\n                'bg-criticality-yellow': activeColor === 'yellow',\n            }\"\n            [class.text-grayscale-90]=\"activeColor === 'yellow'\"\n            [class.text-grayscale-0]=\"activeColor !== 'yellow'\"\n            class=\"flex h-full select-none items-center justify-center font-open-sans text-sm leading-[150%]\"\n            [ngStyle]=\"{ width: value + '%' }\"\n        >\n            {{ showValue && value ? numberFormat?.format(value) + '%' : '' }}\n        </div>\n    </div>\n    @if (targetValue) {\n        <div\n            class=\"absolute bottom-[-38px] flex flex-col\"\n            [ngStyle]=\"{\n                left: targetValue <= 50 ? targetValue + '%' : 'unset',\n                right: targetValue > 50 ? 100 - targetValue + '%' : 'unset',\n                'align-items': targetValue > 50 ? 'flex-end' : 'flex-start',\n            }\"\n        >\n            <span class=\"my-2 h-10 w-px bg-[#333]\"></span>\n            <span\n                class=\"rounded-xxbig bg-hippie-blue-700 px-3 py-0.5 font-open-sans text-xs leading-[150%] text-[#e5eaea]\"\n            >\n                {{ targetLabel || numberFormat?.format(value) + '%' }}\n            </span>\n        </div>\n    }\n</div>\n\n" }]
        }], propDecorators: { value: [{
                type: Input,
                args: [{ required: true }]
            }], activeColor: [{
                type: Input,
                args: [{ required: true }]
            }], numberFormatOptions: [{
                type: Input
            }], targetValue: [{
                type: Input
            }], targetLabel: [{
                type: Input
            }], showValue: [{
                type: Input
            }] } });

class ProgressBarIndeterminateComponent {
    activeColor;
    label;
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarIndeterminateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ProgressBarIndeterminateComponent, isStandalone: true, selector: "s-progressbar-indeterminate", inputs: { activeColor: "activeColor", label: "label" }, ngImport: i0, template: "<div class=\"flex flex-col items-center\">\n    <div class=\"bg-[#d8d8d8] rounded-small h-6 my-2 overflow-hidden w-full\">\n        <div\n            class=\"indeterminate-bar h-full w-[40%]\"\n            [ngClass]=\"{\n                'bg-criticality-blue': activeColor === 'blue',\n                'bg-criticality-green': activeColor === 'green',\n                'bg-criticality-red': activeColor === 'red',\n                'bg-criticality-yellow': activeColor === 'yellow'\n            }\"\n        ></div>\n    </div>\n\n    @if (label) {\n        <span class=\"font-open-sans text-xs leading-[150%] text-grayscale-90\">{{ label }}</span>\n    }\n</div>\n", styles: ["@keyframes indeterminate-progress{0%{transform:translate(-250%)}to{transform:translate(250%)}}.indeterminate-bar{animation:indeterminate-progress 5s infinite}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarIndeterminateComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-progressbar-indeterminate', standalone: true, imports: [NgClass], template: "<div class=\"flex flex-col items-center\">\n    <div class=\"bg-[#d8d8d8] rounded-small h-6 my-2 overflow-hidden w-full\">\n        <div\n            class=\"indeterminate-bar h-full w-[40%]\"\n            [ngClass]=\"{\n                'bg-criticality-blue': activeColor === 'blue',\n                'bg-criticality-green': activeColor === 'green',\n                'bg-criticality-red': activeColor === 'red',\n                'bg-criticality-yellow': activeColor === 'yellow'\n            }\"\n        ></div>\n    </div>\n\n    @if (label) {\n        <span class=\"font-open-sans text-xs leading-[150%] text-grayscale-90\">{{ label }}</span>\n    }\n</div>\n", styles: ["@keyframes indeterminate-progress{0%{transform:translate(-250%)}to{transform:translate(250%)}}.indeterminate-bar{animation:indeterminate-progress 5s infinite}\n"] }]
        }], propDecorators: { activeColor: [{
                type: Input,
                args: [{ required: true }]
            }], label: [{
                type: Input
            }] } });

/**
 * @description Componente de barra de progresso que representa visualmente o avanço de uma tarefa.
 * Suporta modo determinado (valor percentual) e indeterminado (progresso desconhecido),
 * além de um valor-alvo para comparação.
 *
 * @example
 * ```html
 * <s-progressbar
 *   [value]="75"
 *   activeColor="blue"
 *   label="Upload"
 *   [showValue]="true"
 * />
 * ```
 *
 * @category Feedback
 */
class ProgressBarComponent {
    /**
     * @description Valor atual do progresso, em percentual (0 a 100).
     * Não utilizado quando `mode` é `'indeterminate'`.
     * Lança erro se o valor estiver fora do intervalo permitido.
     */
    value;
    /**
     * @description Cor ativa da barra de progresso. Campo obrigatório.
     * Valores aceitos: `'blue'`, `'green'`, `'red'`, `'yellow'`.
     */
    activeColor;
    /**
     * @description Opções de formatação numérica utilizadas para exibir o valor percentual.
     * Baseado na API `Intl.NumberFormat`.
     *
     * @default `{ style: 'decimal', minimumFractionDigits: 0, maximumFractionDigits: 2 }`
     */
    numberFormatOptions = {
        style: 'decimal',
        minimumFractionDigits: 0,
        maximumFractionDigits: 2,
        roundingMode: 'trunc',
    };
    /**
     * @description Valor-alvo em percentual (0 a 100), exibido como marcador de referência na barra.
     * Não utilizado quando `mode` é `'indeterminate'`.
     */
    targetValue;
    /** @description Rótulo descritivo exibido ao lado da barra de progresso principal. */
    label;
    /** @description Rótulo descritivo exibido ao lado do marcador de valor-alvo. */
    targetLabel;
    /**
     * @description Quando `true`, exibe o valor percentual atual sobre ou próximo da barra.
     *
     * @default true
     */
    showValue = true;
    /**
     * @description Modo de operação da barra de progresso.
     * - `'determinate'`: exibe o progresso baseado em `value` (padrão).
     * - `'indeterminate'`: animação contínua sem valor definido; `value`, `targetValue` e `targetLabel` não devem ser usados.
     *
     * @default 'determinate'
     */
    mode = 'determinate';
    ngOnInit() {
        this.validateInputs();
    }
    validateInputs() {
        if (this.value < 0 || this.value > 100) {
            throw new Error('Invalid value for value');
        }
        if (this.targetValue && (this.targetValue < 0 || this.targetValue > 100)) {
            throw new Error('Invalid value for targetValue');
        }
        if (this.mode === 'indeterminate' && (this.value || this.targetValue || this.targetLabel)) {
            throw new Error('When the mode is indeterminate, the value, targetValue and targetLabel parameters are not expected.');
        }
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: ProgressBarComponent, isStandalone: true, selector: "s-progressbar", inputs: { value: "value", activeColor: "activeColor", numberFormatOptions: "numberFormatOptions", targetValue: "targetValue", label: "label", targetLabel: "targetLabel", showValue: "showValue", mode: "mode" }, ngImport: i0, template: "@if (mode === 'determinate') {\n    <s-progressbar-determinate\n        [value]=\"value\"\n        [numberFormatOptions]=\"numberFormatOptions\"\n        [targetValue]=\"targetValue\"\n        [targetLabel]=\"targetLabel\"\n        [activeColor]=\"activeColor\"\n        [showValue]=\"showValue\"\n    >\n    </s-progressbar-determinate>\n} @else {\n    <s-progressbar-indeterminate\n        [activeColor]=\"activeColor\"\n        [label]=\"label\"\n    >\n    </s-progressbar-indeterminate>\n}\n", dependencies: [{ kind: "component", type: ProgressBarDeterminateComponent, selector: "s-progressbar-determinate", inputs: ["value", "activeColor", "numberFormatOptions", "targetValue", "targetLabel", "showValue"] }, { kind: "component", type: ProgressBarIndeterminateComponent, selector: "s-progressbar-indeterminate", inputs: ["activeColor", "label"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-progressbar', standalone: true, imports: [ProgressBarDeterminateComponent, ProgressBarIndeterminateComponent], template: "@if (mode === 'determinate') {\n    <s-progressbar-determinate\n        [value]=\"value\"\n        [numberFormatOptions]=\"numberFormatOptions\"\n        [targetValue]=\"targetValue\"\n        [targetLabel]=\"targetLabel\"\n        [activeColor]=\"activeColor\"\n        [showValue]=\"showValue\"\n    >\n    </s-progressbar-determinate>\n} @else {\n    <s-progressbar-indeterminate\n        [activeColor]=\"activeColor\"\n        [label]=\"label\"\n    >\n    </s-progressbar-indeterminate>\n}\n" }]
        }], propDecorators: { value: [{
                type: Input
            }], activeColor: [{
                type: Input,
                args: [{ required: true }]
            }], numberFormatOptions: [{
                type: Input
            }], targetValue: [{
                type: Input
            }], label: [{
                type: Input
            }], targetLabel: [{
                type: Input
            }], showValue: [{
                type: Input
            }], mode: [{
                type: Input
            }] } });

/* eslint-disable max-len */
class ProgressBarModule {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarModule, imports: [ProgressBarComponent], exports: [ProgressBarComponent] });
    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarModule });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: ProgressBarModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: [ProgressBarComponent],
                    exports: [ProgressBarComponent],
                }]
        }] });

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

export { ProgressBarComponent, ProgressBarModule };
//# sourceMappingURL=seniorsistemas-angular-components-progressbar.mjs.map
