@dev-tcloud/tcloud-ui 6.5.6 → 6.6.0

package/fesm2022/dev-tcloud-tcloud-ui.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, Component, EventEmitter, Input, Output, forwardRef, ViewChild, InjectionToken, Optional, Inject, input, effect, Directive, Pipe, ViewEncapsulation, signal, inject, HostListener, NgModule, makeEnvironmentProviders, output, ContentChildren, computed, ApplicationRef, model, viewChild, ChangeDetectionStrategy } from '@angular/core';
+import { Injectable, Component, EventEmitter, Input, Output, forwardRef, ViewChild, InjectionToken, Optional, Inject, input, effect, Directive, Pipe, ViewEncapsulation, signal, inject, HostListener, ChangeDetectionStrategy, NgModule, makeEnvironmentProviders, output, ContentChildren, computed, ApplicationRef, model, viewChild } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule, DatePipe, DOCUMENT } from '@angular/common';
 import { Subject, Subscription, debounceTime, distinctUntilChanged, map, BehaviorSubject } from 'rxjs';
@@ -6312,6 +6312,123 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                 args: ['paste', ['$event']]
             }] } });
 
+class TCloudUiPaginationService {
+    constructor() {
+        this.total = 0;
+    }
+    set_total(total) {
+        this.total = total;
+    }
+    get_total() {
+        return this.total;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationService, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class TCloudUiPaginationPipe {
+    constructor() {
+        this._tcloudUiPaginationService = inject(TCloudUiPaginationService);
+        this.resultItems = [];
+    }
+    transform(collection, args) {
+        const total = Math.ceil((collection?.length || 0) / args.itemsPerPage);
+        this._tcloudUiPaginationService.set_total(total);
+        if (!Array.isArray(collection) ||
+            isNaN(args.currentPage) ||
+            isNaN(args.itemsPerPage)) {
+            return collection;
+        }
+        const firstIndex = (args?.currentPage - 1) * args?.itemsPerPage;
+        const lastIndex = firstIndex + args?.itemsPerPage;
+        const tempCollection = [];
+        for (let i = firstIndex; i < lastIndex; i++) {
+            if (i < collection?.length) {
+                tempCollection.push(collection[i]);
+            }
+        }
+        return tempCollection;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationPipe, isStandalone: true, name: "TCloudUiPagination" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'TCloudUiPagination',
+                    standalone: true
+                }]
+        }] });
+
+class TCloudUiPaginationComponent {
+    constructor() {
+        this.currentPage = 1;
+        //@Input() totalPages = 1;
+        this._tcloudUiPaginationService = inject(TCloudUiPaginationService);
+        this.pageChange = new EventEmitter();
+        this.pageInputError = false;
+    }
+    previous() {
+        if (this.currentPage > 1) {
+            this.currentPage--;
+            this.pageChange.emit(this.currentPage);
+        }
+    }
+    get totalPages() {
+        return this._tcloudUiPaginationService.get_total();
+    }
+    next() {
+        if (this.currentPage < this.totalPages) {
+            this.currentPage++;
+            this.pageChange.emit(this.currentPage);
+        }
+    }
+    goToPage(event) {
+        const input = event.target;
+        const value = input.value;
+        let pageNumber = parseInt(value.replace(/^0+/, ''), 10);
+        if (isNaN(pageNumber) || pageNumber < 1 || pageNumber > this.totalPages) {
+            this.pageInputError = true;
+            if (isNaN(pageNumber) || pageNumber < 1) {
+                pageNumber = 1;
+            }
+            else if (pageNumber > this.totalPages) {
+                pageNumber = this.totalPages;
+            }
+        }
+        else {
+            this.pageInputError = false;
+        }
+        input.value = this.formatPage(pageNumber);
+        if (pageNumber !== this.currentPage) {
+            this.currentPage = pageNumber;
+            this.pageChange.emit(this.currentPage);
+        }
+    }
+    formatPage(page) {
+        return page < 10 ? `0${page}` : `${page}`;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.18", type: TCloudUiPaginationComponent, isStandalone: true, selector: "tcloud-ui-pagination", inputs: { currentPage: "currentPage" }, outputs: { pageChange: "pageChange" }, ngImport: i0, template: "<div class=\"pagination-container\">\n\t<button class=\"arrow\" [disabled]=\"currentPage === 1\" (click)=\"previous()\"><i class=\"fas fa-angle-left\"></i></button>\n\n\t<span class=\"label f-family f-weight-600 f-size-14 c-neutral-700\">P\u00E1gina</span>\n\n\t<div class=\"page-input-container\">\n\t\t<input\n\t\t\ttype=\"text\"\n\t\t\tclass=\"page-input\"\n\t\t\t[ngClass]=\"{'error': pageInputError}\"\n\t\t\t[value]=\"formatPage(currentPage)\"\n\t\t\t(keyup.enter)=\"goToPage($event)\"\n\t\t\t(blur)=\"goToPage($event)\"\n\t\t/>\n\t</div>\n\n\t<span class=\"label f-family f-weight-600 f-size-14 c-neutral-700\">de {{ totalPages }}</span>\n\n\t<button class=\"arrow\" [disabled]=\"currentPage === totalPages\" (click)=\"next()\"><i class=\"fas fa-angle-right\"></i></button>\n</div>\n", styles: [":host{display:block}.pagination-container{display:flex;align-items:center;gap:8px;font-family:var(--f-family);justify-content:center}.pagination-container .label{color:var(--c-neutral-700)}.pagination-container .page-input-container{position:relative;width:48px;height:32px}.pagination-container .page-input{width:100%;height:100%;padding:var(--size-4) var(--size-8);border:1px solid var(--c-neutral-300);border-radius:var(--bor-radius-8);font-size:var(--f-size-14);font-family:var(--f-family);font-weight:var(--f-weight-600);color:var(--c-neutral-700);text-align:center;background-color:var(--c-neutral-50);outline:none;transition:border-color .2s ease}.pagination-container .page-input:focus:not(.error){border-color:var(--c-primary-500)}.pagination-container .page-input.error{border-color:var(--c-danger-500)}.pagination-container .page-input.error:focus{border-color:var(--c-danger-500)}.pagination-container .arrow{background-color:var(--c-neutral-100);border:1px solid var(--c-neutral-300);border-radius:var(--bor-radius-8);width:32px;height:32px;font-size:var(--f-size-16);color:var(--c-neutral-300);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.pagination-container .arrow:disabled{cursor:not-allowed;opacity:.5}.pagination-container .arrow:hover:not(:disabled){background-color:var(--c-primary-100);border-color:var(--c-primary-300);color:var(--c-primary-500)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiPaginationComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'tcloud-ui-pagination', imports: [
+                        CommonModule,
+                        TCloudUiPaginationPipe
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"pagination-container\">\n\t<button class=\"arrow\" [disabled]=\"currentPage === 1\" (click)=\"previous()\"><i class=\"fas fa-angle-left\"></i></button>\n\n\t<span class=\"label f-family f-weight-600 f-size-14 c-neutral-700\">P\u00E1gina</span>\n\n\t<div class=\"page-input-container\">\n\t\t<input\n\t\t\ttype=\"text\"\n\t\t\tclass=\"page-input\"\n\t\t\t[ngClass]=\"{'error': pageInputError}\"\n\t\t\t[value]=\"formatPage(currentPage)\"\n\t\t\t(keyup.enter)=\"goToPage($event)\"\n\t\t\t(blur)=\"goToPage($event)\"\n\t\t/>\n\t</div>\n\n\t<span class=\"label f-family f-weight-600 f-size-14 c-neutral-700\">de {{ totalPages }}</span>\n\n\t<button class=\"arrow\" [disabled]=\"currentPage === totalPages\" (click)=\"next()\"><i class=\"fas fa-angle-right\"></i></button>\n</div>\n", styles: [":host{display:block}.pagination-container{display:flex;align-items:center;gap:8px;font-family:var(--f-family);justify-content:center}.pagination-container .label{color:var(--c-neutral-700)}.pagination-container .page-input-container{position:relative;width:48px;height:32px}.pagination-container .page-input{width:100%;height:100%;padding:var(--size-4) var(--size-8);border:1px solid var(--c-neutral-300);border-radius:var(--bor-radius-8);font-size:var(--f-size-14);font-family:var(--f-family);font-weight:var(--f-weight-600);color:var(--c-neutral-700);text-align:center;background-color:var(--c-neutral-50);outline:none;transition:border-color .2s ease}.pagination-container .page-input:focus:not(.error){border-color:var(--c-primary-500)}.pagination-container .page-input.error{border-color:var(--c-danger-500)}.pagination-container .page-input.error:focus{border-color:var(--c-danger-500)}.pagination-container .arrow{background-color:var(--c-neutral-100);border:1px solid var(--c-neutral-300);border-radius:var(--bor-radius-8);width:32px;height:32px;font-size:var(--f-size-16);color:var(--c-neutral-300);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.pagination-container .arrow:disabled{cursor:not-allowed;opacity:.5}.pagination-container .arrow:hover:not(:disabled){background-color:var(--c-primary-100);border-color:var(--c-primary-300);color:var(--c-primary-500)}\n"] }]
+        }], propDecorators: { currentPage: [{
+                type: Input
+            }], pageChange: [{
+                type: Output
+            }] } });
+
 const COMPONENTS = [
     TCloudUiAccordionComponent,
     TCloudUiAccordionBodyComponent,
@@ -6352,7 +6469,8 @@ const COMPONENTS = [
     TCloudUiWelcomeComponent,
     TCloudUiContainerComponent,
     TCloudUiContainerColComponent,
-    TCloudUiContainerContentComponent
+    TCloudUiContainerContentComponent,
+    TCloudUiPaginationComponent
 ];
 const DIRECTIVES = [
     TCloudUiAlignDirective,
@@ -6377,7 +6495,8 @@ const PIPES = [
     DateBRPipe,
     MonthNamePipe,
     RespectivePipe,
-    StatusInfoPipe
+    StatusInfoPipe,
+    TCloudUiPaginationPipe
 ];
 class TCloudUiModule {
     static forRoot(config) {
@@ -6442,7 +6561,8 @@ class TCloudUiModule {
             TCloudUiWelcomeComponent,
             TCloudUiContainerComponent,
             TCloudUiContainerColComponent,
-            TCloudUiContainerContentComponent, TCloudUiAlignDirective,
+            TCloudUiContainerContentComponent,
+            TCloudUiPaginationComponent, TCloudUiAlignDirective,
             TCloudUiCurrencyDirective,
             TCloudUiElCopyDirective,
             TCloudUiHoverParentDirective,
@@ -6461,7 +6581,8 @@ class TCloudUiModule {
             DateBRPipe,
             MonthNamePipe,
             RespectivePipe,
-            StatusInfoPipe], exports: [TCloudUiAccordionComponent,
+            StatusInfoPipe,
+            TCloudUiPaginationPipe], exports: [TCloudUiAccordionComponent,
             TCloudUiAccordionBodyComponent,
             TCloudUiAccordionTitleComponent,
             TCloudUiChoiceIssuesComponent,
@@ -6500,7 +6621,8 @@ class TCloudUiModule {
             TCloudUiWelcomeComponent,
             TCloudUiContainerComponent,
             TCloudUiContainerColComponent,
-            TCloudUiContainerContentComponent, TCloudUiAlignDirective,
+            TCloudUiContainerContentComponent,
+            TCloudUiPaginationComponent, TCloudUiAlignDirective,
             TCloudUiCurrencyDirective,
             TCloudUiElCopyDirective,
             TCloudUiHoverParentDirective,
@@ -6519,10 +6641,12 @@ class TCloudUiModule {
             DateBRPipe,
             MonthNamePipe,
             RespectivePipe,
-            StatusInfoPipe] }); }
+            StatusInfoPipe,
+            TCloudUiPaginationPipe] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiModule, providers: [
             DatePipe,
-            StatusInfoPipe
+            StatusInfoPipe,
+            TCloudUiPaginationService
         ], imports: [TCloudUiAccordionComponent,
             TCloudUiAccordionBodyComponent,
             TCloudUiAccordionTitleComponent,
@@ -6559,7 +6683,8 @@ class TCloudUiModule {
             TCloudUiMultiplesValuesComponent,
             TCloudUiProgressBarComponent,
             TCloudUiReorderItemsComponent,
-            TCloudUiWelcomeComponent] }); }
+            TCloudUiWelcomeComponent,
+            TCloudUiPaginationComponent] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImport: i0, type: TCloudUiModule, decorators: [{
             type: NgModule,
@@ -6576,7 +6701,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
                     ],
                     providers: [
                         DatePipe,
-                        StatusInfoPipe
+                        StatusInfoPipe,
+                        TCloudUiPaginationService
                     ]
                 }]
         }] });
