import * as i0 from '@angular/core';
import { input, model, output, effect, computed, signal, Component } from '@angular/core';
import * as i1 from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { InteractiveContentDirective } from '@seniorsistemas/angular-components/interactive-content';
import { SelectComponent } from '@seniorsistemas/angular-components/select';
import * as i2 from '@ngx-translate/core';
import { TranslateModule } from '@ngx-translate/core';

class PaginatorComponent {
    totalRecords = input.required();
    rows = model(10);
    rowsPerPageOptions = input([10, 20, 50, 100, 200]);
    pageChange = output();
    currentPageEffect = effect(() => {
        const page = this.currentPage() - 1;
        this.pageChange.emit({
            page,
            pageCount: this.totalPages(),
            rows: this.rows(),
            first: this.rows() * page,
        });
    });
    MAX_PAGE_BUTTONS = 5;
    hasPreviousPage = computed(() => {
        const previousPage = this.currentPage() - 1;
        return previousPage >= 1;
    });
    hasNextPage = computed(() => {
        const nextPage = this.currentPage() + 1;
        return nextPage <= this.totalPages();
    });
    currentPage = signal(1);
    buttons = computed(() => {
        const navigationPageButtons = [];
        const maxPageButtons = this.MAX_PAGE_BUTTONS;
        const currentPage = this.currentPage();
        const middle = Math.floor(maxPageButtons / 2);
        const _startPage = currentPage - middle;
        let startPage = _startPage < 1 ? 1 : _startPage;
        const _endPage = startPage + maxPageButtons - 1;
        const endPageIsMoreThanTotalPages = _endPage > this.totalPages();
        if (endPageIsMoreThanTotalPages) {
            const diff = _endPage - this.totalPages();
            const canModifyStartPage = startPage - diff >= 1;
            if (canModifyStartPage) {
                startPage = startPage - diff;
            }
        }
        const endPage = endPageIsMoreThanTotalPages ? this.totalPages() : _endPage;
        for (let i = startPage; i <= endPage; i++) {
            navigationPageButtons.push({
                clicked: (page) => this.goToPage(page.pageIndex),
                pageIndex: i,
            });
        }
        return [
            this.FIRST_PAGE_BUTTON,
            this.PREVIOUS_PAGE_BUTTON,
            ...navigationPageButtons,
            this.NEXT_PAGE_BUTTON,
            this.LAST_PAGE_BUTTON,
        ];
    });
    FIRST_PAGE_BUTTON = {
        clicked: this.goFirstPage.bind(this),
        icon: 'fas fa-step-backward',
        validate: computed(() => {
            return !this.hasPreviousPage();
        }),
    };
    PREVIOUS_PAGE_BUTTON = {
        clicked: this.goPreviousPage.bind(this),
        icon: 'fas fa-caret-left',
        validate: computed(() => {
            return !this.hasPreviousPage();
        }),
    };
    LAST_PAGE_BUTTON = {
        clicked: this.goLastPage.bind(this),
        icon: 'fas fa-step-forward',
        validate: computed(() => {
            return !this.hasNextPage();
        }),
    };
    NEXT_PAGE_BUTTON = {
        clicked: this.goNextPage.bind(this),
        icon: 'fas fa-caret-right',
        validate: computed(() => {
            return !this.hasNextPage();
        }),
    };
    totalPages = computed(() => {
        const totalRecords = this.totalRecords();
        const _pages = totalRecords / this.rows();
        const pages = Math.ceil(_pages);
        const isExactPages = _pages === pages;
        return isExactPages ? pages : pages + 1;
    });
    ngOnDestroy() {
        this.currentPageEffect.destroy();
    }
    rowsPerPageChange() {
        if (this.currentPage() !== 1) {
            this.goToPage(1);
        }
    }
    activatedButton(button) {
        button.clicked(button);
    }
    goFirstPage() {
        this.goToPage(1);
    }
    goNextPage() {
        if (!this.hasNextPage()) {
            return;
        }
        this.currentPage.update((value) => value + 1);
    }
    goPreviousPage() {
        if (!this.hasPreviousPage()) {
            return;
        }
        this.currentPage.update((value) => value - 1);
    }
    goLastPage() {
        this.goToPage(this.totalPages());
    }
    goToPage(pageIndex) {
        this.currentPage.set(pageIndex);
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: PaginatorComponent, isStandalone: true, selector: "s-paginator", inputs: { totalRecords: { classPropertyName: "totalRecords", publicName: "totalRecords", isSignal: true, isRequired: true, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, rowsPerPageOptions: { classPropertyName: "rowsPerPageOptions", publicName: "rowsPerPageOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rows: "rowsChange", pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"flex justify-between\">\n    <section class=\"flex items-center gap-2\">\n        <div\n            class=\"inline-block h-8 divide-x divide-grayscale-30 overflow-hidden rounded-md border border-grayscale-30\"\n        >\n            @for (btn of buttons(); track $index) {\n                @let active = btn.pageIndex === currentPage();\n                <button\n                    [class.bg-criticality-blue]=\"active\"\n                    [class.text-grayscale-0]=\"active\"\n                    [class.text-criticality-blue]=\"!active\"\n                    (sInteractiveContent)=\"activatedButton(btn)\"\n                    [disabled]=\"btn.disabled || (btn.validate && btn.validate()) || false\"\n                    class=\"group h-8 w-8 hover:bg-grayscale-20 hover:text-grayscale-100 disabled:hover:bg-[transparent] disabled:hover:text-criticality-blue\"\n                >\n                    <div class=\"group-disabled:opacity-50\">\n                        @let page = btn.pageIndex;\n                        @let icon = btn.icon;\n                        @if (page !== undefined) {\n                            {{ page }}\n                        }\n                        @if (icon) {\n                            <i [class]=\"icon\"></i>\n                        }\n                    </div>\n                </button>\n            }\n        </div>\n        <s-select\n            [options]=\"rowsPerPageOptions()\"\n            [(ngModel)]=\"rows\"\n            (ngModelChange)=\"rowsPerPageChange()\"\n        ></s-select>\n    </section>\n    <section class=\"flex items-center gap-2\">\n        @let text =\n            totalRecords() === 0\n                ? 'platform.angular_components.total_record'\n                : 'platform.angular_components.total_records';\n        <p class=\"text-[14px] text-[#212533]\">\n            {{ text | translate: { count: totalRecords() } }}\n        </p>\n        <ng-content></ng-content>\n    </section>\n</div>\n", dependencies: [{ kind: "directive", type: InteractiveContentDirective, selector: "[sInteractiveContent]", inputs: ["focusable", "disabled", "stopPropagation"], outputs: ["sInteractiveContent"] }, { kind: "component", type: SelectComponent, selector: "s-select", inputs: ["placeholder", "multiple", "options", "optionLabel", "optionValue", "showClear", "filter", "checkmark", "filterBy", "group", "virtualScroll", "virtualScrollItemSize", "emptyMessage", "disabled", "showOptions"], outputs: ["disabledChange", "showOptionsChange"] }, { 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: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: PaginatorComponent, decorators: [{
            type: Component,
            args: [{ selector: 's-paginator', standalone: true, imports: [InteractiveContentDirective, SelectComponent, FormsModule, TranslateModule], template: "<div class=\"flex justify-between\">\n    <section class=\"flex items-center gap-2\">\n        <div\n            class=\"inline-block h-8 divide-x divide-grayscale-30 overflow-hidden rounded-md border border-grayscale-30\"\n        >\n            @for (btn of buttons(); track $index) {\n                @let active = btn.pageIndex === currentPage();\n                <button\n                    [class.bg-criticality-blue]=\"active\"\n                    [class.text-grayscale-0]=\"active\"\n                    [class.text-criticality-blue]=\"!active\"\n                    (sInteractiveContent)=\"activatedButton(btn)\"\n                    [disabled]=\"btn.disabled || (btn.validate && btn.validate()) || false\"\n                    class=\"group h-8 w-8 hover:bg-grayscale-20 hover:text-grayscale-100 disabled:hover:bg-[transparent] disabled:hover:text-criticality-blue\"\n                >\n                    <div class=\"group-disabled:opacity-50\">\n                        @let page = btn.pageIndex;\n                        @let icon = btn.icon;\n                        @if (page !== undefined) {\n                            {{ page }}\n                        }\n                        @if (icon) {\n                            <i [class]=\"icon\"></i>\n                        }\n                    </div>\n                </button>\n            }\n        </div>\n        <s-select\n            [options]=\"rowsPerPageOptions()\"\n            [(ngModel)]=\"rows\"\n            (ngModelChange)=\"rowsPerPageChange()\"\n        ></s-select>\n    </section>\n    <section class=\"flex items-center gap-2\">\n        @let text =\n            totalRecords() === 0\n                ? 'platform.angular_components.total_record'\n                : 'platform.angular_components.total_records';\n        <p class=\"text-[14px] text-[#212533]\">\n            {{ text | translate: { count: totalRecords() } }}\n        </p>\n        <ng-content></ng-content>\n    </section>\n</div>\n" }]
        }] });

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

export { PaginatorComponent };
//# sourceMappingURL=seniorsistemas-angular-components-paginator.mjs.map
