Merge pull request #3076 from klaascuvelier/fix-3075-pagination-icon

fix 3075: remove hardcoded check in pagination select icon ngIf

Author: Akshat55

src/pagination/pagination.component.spec.ts

@@ -174,4 +174,22 @@ describe("Pagination", () => {
 		fixture.detectChanges();
 		expect(wrapper.pageOptions).toEqual(Array(1));
 	});
+
+	it("should replace the select with a number input when the pagination threshold is reached", () => {
+		const fixture = TestBed.createComponent(PaginationTest);
+		const wrapper = fixture.componentInstance;
+		fixture.detectChanges();
+		element = fixture.debugElement.query(By.css("cds-pagination"));
+
+		element.componentInstance.pageSelectThreshold = 500;
+		fixture.detectChanges();
+		expect(element.nativeElement.querySelector(".cds--select__page-number input")).toBe(null);
+		expect(element.nativeElement.querySelector(".cds--select__page-number select")).toBeDefined();
+
+		element.componentInstance.pageSelectThreshold = 2;
+		fixture.detectChanges();
+		expect(element.nativeElement.querySelector(".cds--select__page-number input")).toBeDefined();
+		expect(element.nativeElement.querySelector(".cds--select__page-number select")).toBe(null);
+
+	});
 });

src/pagination/pagination.component.ts

@@ -137,7 +137,7 @@ export interface PaginationTranslations {
 						<option *ngFor="let page of pageOptions; let i = index;" class="cds--select-option" [value]="i + 1">{{i + 1}}</option>
 					</select>
 					<svg
-						*ngIf="pageOptions.length <= 1000"
+						*ngIf="pageOptions.length <= pageSelectThreshold"
 						cdsIcon="chevron--down"
 						size="16"
 						style="display: inherit;"