@fundamental-ngx/core 0.58.2-rc.0 → 0.58.2

package/fesm2022/fundamental-ngx-core-pagination.mjs

@@ -93,10 +93,10 @@ class PaginationService {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationService, decorators: [{
             type: Injectable
         }] });
 
@@ -350,10 +350,10 @@ class PaginationComponent {
             totalCount: this.totalItems
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationComponent, deps: [{ token: PaginationService }, { token: i0.ChangeDetectorRef }, { token: i2.LiveAnnouncer }, { token: FD_LANGUAGE }, { token: i3.RtlService, optional: true }, { token: i4.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: PaginationComponent, isStandalone: true, selector: "fd-pagination", inputs: { id: "id", mobile: ["mobile", "mobile", booleanAttribute], totalItems: "totalItems", currentPage: "currentPage", itemsPerPage: "itemsPerPage", itemsPerPageTemplate: "itemsPerPageTemplate", itemsPerPageOptions: "itemsPerPageOptions", displayTotalItems: "displayTotalItems", displayTextTemplate: "displayTextTemplate" }, outputs: { pageChangeStart: "pageChangeStart", itemsPerPageChange: "itemsPerPageChange" }, host: { properties: { "class.fd-pagination--mobile": "mobile", "class.fd-pagination--short": "_lastPage <= 9" }, classAttribute: "fd-pagination" }, providers: [PaginationService, contentDensityObserverProviders()], viewQueries: [{ propertyName: "_focusKeyManagerList", first: true, predicate: FocusKeyManagerListDirective, descendants: true }, { propertyName: "_pageInputElement", first: true, predicate: ["pageInputElement"], descendants: true, read: ElementRef }, { propertyName: "_currentPageElement", first: true, predicate: ["currentPageElement"], descendants: true, read: ElementRef }, { propertyName: "_focusKeyManagerItems", predicate: FocusKeyManagerItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (totalItems) {\n    @if (itemsPerPageTemplate || itemsPerPageOptions.length) {\n        <div class=\"fd-pagination__per-page\">\n            <!-- note, that we're checking for the length of \"itemsPerPageOptions\", but using \"_displayedPageSizeOptions\" as \"pageOptions\" -->\n            <!-- these 2 can be different, as \"_displayedPageSizeOptions\" may also include \"itemsPerPage\" if it's not included in options -->\n            <ng-template\n                [ngTemplateOutlet]=\"itemsPerPageTemplate || perPage\"\n                [ngTemplateOutletContext]=\"{ onSelect: _onChangePerPage, pageOptions: _displayedPageSizeOptions }\"\n            ></ng-template>\n        </div>\n    }\n    @if (totalItems >= itemsPerPage) {\n        <nav\n            fdkFocusKeyManagerList\n            orientation=\"horizontal\"\n            [skipPredicate]=\"skipItemPredicate\"\n            class=\"fd-pagination__nav\"\n            [attr.aria-label]=\"'corePagination.ariaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"displayTotalItems ? _totalPagesElementId : null\"\n        >\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-rewind\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.firstLabel' | fdTranslate\"\n                [title]=\"'corePagination.firstLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"goToFirstPage()\"\n                (keyup.enter)=\"goToFirstPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToFirstPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-left-arrow\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.previousLabel' | fdTranslate\"\n                [title]=\"'corePagination.previousLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"previousPage()\"\n                (keyup.enter)=\"previousPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"previousPage()\"\n            ></button>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesBeforeCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                #currentPageElement\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: currentPage }\"\n                class=\"fd-pagination__link is-active\"\n                [attr.aria-current]=\"true\"\n            >\n                {{ currentPage }}\n            </button>\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{ 'corePagination.labelBeforeInputMobile' | fdTranslate }}\n            </label>\n            <input\n                #pageInputElement\n                fdkFocusKeyManagerItem\n                fd-form-control\n                fdkOnlyDigits\n                required\n                size=\"1\"\n                min=\"1\"\n                type=\"number\"\n                [max]=\"_lastPage\"\n                [state]=\"currentPageModel.invalid ? 'error' : null\"\n                class=\"fd-pagination__input\"\n                #currentPageModel=\"ngModel\"\n                [ngModel]=\"currentPage\"\n                [ariaLabel]=\"\n                    'corePagination.inputAriaLabel' | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                \"\n                (keydown.enter)=\"goToPage(currentPageModel.value)\"\n                (keydown.space)=\"goToPage(currentPageModel.value)\"\n                (blur)=\"_restoreInputValue(currentPageModel)\"\n            />\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{\n                    'corePagination.labelAfterInputMobile'\n                        | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                }}\n            </label>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesAfterCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-right-arrow\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.nextLabel' | fdTranslate\"\n                [title]=\"'corePagination.nextLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"nextPage()\"\n                (keyup.enter)=\"nextPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"nextPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-forward\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.lastLabel' | fdTranslate\"\n                [title]=\"'corePagination.lastLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"goToLastPage()\"\n                (keyup.enter)=\"goToLastPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToLastPage()\"\n            ></button>\n        </nav>\n    }\n    @if (displayTotalItems) {\n        <span class=\"fd-pagination__total\" [attr.id]=\"_totalPagesElementId\">\n            <ng-template\n                [ngTemplateOutlet]=\"displayTextTemplate || total\"\n                [ngTemplateOutletContext]=\"{ showing: _currentShowing }\"\n            ></ng-template>\n        </span>\n    }\n}\n<ng-template #more>\n    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n</ng-template>\n<ng-template #total let-showing=\"showing\">\n    <span fd-form-label class=\"fd-pagination__total-label\">\n        {{ 'corePagination.totalResultsLabel' | fdTranslate: _currentShowing }}\n    </span>\n</ng-template>\n<ng-template #perPage let-pageOptions=\"pageOptions\">\n    <label fd-form-label class=\"fd-pagination__per-page-label\">\n        {{ 'corePagination.itemsPerPageLabel' | fdTranslate }}\n    </label>\n    <fd-select class=\"fd-pagination__per-page-select\" [value]=\"itemsPerPage\" (valueChange)=\"_onChangePerPage($event)\">\n        @for (option of pageOptions; track option) {\n            <li fd-option [value]=\"option\">{{ option }}</li>\n        }\n    </fd-select>\n</ng-template>\n", styles: [".fd-pagination{--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;height:2.75rem;justify-content:space-between;padding-block:0;padding-inline:1rem;width:100%}.fd-pagination:after,.fd-pagination:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__per-page{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-pagination__per-page:after,.fd-pagination__per-page:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__nav{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fdPagination_Elements_Spacing);margin-inline:auto}.fd-pagination__nav:after,.fd-pagination__nav:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-pagination__more:after,.fd-pagination__more:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more:before{content:\"...\";display:block;text-align:center;width:var(--fdPaginationMoreWidth)}.fd-pagination__more[class*=-compact],.fd-pagination__more[class*=-condensed],[class*=-compact] .fd-pagination__more:not([class*=-cozy]),[class*=-condensed] .fd-pagination__more:not([class*=-cozy]){--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width_Compact)}.fd-pagination .fd-pagination__input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;min-width:2.5rem;text-align:center;width:auto}.fd-pagination .fd-pagination__input::-webkit-inner-spin-button,.fd-pagination .fd-pagination__input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__label,.fd-pagination .fd-pagination__per-page-label{-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.fd-pagination .fd-pagination__label{display:none}.fd-pagination .fd-pagination__total-label{margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__link.is-focus,.fd-pagination .fd-pagination__link:focus{outline:none;z-index:5}.fd-pagination .fd-pagination__link.is-focus:after,.fd-pagination .fd-pagination__link:focus:after{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);border-radius:var(--fdButton_Focus_Border_Radius);content:\"\";display:block;inset:var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset);position:absolute}.fd-pagination .fd-pagination__link.is-focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link.is-focus.is-selected:after,.fd-pagination .fd-pagination__link:focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link:focus.is-selected:after{border-color:var(--fdButton_Outline_Contrast)}.fd-pagination .fd-pagination__link.is-active{display:none}.fd-pagination .fd-pagination__button [class*=sap-icon][dir=rtl],[dir=rtl] .fd-pagination .fd-pagination__button [class*=sap-icon]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fd-pagination .fd-pagination__button--mobile{display:none}.fd-pagination .fd-pagination__button.is-disabled,.fd-pagination .fd-pagination__button:disabled,.fd-pagination .fd-pagination__button[aria-disabled=true]{pointer-events:none}.fd-pagination--short .fd-pagination__link.is-active,.fd-pagination--short .fd-pagination__link:active{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--short .fd-pagination__input{display:none}.fd-pagination--mobile .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination--mobile .fd-pagination__link,.fd-pagination--mobile .fd-pagination__more,.fd-pagination--mobile .fd-pagination__per-page-label,.fd-pagination--mobile .fd-pagination__total{display:none}.fd-pagination--mobile .fd-pagination__button--mobile,.fd-pagination--mobile .fd-pagination__input,.fd-pagination--mobile .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--mobile .fd-pagination__link.is-active,.fd-pagination--mobile .fd-pagination__link:active{display:none}@media(width<=599px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}@media(width>=600px)and (width<=1023px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.fd-pagination__label .fd-form-label,.fd-pagination__total-label .fd-form-label{margin:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/pagination.css:\n  (*!\n   * Fundamental Library Styles v0.40.1\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusKeyManagerListDirective, selector: "[fdkFocusKeyManagerList]", inputs: ["orientation", "skipPredicate"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: FocusKeyManagerItemDirective, selector: "[fdkFocusKeyManagerItem]", inputs: ["initialFocus", "_tabindex"] }, { kind: "component", type: FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i5.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: OnlyDigitsDirective, selector: "[fdkOnlyDigits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "component", type: SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "textOverflow", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None, preserveWhitespaces: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationComponent, deps: [{ token: PaginationService }, { token: i0.ChangeDetectorRef }, { token: i2.LiveAnnouncer }, { token: FD_LANGUAGE }, { token: i3.RtlService, optional: true }, { token: i4.ContentDensityObserver }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: PaginationComponent, isStandalone: true, selector: "fd-pagination", inputs: { id: "id", mobile: ["mobile", "mobile", booleanAttribute], totalItems: "totalItems", currentPage: "currentPage", itemsPerPage: "itemsPerPage", itemsPerPageTemplate: "itemsPerPageTemplate", itemsPerPageOptions: "itemsPerPageOptions", displayTotalItems: "displayTotalItems", displayTextTemplate: "displayTextTemplate" }, outputs: { pageChangeStart: "pageChangeStart", itemsPerPageChange: "itemsPerPageChange" }, host: { properties: { "class.fd-pagination--mobile": "mobile", "class.fd-pagination--short": "_lastPage <= 9" }, classAttribute: "fd-pagination" }, providers: [PaginationService, contentDensityObserverProviders()], viewQueries: [{ propertyName: "_focusKeyManagerList", first: true, predicate: FocusKeyManagerListDirective, descendants: true }, { propertyName: "_pageInputElement", first: true, predicate: ["pageInputElement"], descendants: true, read: ElementRef }, { propertyName: "_currentPageElement", first: true, predicate: ["currentPageElement"], descendants: true, read: ElementRef }, { propertyName: "_focusKeyManagerItems", predicate: FocusKeyManagerItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (totalItems) {\n    @if (itemsPerPageTemplate || itemsPerPageOptions.length) {\n        <div class=\"fd-pagination__per-page\">\n            <!-- note, that we're checking for the length of \"itemsPerPageOptions\", but using \"_displayedPageSizeOptions\" as \"pageOptions\" -->\n            <!-- these 2 can be different, as \"_displayedPageSizeOptions\" may also include \"itemsPerPage\" if it's not included in options -->\n            <ng-template\n                [ngTemplateOutlet]=\"itemsPerPageTemplate || perPage\"\n                [ngTemplateOutletContext]=\"{ onSelect: _onChangePerPage, pageOptions: _displayedPageSizeOptions }\"\n            ></ng-template>\n        </div>\n    }\n    @if (totalItems >= itemsPerPage) {\n        <nav\n            fdkFocusKeyManagerList\n            orientation=\"horizontal\"\n            [skipPredicate]=\"skipItemPredicate\"\n            class=\"fd-pagination__nav\"\n            [attr.aria-label]=\"'corePagination.ariaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"displayTotalItems ? _totalPagesElementId : null\"\n        >\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-rewind\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.firstLabel' | fdTranslate\"\n                [title]=\"'corePagination.firstLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"goToFirstPage()\"\n                (keyup.enter)=\"goToFirstPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToFirstPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-left-arrow\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.previousLabel' | fdTranslate\"\n                [title]=\"'corePagination.previousLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"previousPage()\"\n                (keyup.enter)=\"previousPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"previousPage()\"\n            ></button>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesBeforeCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                #currentPageElement\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: currentPage }\"\n                class=\"fd-pagination__link is-active\"\n                [attr.aria-current]=\"true\"\n            >\n                {{ currentPage }}\n            </button>\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{ 'corePagination.labelBeforeInputMobile' | fdTranslate }}\n            </label>\n            <input\n                #pageInputElement\n                fdkFocusKeyManagerItem\n                fd-form-control\n                fdkOnlyDigits\n                required\n                size=\"1\"\n                min=\"1\"\n                type=\"number\"\n                [max]=\"_lastPage\"\n                [state]=\"currentPageModel.invalid ? 'error' : null\"\n                class=\"fd-pagination__input\"\n                #currentPageModel=\"ngModel\"\n                [ngModel]=\"currentPage\"\n                [ariaLabel]=\"\n                    'corePagination.inputAriaLabel' | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                \"\n                (keydown.enter)=\"goToPage(currentPageModel.value)\"\n                (keydown.space)=\"goToPage(currentPageModel.value)\"\n                (blur)=\"_restoreInputValue(currentPageModel)\"\n            />\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{\n                    'corePagination.labelAfterInputMobile'\n                        | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                }}\n            </label>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesAfterCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-right-arrow\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.nextLabel' | fdTranslate\"\n                [title]=\"'corePagination.nextLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"nextPage()\"\n                (keyup.enter)=\"nextPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"nextPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-forward\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.lastLabel' | fdTranslate\"\n                [title]=\"'corePagination.lastLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"goToLastPage()\"\n                (keyup.enter)=\"goToLastPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToLastPage()\"\n            ></button>\n        </nav>\n    }\n    @if (displayTotalItems) {\n        <span class=\"fd-pagination__total\" [attr.id]=\"_totalPagesElementId\">\n            <ng-template\n                [ngTemplateOutlet]=\"displayTextTemplate || total\"\n                [ngTemplateOutletContext]=\"{ showing: _currentShowing }\"\n            ></ng-template>\n        </span>\n    }\n}\n<ng-template #more>\n    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n</ng-template>\n<ng-template #total let-showing=\"showing\">\n    <span fd-form-label class=\"fd-pagination__total-label\">\n        {{ 'corePagination.totalResultsLabel' | fdTranslate: _currentShowing }}\n    </span>\n</ng-template>\n<ng-template #perPage let-pageOptions=\"pageOptions\">\n    <label fd-form-label class=\"fd-pagination__per-page-label\">\n        {{ 'corePagination.itemsPerPageLabel' | fdTranslate }}\n    </label>\n    <fd-select class=\"fd-pagination__per-page-select\" [value]=\"itemsPerPage\" (valueChange)=\"_onChangePerPage($event)\">\n        @for (option of pageOptions; track option) {\n            <li fd-option [value]=\"option\">{{ option }}</li>\n        }\n    </fd-select>\n</ng-template>\n", styles: [".fd-pagination{--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;height:2.75rem;justify-content:space-between;padding-block:0;padding-inline:1rem;width:100%}.fd-pagination:after,.fd-pagination:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__per-page{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-pagination__per-page:after,.fd-pagination__per-page:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__nav{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fdPagination_Elements_Spacing);margin-inline:auto}.fd-pagination__nav:after,.fd-pagination__nav:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-pagination__more:after,.fd-pagination__more:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more:before{content:\"...\";display:block;text-align:center;width:var(--fdPaginationMoreWidth)}.fd-pagination__more[class*=-compact],.fd-pagination__more[class*=-condensed],[class*=-compact] .fd-pagination__more:not([class*=-cozy]),[class*=-condensed] .fd-pagination__more:not([class*=-cozy]){--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width_Compact)}.fd-pagination .fd-pagination__input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;min-width:2.5rem;text-align:center;width:auto}.fd-pagination .fd-pagination__input::-webkit-inner-spin-button,.fd-pagination .fd-pagination__input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__label,.fd-pagination .fd-pagination__per-page-label{-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.fd-pagination .fd-pagination__label{display:none}.fd-pagination .fd-pagination__total-label{margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__link.is-focus,.fd-pagination .fd-pagination__link:focus{outline:none;z-index:5}.fd-pagination .fd-pagination__link.is-focus:after,.fd-pagination .fd-pagination__link:focus:after{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);border-radius:var(--fdButton_Focus_Border_Radius);content:\"\";display:block;inset:var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset);position:absolute}.fd-pagination .fd-pagination__link.is-focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link.is-focus.is-selected:after,.fd-pagination .fd-pagination__link:focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link:focus.is-selected:after{border-color:var(--fdButton_Outline_Contrast)}.fd-pagination .fd-pagination__link.is-active{display:none}.fd-pagination .fd-pagination__button [class*=sap-icon][dir=rtl],[dir=rtl] .fd-pagination .fd-pagination__button [class*=sap-icon]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fd-pagination .fd-pagination__button--mobile{display:none}.fd-pagination .fd-pagination__button.is-disabled,.fd-pagination .fd-pagination__button:disabled,.fd-pagination .fd-pagination__button[aria-disabled=true]{pointer-events:none}.fd-pagination--short .fd-pagination__link.is-active,.fd-pagination--short .fd-pagination__link:active{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--short .fd-pagination__input{display:none}.fd-pagination--mobile .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination--mobile .fd-pagination__link,.fd-pagination--mobile .fd-pagination__more,.fd-pagination--mobile .fd-pagination__per-page-label,.fd-pagination--mobile .fd-pagination__total{display:none}.fd-pagination--mobile .fd-pagination__button--mobile,.fd-pagination--mobile .fd-pagination__input,.fd-pagination--mobile .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--mobile .fd-pagination__link.is-active,.fd-pagination--mobile .fd-pagination__link:active{display:none}@media(max-width:599px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}@media(min-width:600px)and (max-width:1023px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.fd-pagination__label .fd-form-label,.fd-pagination__total-label .fd-form-label{margin:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/pagination.css:\n  (*!\n   * Fundamental Library Styles v0.40.1\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusKeyManagerListDirective, selector: "[fdkFocusKeyManagerList]", inputs: ["orientation", "skipPredicate"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: FocusKeyManagerItemDirective, selector: "[fdkFocusKeyManagerItem]", inputs: ["initialFocus", "_tabindex"] }, { kind: "component", type: FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i5.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i5.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: OnlyDigitsDirective, selector: "[fdkOnlyDigits]", inputs: ["decimal", "decimalSeparator"] }, { kind: "component", type: SelectComponent, selector: "fd-select", inputs: ["extendedBodyTemplate", "scrollStrategy", "textOverflow", "controlId", "state", "mobile", "stateMessage", "disabled", "required", "readonly", "placeholder", "value", "maxHeight", "glyph", "glyphFont", "closeOnOutsideClick", "fillControlMode", "controlTemplate", "appendTo", "unselectMissingOption", "typeaheadDebounceInterval", "ariaLabelledBy", "ariaLabel", "mobileConfig", "inline", "selectControlClass", "selectDropdownButtonClass", "advancedStateMessage", "tabOutStrategy", "compareWith"], outputs: ["isOpenChange", "valueChange"] }, { kind: "component", type: OptionComponent, selector: "[fd-option], fd-option", inputs: ["id", "value", "disabled"], outputs: ["selectionChange"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None, preserveWhitespaces: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'fd-pagination', providers: [PaginationService, contentDensityObserverProviders()], host: {
                         class: 'fd-pagination',
@@ -371,7 +371,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
                         SelectComponent,
                         OptionComponent,
                         FdTranslatePipe
-                    ], template: "@if (totalItems) {\n    @if (itemsPerPageTemplate || itemsPerPageOptions.length) {\n        <div class=\"fd-pagination__per-page\">\n            <!-- note, that we're checking for the length of \"itemsPerPageOptions\", but using \"_displayedPageSizeOptions\" as \"pageOptions\" -->\n            <!-- these 2 can be different, as \"_displayedPageSizeOptions\" may also include \"itemsPerPage\" if it's not included in options -->\n            <ng-template\n                [ngTemplateOutlet]=\"itemsPerPageTemplate || perPage\"\n                [ngTemplateOutletContext]=\"{ onSelect: _onChangePerPage, pageOptions: _displayedPageSizeOptions }\"\n            ></ng-template>\n        </div>\n    }\n    @if (totalItems >= itemsPerPage) {\n        <nav\n            fdkFocusKeyManagerList\n            orientation=\"horizontal\"\n            [skipPredicate]=\"skipItemPredicate\"\n            class=\"fd-pagination__nav\"\n            [attr.aria-label]=\"'corePagination.ariaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"displayTotalItems ? _totalPagesElementId : null\"\n        >\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-rewind\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.firstLabel' | fdTranslate\"\n                [title]=\"'corePagination.firstLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"goToFirstPage()\"\n                (keyup.enter)=\"goToFirstPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToFirstPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-left-arrow\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.previousLabel' | fdTranslate\"\n                [title]=\"'corePagination.previousLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"previousPage()\"\n                (keyup.enter)=\"previousPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"previousPage()\"\n            ></button>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesBeforeCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                #currentPageElement\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: currentPage }\"\n                class=\"fd-pagination__link is-active\"\n                [attr.aria-current]=\"true\"\n            >\n                {{ currentPage }}\n            </button>\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{ 'corePagination.labelBeforeInputMobile' | fdTranslate }}\n            </label>\n            <input\n                #pageInputElement\n                fdkFocusKeyManagerItem\n                fd-form-control\n                fdkOnlyDigits\n                required\n                size=\"1\"\n                min=\"1\"\n                type=\"number\"\n                [max]=\"_lastPage\"\n                [state]=\"currentPageModel.invalid ? 'error' : null\"\n                class=\"fd-pagination__input\"\n                #currentPageModel=\"ngModel\"\n                [ngModel]=\"currentPage\"\n                [ariaLabel]=\"\n                    'corePagination.inputAriaLabel' | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                \"\n                (keydown.enter)=\"goToPage(currentPageModel.value)\"\n                (keydown.space)=\"goToPage(currentPageModel.value)\"\n                (blur)=\"_restoreInputValue(currentPageModel)\"\n            />\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{\n                    'corePagination.labelAfterInputMobile'\n                        | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                }}\n            </label>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesAfterCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-right-arrow\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.nextLabel' | fdTranslate\"\n                [title]=\"'corePagination.nextLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"nextPage()\"\n                (keyup.enter)=\"nextPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"nextPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-forward\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.lastLabel' | fdTranslate\"\n                [title]=\"'corePagination.lastLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"goToLastPage()\"\n                (keyup.enter)=\"goToLastPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToLastPage()\"\n            ></button>\n        </nav>\n    }\n    @if (displayTotalItems) {\n        <span class=\"fd-pagination__total\" [attr.id]=\"_totalPagesElementId\">\n            <ng-template\n                [ngTemplateOutlet]=\"displayTextTemplate || total\"\n                [ngTemplateOutletContext]=\"{ showing: _currentShowing }\"\n            ></ng-template>\n        </span>\n    }\n}\n<ng-template #more>\n    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n</ng-template>\n<ng-template #total let-showing=\"showing\">\n    <span fd-form-label class=\"fd-pagination__total-label\">\n        {{ 'corePagination.totalResultsLabel' | fdTranslate: _currentShowing }}\n    </span>\n</ng-template>\n<ng-template #perPage let-pageOptions=\"pageOptions\">\n    <label fd-form-label class=\"fd-pagination__per-page-label\">\n        {{ 'corePagination.itemsPerPageLabel' | fdTranslate }}\n    </label>\n    <fd-select class=\"fd-pagination__per-page-select\" [value]=\"itemsPerPage\" (valueChange)=\"_onChangePerPage($event)\">\n        @for (option of pageOptions; track option) {\n            <li fd-option [value]=\"option\">{{ option }}</li>\n        }\n    </fd-select>\n</ng-template>\n", styles: [".fd-pagination{--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;height:2.75rem;justify-content:space-between;padding-block:0;padding-inline:1rem;width:100%}.fd-pagination:after,.fd-pagination:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__per-page{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-pagination__per-page:after,.fd-pagination__per-page:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__nav{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fdPagination_Elements_Spacing);margin-inline:auto}.fd-pagination__nav:after,.fd-pagination__nav:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-pagination__more:after,.fd-pagination__more:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more:before{content:\"...\";display:block;text-align:center;width:var(--fdPaginationMoreWidth)}.fd-pagination__more[class*=-compact],.fd-pagination__more[class*=-condensed],[class*=-compact] .fd-pagination__more:not([class*=-cozy]),[class*=-condensed] .fd-pagination__more:not([class*=-cozy]){--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width_Compact)}.fd-pagination .fd-pagination__input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;min-width:2.5rem;text-align:center;width:auto}.fd-pagination .fd-pagination__input::-webkit-inner-spin-button,.fd-pagination .fd-pagination__input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__label,.fd-pagination .fd-pagination__per-page-label{-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.fd-pagination .fd-pagination__label{display:none}.fd-pagination .fd-pagination__total-label{margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__link.is-focus,.fd-pagination .fd-pagination__link:focus{outline:none;z-index:5}.fd-pagination .fd-pagination__link.is-focus:after,.fd-pagination .fd-pagination__link:focus:after{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);border-radius:var(--fdButton_Focus_Border_Radius);content:\"\";display:block;inset:var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset);position:absolute}.fd-pagination .fd-pagination__link.is-focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link.is-focus.is-selected:after,.fd-pagination .fd-pagination__link:focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link:focus.is-selected:after{border-color:var(--fdButton_Outline_Contrast)}.fd-pagination .fd-pagination__link.is-active{display:none}.fd-pagination .fd-pagination__button [class*=sap-icon][dir=rtl],[dir=rtl] .fd-pagination .fd-pagination__button [class*=sap-icon]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fd-pagination .fd-pagination__button--mobile{display:none}.fd-pagination .fd-pagination__button.is-disabled,.fd-pagination .fd-pagination__button:disabled,.fd-pagination .fd-pagination__button[aria-disabled=true]{pointer-events:none}.fd-pagination--short .fd-pagination__link.is-active,.fd-pagination--short .fd-pagination__link:active{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--short .fd-pagination__input{display:none}.fd-pagination--mobile .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination--mobile .fd-pagination__link,.fd-pagination--mobile .fd-pagination__more,.fd-pagination--mobile .fd-pagination__per-page-label,.fd-pagination--mobile .fd-pagination__total{display:none}.fd-pagination--mobile .fd-pagination__button--mobile,.fd-pagination--mobile .fd-pagination__input,.fd-pagination--mobile .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--mobile .fd-pagination__link.is-active,.fd-pagination--mobile .fd-pagination__link:active{display:none}@media(width<=599px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}@media(width>=600px)and (width<=1023px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.fd-pagination__label .fd-form-label,.fd-pagination__total-label .fd-form-label{margin:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/pagination.css:\n  (*!\n   * Fundamental Library Styles v0.40.1\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
+                    ], template: "@if (totalItems) {\n    @if (itemsPerPageTemplate || itemsPerPageOptions.length) {\n        <div class=\"fd-pagination__per-page\">\n            <!-- note, that we're checking for the length of \"itemsPerPageOptions\", but using \"_displayedPageSizeOptions\" as \"pageOptions\" -->\n            <!-- these 2 can be different, as \"_displayedPageSizeOptions\" may also include \"itemsPerPage\" if it's not included in options -->\n            <ng-template\n                [ngTemplateOutlet]=\"itemsPerPageTemplate || perPage\"\n                [ngTemplateOutletContext]=\"{ onSelect: _onChangePerPage, pageOptions: _displayedPageSizeOptions }\"\n            ></ng-template>\n        </div>\n    }\n    @if (totalItems >= itemsPerPage) {\n        <nav\n            fdkFocusKeyManagerList\n            orientation=\"horizontal\"\n            [skipPredicate]=\"skipItemPredicate\"\n            class=\"fd-pagination__nav\"\n            [attr.aria-label]=\"'corePagination.ariaLabel' | fdTranslate\"\n            [attr.aria-labelledby]=\"displayTotalItems ? _totalPagesElementId : null\"\n        >\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-rewind\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.firstLabel' | fdTranslate\"\n                [title]=\"'corePagination.firstLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"goToFirstPage()\"\n                (keyup.enter)=\"goToFirstPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToFirstPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-left-arrow\"\n                [disabled]=\"isFirstPage\"\n                [ariaLabel]=\"'corePagination.previousLabel' | fdTranslate\"\n                [title]=\"'corePagination.previousLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isFirstPage\"\n                (click)=\"previousPage()\"\n                (keyup.enter)=\"previousPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"previousPage()\"\n            ></button>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesBeforeCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                #currentPageElement\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: currentPage }\"\n                class=\"fd-pagination__link is-active\"\n                [attr.aria-current]=\"true\"\n            >\n                {{ currentPage }}\n            </button>\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{ 'corePagination.labelBeforeInputMobile' | fdTranslate }}\n            </label>\n            <input\n                #pageInputElement\n                fdkFocusKeyManagerItem\n                fd-form-control\n                fdkOnlyDigits\n                required\n                size=\"1\"\n                min=\"1\"\n                type=\"number\"\n                [max]=\"_lastPage\"\n                [state]=\"currentPageModel.invalid ? 'error' : null\"\n                class=\"fd-pagination__input\"\n                #currentPageModel=\"ngModel\"\n                [ngModel]=\"currentPage\"\n                [ariaLabel]=\"\n                    'corePagination.inputAriaLabel' | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                \"\n                (keydown.enter)=\"goToPage(currentPageModel.value)\"\n                (keydown.space)=\"goToPage(currentPageModel.value)\"\n                (blur)=\"_restoreInputValue(currentPageModel)\"\n            />\n            <label fd-form-label class=\"fd-pagination__label\">\n                {{\n                    'corePagination.labelAfterInputMobile'\n                        | fdTranslate: { pageNumber: currentPage, totalCount: _totalPages }\n                }}\n            </label>\n            <!-- Duplicated to preserve the items order for keyboard navigation -->\n            @for (page of _pagesAfterCurrent; track page) {\n                @if (page !== _moreElementValue) {\n                    <button\n                        fdkFocusKeyManagerItem\n                        fd-button\n                        fdType=\"transparent\"\n                        [ariaLabel]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        [title]=\"'corePagination.pageLabel' | fdTranslate: { pageNumber: page }\"\n                        class=\"fd-pagination__link\"\n                        (click)=\"goToPage(page)\"\n                        (keyup.enter)=\"goToPage(page, $event)\"\n                        (keydown.space)=\"$event.preventDefault()\"\n                        (keyup.space)=\"goToPage(page, $event)\"\n                    >\n                        {{ page }}\n                    </button>\n                } @else {\n                    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n                }\n            }\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"navigation-right-arrow\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.nextLabel' | fdTranslate\"\n                [title]=\"'corePagination.nextLabel' | fdTranslate\"\n                class=\"fd-pagination__button\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"nextPage()\"\n                (keyup.enter)=\"nextPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"nextPage()\"\n            ></button>\n            <button\n                fdkFocusKeyManagerItem\n                fd-button\n                fdType=\"transparent\"\n                glyph=\"media-forward\"\n                [disabled]=\"isLastPage\"\n                [ariaLabel]=\"'corePagination.lastLabel' | fdTranslate\"\n                [title]=\"'corePagination.lastLabel' | fdTranslate\"\n                class=\"fd-pagination__button fd-pagination__button--mobile\"\n                [attr.aria-disabled]=\"isLastPage\"\n                (click)=\"goToLastPage()\"\n                (keyup.enter)=\"goToLastPage()\"\n                (keydown.space)=\"$event.preventDefault()\"\n                (keyup.space)=\"goToLastPage()\"\n            ></button>\n        </nav>\n    }\n    @if (displayTotalItems) {\n        <span class=\"fd-pagination__total\" [attr.id]=\"_totalPagesElementId\">\n            <ng-template\n                [ngTemplateOutlet]=\"displayTextTemplate || total\"\n                [ngTemplateOutletContext]=\"{ showing: _currentShowing }\"\n            ></ng-template>\n        </span>\n    }\n}\n<ng-template #more>\n    <span class=\"fd-pagination__more\" aria-hidden=\"true\" aria-label=\"...\" role=\"presentation\"></span>\n</ng-template>\n<ng-template #total let-showing=\"showing\">\n    <span fd-form-label class=\"fd-pagination__total-label\">\n        {{ 'corePagination.totalResultsLabel' | fdTranslate: _currentShowing }}\n    </span>\n</ng-template>\n<ng-template #perPage let-pageOptions=\"pageOptions\">\n    <label fd-form-label class=\"fd-pagination__per-page-label\">\n        {{ 'corePagination.itemsPerPageLabel' | fdTranslate }}\n    </label>\n    <fd-select class=\"fd-pagination__per-page-select\" [value]=\"itemsPerPage\" (valueChange)=\"_onChangePerPage($event)\">\n        @for (option of pageOptions; track option) {\n            <li fd-option [value]=\"option\">{{ option }}</li>\n        }\n    </fd-select>\n</ng-template>\n", styles: [".fd-pagination{--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width);border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;height:2.75rem;justify-content:space-between;padding-block:0;padding-inline:1rem;width:100%}.fd-pagination:after,.fd-pagination:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__per-page{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-pagination__per-page:after,.fd-pagination__per-page:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__nav{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:var(--fdPagination_Elements_Spacing);margin-inline:auto}.fd-pagination__nav:after,.fd-pagination__nav:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-pagination__more:after,.fd-pagination__more:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-pagination__more:before{content:\"...\";display:block;text-align:center;width:var(--fdPaginationMoreWidth)}.fd-pagination__more[class*=-compact],.fd-pagination__more[class*=-condensed],[class*=-compact] .fd-pagination__more:not([class*=-cozy]),[class*=-condensed] .fd-pagination__more:not([class*=-cozy]){--fdPaginationMoreWidth:var(--fdPagination_Placeholder_Dots_Width_Compact)}.fd-pagination .fd-pagination__input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;min-width:2.5rem;text-align:center;width:auto}.fd-pagination .fd-pagination__input::-webkit-inner-spin-button,.fd-pagination .fd-pagination__input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__label,.fd-pagination .fd-pagination__per-page-label{-ms-flex-negative:0;flex-shrink:0;-ms-flex-item-align:center;align-self:center}.fd-pagination .fd-pagination__label{display:none}.fd-pagination .fd-pagination__total-label{margin-block:0;margin-inline:0}.fd-pagination .fd-pagination__link.is-focus,.fd-pagination .fd-pagination__link:focus{outline:none;z-index:5}.fd-pagination .fd-pagination__link.is-focus:after,.fd-pagination .fd-pagination__link:focus:after{border:var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);border-radius:var(--fdButton_Focus_Border_Radius);content:\"\";display:block;inset:var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset) var(--fdButton_Outline_Offset);position:absolute}.fd-pagination .fd-pagination__link.is-focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link.is-focus.is-selected:after,.fd-pagination .fd-pagination__link:focus.fd-button--toggled:after,.fd-pagination .fd-pagination__link:focus.is-selected:after{border-color:var(--fdButton_Outline_Contrast)}.fd-pagination .fd-pagination__link.is-active{display:none}.fd-pagination .fd-pagination__button [class*=sap-icon][dir=rtl],[dir=rtl] .fd-pagination .fd-pagination__button [class*=sap-icon]{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.fd-pagination .fd-pagination__button--mobile{display:none}.fd-pagination .fd-pagination__button.is-disabled,.fd-pagination .fd-pagination__button:disabled,.fd-pagination .fd-pagination__button[aria-disabled=true]{pointer-events:none}.fd-pagination--short .fd-pagination__link.is-active,.fd-pagination--short .fd-pagination__link:active{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--short .fd-pagination__input{display:none}.fd-pagination--mobile .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination--mobile .fd-pagination__link,.fd-pagination--mobile .fd-pagination__more,.fd-pagination--mobile .fd-pagination__per-page-label,.fd-pagination--mobile .fd-pagination__total{display:none}.fd-pagination--mobile .fd-pagination__button--mobile,.fd-pagination--mobile .fd-pagination__input,.fd-pagination--mobile .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination--mobile .fd-pagination__link.is-active,.fd-pagination--mobile .fd-pagination__link:active{display:none}@media(max-width:599px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}@media(min-width:600px)and (max-width:1023px){.fd-pagination .fd-pagination__per-page+.fd-pagination__nav{margin-inline:auto 0}.fd-pagination .fd-pagination__link,.fd-pagination .fd-pagination__more,.fd-pagination .fd-pagination__per-page-label,.fd-pagination .fd-pagination__total{display:none}.fd-pagination .fd-pagination__button--mobile,.fd-pagination .fd-pagination__input,.fd-pagination .fd-pagination__label{display:-webkit-box;display:-ms-flexbox;display:flex}.fd-pagination .fd-pagination__link.is-active,.fd-pagination .fd-pagination__link:active{display:none}}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}[dir=rtl] .cdk-visually-hidden{left:auto;right:0}.fd-pagination__label .fd-form-label,.fd-pagination__total-label .fd-form-label{margin:0}\n/*! Bundled license information:\n\nfundamental-styles/dist/pagination.css:\n  (*!\n   * Fundamental Library Styles v0.40.1\n   * Copyright (c) 2025 SAP SE or an SAP affiliate company.\n   * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n   *)\n*/\n"] }]
         }], ctorParameters: () => [{ type: PaginationService }, { type: i0.ChangeDetectorRef }, { type: i2.LiveAnnouncer }, { type: i6.Observable, decorators: [{
                     type: Inject,
                     args: [FD_LANGUAGE]
@@ -419,11 +419,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
  * Use direct imports of components and directives.
  */
 class PaginationModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.0", ngImport: i0, type: PaginationModule, imports: [PaginationComponent], exports: [PaginationComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationModule, imports: [PaginationComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.4", ngImport: i0, type: PaginationModule, imports: [PaginationComponent], exports: [PaginationComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationModule, imports: [PaginationComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: PaginationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: PaginationModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [PaginationComponent],