matcha-components 20.258.0 → 20.259.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -7304,11 +7304,11 @@ class MatchaPaginatorComponent {
|
|
|
7304
7304
|
return '';
|
|
7305
7305
|
}
|
|
7306
7306
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MatchaPaginatorComponent, deps: [{ token: MatchaPaginatorIntl }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7307
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MatchaPaginatorComponent, isStandalone: false, selector: "matcha-paginator", inputs: { pageIndex: "pageIndex", length: "length", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", color: "color", showTotal: "showTotal", filteredLength: "filteredLength" }, outputs: { page: "page" }, ngImport: i0, template: "<div class=\"matcha-paginator flex-row flex-align-center gap-
|
|
7307
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.19", type: MatchaPaginatorComponent, isStandalone: false, selector: "matcha-paginator", inputs: { pageIndex: "pageIndex", length: "length", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", color: "color", showTotal: "showTotal", filteredLength: "filteredLength" }, outputs: { page: "page" }, ngImport: i0, template: "<div class=\"matcha-paginator flex-column flex-sm-row flex-align-center gap-16\">\n <!-- Total records information -->\n <div class=\"paginator-total-info flex-row flex-align-center min-h-32 gap-8\" *ngIf=\"showTotal\">\n <div class=\"total-range\">{{ getRangeLabel() }}</div>\n <div class=\"total-filtered\" *ngIf=\"hasFilteredResults\">{{ getFilteredLabel() }}</div>\n </div>\n\n <!-- Items per page selector -->\n <div class=\"flex-row flex-align-center min-h-32 gap-8\" *ngIf=\"pageSizeOptions && pageSizeOptions.length > 0\">\n <span class=\"text-sm color-placeholder\">{{ _intl.itemsPerPageLabel }}</span>\n <div class=\"page-size-selector\">\n <select \n class=\"page-size-select radius-8\" \n [value]=\"pageSize\" \n (change)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let option of pageSizeOptions\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n <div class=\"select-icon\">\n <matcha-icon name=\"action_arrow_down\" size=\"sm\" color=\"fg\"></matcha-icon>\n </div>\n </div>\n </div>\n \n <!-- Page navigation -->\n <div class=\"flex-row flex-align-center min-h-32 gap-8\">\n <!-- Previous page button -->\n <button \n class=\"nav-button\" \n [disabled]=\"!hasPreviousPage\"\n (click)=\"previousPage()\"\n [attr.aria-label]=\"_intl.previousPageLabel\">\n <matcha-icon name=\"action_arrow_left\" size=\"md\"></matcha-icon>\n </button>\n \n <!-- Page numbers -->\n <div class=\"flex-row flex-align-center gap-4\">\n <ng-container *ngFor=\"let page of displayPages; trackBy: trackByPage\">\n <button \n *ngIf=\"isNumber(page); else ellipsis\"\n class=\"page-button radius-full\"\n [class.active]=\"page === currentPage\"\n [class.radius-full]=\"page === currentPage\"\n [ngClass]=\"page === currentPage ? color : ''\"\n (click)=\"goToPage(page)\"\n [attr.aria-label]=\"'Ir para p\u00E1gina ' + page\">\n {{ page }}\n </button>\n <ng-template #ellipsis>\n <span class=\"ellipsis\">{{ page }}</span>\n </ng-template>\n </ng-container>\n </div>\n \n <!-- Next page button -->\n <button \n class=\"nav-button\" \n [disabled]=\"!hasNextPage\"\n (click)=\"nextPage()\"\n [attr.aria-label]=\"_intl.nextPageLabel\">\n <matcha-icon name=\"action_arrow_right\" size=\"md\"></matcha-icon>\n </button>\n </div>\n </div>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: MatchaIconComponent, selector: "matcha-icon", inputs: ["name", "size", "color", "class", "loading"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
7308
7308
|
}
|
|
7309
7309
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: MatchaPaginatorComponent, decorators: [{
|
|
7310
7310
|
type: Component,
|
|
7311
|
-
args: [{ selector: 'matcha-paginator', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"matcha-paginator flex-row flex-align-center gap-
|
|
7311
|
+
args: [{ selector: 'matcha-paginator', standalone: false, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"matcha-paginator flex-column flex-sm-row flex-align-center gap-16\">\n <!-- Total records information -->\n <div class=\"paginator-total-info flex-row flex-align-center min-h-32 gap-8\" *ngIf=\"showTotal\">\n <div class=\"total-range\">{{ getRangeLabel() }}</div>\n <div class=\"total-filtered\" *ngIf=\"hasFilteredResults\">{{ getFilteredLabel() }}</div>\n </div>\n\n <!-- Items per page selector -->\n <div class=\"flex-row flex-align-center min-h-32 gap-8\" *ngIf=\"pageSizeOptions && pageSizeOptions.length > 0\">\n <span class=\"text-sm color-placeholder\">{{ _intl.itemsPerPageLabel }}</span>\n <div class=\"page-size-selector\">\n <select \n class=\"page-size-select radius-8\" \n [value]=\"pageSize\" \n (change)=\"onPageSizeChange($event)\">\n <option *ngFor=\"let option of pageSizeOptions\" [value]=\"option\">\n {{ option }}\n </option>\n </select>\n <div class=\"select-icon\">\n <matcha-icon name=\"action_arrow_down\" size=\"sm\" color=\"fg\"></matcha-icon>\n </div>\n </div>\n </div>\n \n <!-- Page navigation -->\n <div class=\"flex-row flex-align-center min-h-32 gap-8\">\n <!-- Previous page button -->\n <button \n class=\"nav-button\" \n [disabled]=\"!hasPreviousPage\"\n (click)=\"previousPage()\"\n [attr.aria-label]=\"_intl.previousPageLabel\">\n <matcha-icon name=\"action_arrow_left\" size=\"md\"></matcha-icon>\n </button>\n \n <!-- Page numbers -->\n <div class=\"flex-row flex-align-center gap-4\">\n <ng-container *ngFor=\"let page of displayPages; trackBy: trackByPage\">\n <button \n *ngIf=\"isNumber(page); else ellipsis\"\n class=\"page-button radius-full\"\n [class.active]=\"page === currentPage\"\n [class.radius-full]=\"page === currentPage\"\n [ngClass]=\"page === currentPage ? color : ''\"\n (click)=\"goToPage(page)\"\n [attr.aria-label]=\"'Ir para p\u00E1gina ' + page\">\n {{ page }}\n </button>\n <ng-template #ellipsis>\n <span class=\"ellipsis\">{{ page }}</span>\n </ng-template>\n </ng-container>\n </div>\n \n <!-- Next page button -->\n <button \n class=\"nav-button\" \n [disabled]=\"!hasNextPage\"\n (click)=\"nextPage()\"\n [attr.aria-label]=\"_intl.nextPageLabel\">\n <matcha-icon name=\"action_arrow_right\" size=\"md\"></matcha-icon>\n </button>\n </div>\n </div>" }]
|
|
7312
7312
|
}], ctorParameters: () => [{ type: MatchaPaginatorIntl }, { type: i0.ChangeDetectorRef }], propDecorators: { pageIndex: [{
|
|
7313
7313
|
type: Input
|
|
7314
7314
|
}], length: [{
|