@@ -8903,5 +9029,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.18", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, DropdownGroupedSize, DropdownMultiSize, DropdownSize, MonthNamePipe, MultiLevelDropdownSize, ProgressStatusBarGradientStatus, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCLOUD_UI_CONFIG, TCLOUD_UI_LAYOUT_SERVICE, TCLOUD_UI_USER_SERVICE, TCLOUD_UI_VIEWPORT_SERVICE, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionTitleComponent, TCloudUiAlignDirective, TCloudUiButtonDirective, TCloudUiCheckAccessDirective, TCloudUiCheckAccessService, TCloudUiChoiceIssuesComponent, TCloudUiContainerColComponent, TCloudUiContainerComponent, TCloudUiContainerContentComponent, TCloudUiCubesComponent, TCloudUiCurrencyDirective, TCloudUiDataListComponent, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerTimeComponent, TCloudUiDigitOnlyDirective, TCloudUiElCopyDirective, TCloudUiFiltersComponent, TCloudUiFormDirective, TCloudUiHighLightDirective, TCloudUiHoverParentDirective, TCloudUiInputPasswordComponent, TCloudUiInputSearchComponent, TCloudUiIpMaskDirective, TCloudUiLabelTokenComponent, TCloudUiLineStepCircleComponent, TCloudUiLineStepTitleComponent, TCloudUiLinhaLogoComponent, TCloudUiLoadingComponent, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiSelectComponent, TCloudUiMultiplesValuesComponent, TCloudUiNgCheckAccessDirective, TCloudUiNgFeatureFlagsDirective, TCloudUiNotFoundComponent, TCloudUiNumberStepComponent, TCloudUiProgressBarComponent, TCloudUiRangeDateComponent, TCloudUiReorderItemsComponent, TCloudUiScrollBoxComponent, TCloudUiSearchInObjectService, TCloudUiSubNavbarComponent, TCloudUiSubNavbarItemComponent, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTooltipDirective, TCloudUiWelcomeComponent, TagColorsEnum, TcRevButtonDirective, TcRevCalendarComponent, TcRevCardAccordionComponent, TcRevCardComponent, TcRevCardTitleComponent, TcRevCheckboxDirective, TcRevComponentsLibModule, TcRevDropdownComponent, TcRevDropdownGroupedComponent, TcRevDropdownMultiComponent, TcRevDropdownMultiLevelComponent, TcRevEmptyContentComponent, TcRevFaqComponent, TcRevIconButtonDirective, TcRevInputContainerComponent, TcRevInputDirective, TcRevLoadingComponent, TcRevMessageComponent, TcRevMultiInputComponent, TcRevPaginationComponent, TcRevProgressStatusBarComponent, TcRevRadioDirective, TcRevSearchInputComponent, TcRevSideDrawerComponent, TcRevSkeletonLoadingComponent, TcRevSkeletonLoadingComponentStyle, TcRevSlideToggleDirective, TcRevSmallLoadingComponent, TcRevSmallLoadingComponentStyle, TcRevSubNavbarComponent, TcRevSubNavbarItemComponent, TcRevTabGroupComponent, TcRevTabItemComponent, TcRevTagComponent, TcRevToastComponent, TcRevTooltipDirective, TcRevWizardStepsComponent, ToTextPipe, echartBarConfig, isTextEllipsed, provideTCloudUi };
+export { BytesPipe, CNPJPipe, CPFPipe, CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR$1 as CUSTOM_INPUT_CONTROL_VALUE_ACCESSOR, DateBRPipe, DropdownGroupedSize, DropdownMultiSize, DropdownSize, MonthNamePipe, MultiLevelDropdownSize, ProgressStatusBarGradientStatus, RespectivePipe, StatusInfoPipe, TCCondition, TCFiltersType, TCLOUD_UI_CONFIG, TCLOUD_UI_LAYOUT_SERVICE, TCLOUD_UI_USER_SERVICE, TCLOUD_UI_VIEWPORT_SERVICE, TCloudUiAccordionBodyComponent, TCloudUiAccordionComponent, TCloudUiAccordionTitleComponent, TCloudUiAlignDirective, TCloudUiButtonDirective, TCloudUiCheckAccessDirective, TCloudUiCheckAccessService, TCloudUiChoiceIssuesComponent, TCloudUiContainerColComponent, TCloudUiContainerComponent, TCloudUiContainerContentComponent, TCloudUiCubesComponent, TCloudUiCurrencyDirective, TCloudUiDataListComponent, TCloudUiDataListOptionComponent, TCloudUiDatepickerComponent, TCloudUiDatepickerTimeComponent, TCloudUiDigitOnlyDirective, TCloudUiElCopyDirective, TCloudUiFiltersComponent, TCloudUiFormDirective, TCloudUiHighLightDirective, TCloudUiHoverParentDirective, TCloudUiInputPasswordComponent, TCloudUiInputSearchComponent, TCloudUiIpMaskDirective, TCloudUiLabelTokenComponent, TCloudUiLineStepCircleComponent, TCloudUiLineStepTitleComponent, TCloudUiLinhaLogoComponent, TCloudUiLoadingComponent, TCloudUiLoadingTransitionsService, TCloudUiModalBodyComponent, TCloudUiModalComponent, TCloudUiModalFooterComponent, TCloudUiModalHeaderComponent, TCloudUiModule, TCloudUiMultiInputComponent, TCloudUiMultiSelectComponent, TCloudUiMultiplesValuesComponent, TCloudUiNgCheckAccessDirective, TCloudUiNgFeatureFlagsDirective, TCloudUiNotFoundComponent, TCloudUiNumberStepComponent, TCloudUiPaginationComponent, TCloudUiPaginationPipe, TCloudUiProgressBarComponent, TCloudUiRangeDateComponent, TCloudUiReorderItemsComponent, TCloudUiScrollBoxComponent, TCloudUiSearchInObjectService, TCloudUiSubNavbarComponent, TCloudUiSubNavbarItemComponent, TCloudUiTabContentComponent, TCloudUiTabHeadComponent, TCloudUiTabMenuComponent, TCloudUiTabSubtitleComponent, TCloudUiTabTitleComponent, TCloudUiTableComponent, TCloudUiTooltipDirective, TCloudUiWelcomeComponent, TagColorsEnum, TcRevButtonDirective, TcRevCalendarComponent, TcRevCardAccordionComponent, TcRevCardComponent, TcRevCardTitleComponent, TcRevCheckboxDirective, TcRevComponentsLibModule, TcRevDropdownComponent, TcRevDropdownGroupedComponent, TcRevDropdownMultiComponent, TcRevDropdownMultiLevelComponent, TcRevEmptyContentComponent, TcRevFaqComponent, TcRevIconButtonDirective, TcRevInputContainerComponent, TcRevInputDirective, TcRevLoadingComponent, TcRevMessageComponent, TcRevMultiInputComponent, TcRevPaginationComponent, TcRevProgressStatusBarComponent, TcRevRadioDirective, TcRevSearchInputComponent, TcRevSideDrawerComponent, TcRevSkeletonLoadingComponent, TcRevSkeletonLoadingComponentStyle, TcRevSlideToggleDirective, TcRevSmallLoadingComponent, TcRevSmallLoadingComponentStyle, TcRevSubNavbarComponent, TcRevSubNavbarItemComponent, TcRevTabGroupComponent, TcRevTabItemComponent, TcRevTagComponent, TcRevToastComponent, TcRevTooltipDirective, TcRevWizardStepsComponent, ToTextPipe, echartBarConfig, isTextEllipsed, provideTCloudUi };
 //# sourceMappingURL=dev-tcloud-tcloud-ui.mjs.map