From 64d69e43061aeeae649e484e09e07c329797467f Mon Sep 17 00:00:00 2001
From: adamviktora <viktora.adam@gmail.com>
Date: Thu, 1 Jun 2023 11:42:41 +0200
Subject: [PATCH 1/3] fix(Pagination): remove spin buttons

---
 .../src/components/Pagination/Navigation.tsx  | 27 ++++++++++---------
 1 file changed, 14 insertions(+), 13 deletions(-)

diff --git a/packages/react-core/src/components/Pagination/Navigation.tsx b/packages/react-core/src/components/Pagination/Navigation.tsx
index 487ccf0a681..e098691cf77 100644
--- a/packages/react-core/src/components/Pagination/Navigation.tsx
+++ b/packages/react-core/src/components/Pagination/Navigation.tsx
@@ -217,19 +217,20 @@ export class Navigation extends React.Component<NavigationProps, NavigationState
         </div>
         {!isCompact && (
           <div className={styles.paginationNavPageSelect}>
-            <input
-              className={css(styles.formControl)}
-              aria-label={currPageAriaLabel}
-              type="number"
-              disabled={
-                isDisabled || (itemCount && page === firstPage && page === lastPage && itemCount >= 0) || page === 0
-              }
-              min={lastPage <= 0 && firstPage <= 0 ? 0 : 1}
-              max={lastPage}
-              value={userInputPage}
-              onKeyDown={event => this.onKeyDown(event, page, lastPage, onPageInput)}
-              onChange={event => this.onChange(event, lastPage)}
-            />
+            <div className={css(styles.formControl)}>
+              <input
+                aria-label={currPageAriaLabel}
+                type="number"
+                disabled={
+                  isDisabled || (itemCount && page === firstPage && page === lastPage && itemCount >= 0) || page === 0
+                }
+                min={lastPage <= 0 && firstPage <= 0 ? 0 : 1}
+                max={lastPage}
+                value={userInputPage}
+                onKeyDown={event => this.onKeyDown(event, page, lastPage, onPageInput)}
+                onChange={event => this.onChange(event, lastPage)}
+              />
+            </div>
             {(itemCount || itemCount === 0) && (
               <span aria-hidden="true">
                 {ofWord} {pagesTitle ? pluralize(lastPage, pagesTitle, pagesTitlePlural) : lastPage}

From e4848d7fc947f7505b35c3bb5b946deabae80c45 Mon Sep 17 00:00:00 2001
From: adamviktora <viktora.adam@gmail.com>
Date: Thu, 1 Jun 2023 12:24:44 +0200
Subject: [PATCH 2/3] fix(Pagination): update snapshots and integration tests

---
 .../__snapshots__/Navigation.test.tsx.snap    |  17 +-
 .../__snapshots__/Pagination.test.tsx.snap    | 346 ++++++++++--------
 .../cypress/integration/pagination.spec.ts    |   2 +-
 3 files changed, 214 insertions(+), 151 deletions(-)

diff --git a/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap b/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
index 984689fe09e..b60f71b17b9 100644
--- a/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
+++ b/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
@@ -67,14 +67,17 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
     <div
       class="pf-v5-c-pagination__nav-page-select"
     >
-      <input
-        aria-label="Current page"
+      <div
         class="pf-v5-c-form-control"
-        max="0"
-        min="0"
-        type="number"
-        value="42"
-      />
+      >
+        <input
+          aria-label="Current page"
+          max="0"
+          min="0"
+          type="number"
+          value="42"
+        />
+      </div>
     </div>
     <div
       class="pf-v5-c-pagination__nav-control"
diff --git a/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap b/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
index b9ba9e31904..d9e38b85144 100644
--- a/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
+++ b/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
@@ -124,14 +124,17 @@ exports[`Pagination API verify inset2xl inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -315,14 +318,17 @@ exports[`Pagination API verify insetLg inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -506,14 +512,17 @@ exports[`Pagination API verify insetMd inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -697,14 +706,17 @@ exports[`Pagination API verify insetNone inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -888,14 +900,17 @@ exports[`Pagination API verify insetSm inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1079,14 +1094,17 @@ exports[`Pagination API verify insetXl inset breakpoints 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1256,14 +1274,17 @@ exports[`Pagination component render custom pagination toggle 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1451,14 +1472,17 @@ exports[`Pagination component render custom perPageOptions 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1644,14 +1668,17 @@ exports[`Pagination component render custom start end 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1798,14 +1825,17 @@ exports[`Pagination component render empty per page options 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1991,14 +2021,17 @@ exports[`Pagination component render last page 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="2"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="2"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2188,15 +2221,18 @@ exports[`Pagination component render limited number of pages 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          disabled=""
-          max="1"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            disabled=""
+            max="1"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2374,14 +2410,17 @@ exports[`Pagination component render should render correctly bottom 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2557,14 +2596,17 @@ exports[`Pagination component render should render correctly bottom sticky 1`] =
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2878,15 +2920,18 @@ exports[`Pagination component render should render correctly disabled 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          disabled=""
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            disabled=""
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3076,14 +3121,17 @@ exports[`Pagination component render should render correctly sticky 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3271,14 +3319,17 @@ exports[`Pagination component render should render correctly top 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="2"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3466,14 +3517,17 @@ exports[`Pagination component render titles 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3661,14 +3715,17 @@ exports[`Pagination component render up drop direction 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          max="4"
-          min="1"
-          type="number"
-          value="1"
-        />
+        >
+          <input
+            aria-label="Current page"
+            max="4"
+            min="1"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3856,15 +3913,18 @@ exports[`Pagination component render zero results 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
+        <div
           class="pf-v5-c-form-control"
-          disabled=""
-          max="0"
-          min="1"
-          type="number"
-          value="0"
-        />
+        >
+          <input
+            aria-label="Current page"
+            disabled=""
+            max="0"
+            min="1"
+            type="number"
+            value="0"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
diff --git a/packages/react-integration/cypress/integration/pagination.spec.ts b/packages/react-integration/cypress/integration/pagination.spec.ts
index e951ae2e5b9..cb82c0ece10 100644
--- a/packages/react-integration/cypress/integration/pagination.spec.ts
+++ b/packages/react-integration/cypress/integration/pagination.spec.ts
@@ -151,7 +151,7 @@ describe('Pagination Demo Test', () => {
                 .find('.pf-v5-c-menu-toggle__text')
                 .then((toggleText) => expect(toggleText).to.have.text('401 - 500 of 523 '));
               cy.get('.pagination-options-menu-default-fullpage')
-                .find('.pf-v5-c-form-control')
+                .find('.pf-v5-c-form-control input')
                 .then((currentPage) => expect(currentPage).to.have.value('5'));
             });
           });

From 620ab00aceb899462f3791a5de058f279717af1d Mon Sep 17 00:00:00 2001
From: Titani <tlabaj@redaht.com>
Date: Tue, 6 Jun 2023 16:54:06 -0400
Subject: [PATCH 3/3] use TextInput instead of input, change page type from
 deprecated type

---
 .../src/components/Pagination/Navigation.tsx  | 35 ++++----
 .../__snapshots__/Navigation.test.tsx.snap    |  4 +
 .../__snapshots__/Pagination.test.tsx.snap    | 86 ++++++++++++++++++-
 3 files changed, 104 insertions(+), 21 deletions(-)

diff --git a/packages/react-core/src/components/Pagination/Navigation.tsx b/packages/react-core/src/components/Pagination/Navigation.tsx
index e098691cf77..54516b60a34 100644
--- a/packages/react-core/src/components/Pagination/Navigation.tsx
+++ b/packages/react-core/src/components/Pagination/Navigation.tsx
@@ -6,6 +6,7 @@ import AngleDoubleLeftIcon from '@patternfly/react-icons/dist/esm/icons/angle-do
 import AngleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-right-icon';
 import AngleDoubleRightIcon from '@patternfly/react-icons/dist/esm/icons/angle-double-right-icon';
 import { Button, ButtonVariant } from '../Button';
+import { TextInput } from '../TextInput';
 import { OnSetPage } from './Pagination';
 import { pluralize, PickOptional } from '../../helpers';
 import { KeyTypes } from '../../helpers/constants';
@@ -28,7 +29,7 @@ export interface NavigationProps extends React.HTMLProps<HTMLElement> {
   /** Label for the English word "of". */
   ofWord?: string;
   /** The number of the current page. */
-  page: React.ReactText;
+  page: string | number;
   /** The title of a page displayed beside the page number. */
   pagesTitle?: string;
   /** The title of a page displayed beside the page number (the plural form). */
@@ -102,9 +103,9 @@ export class Navigation extends React.Component<NavigationProps, NavigationState
     return inputPage;
   }
 
-  private onChange(event: React.ChangeEvent<HTMLInputElement>, lastPage: number): void {
-    const inputPage = Navigation.parseInteger(event.target.value, lastPage);
-    this.setState({ userInputPage: Number.isNaN(inputPage as number) ? event.target.value : inputPage });
+  private onChange(event: React.FormEvent<HTMLInputElement>, lastPage: number): void {
+    const inputPage = Navigation.parseInteger(event.currentTarget.value, lastPage);
+    this.setState({ userInputPage: Number.isNaN(inputPage as number) ? event.currentTarget.value : inputPage });
   }
 
   private onKeyDown(
@@ -217,20 +218,18 @@ export class Navigation extends React.Component<NavigationProps, NavigationState
         </div>
         {!isCompact && (
           <div className={styles.paginationNavPageSelect}>
-            <div className={css(styles.formControl)}>
-              <input
-                aria-label={currPageAriaLabel}
-                type="number"
-                disabled={
-                  isDisabled || (itemCount && page === firstPage && page === lastPage && itemCount >= 0) || page === 0
-                }
-                min={lastPage <= 0 && firstPage <= 0 ? 0 : 1}
-                max={lastPage}
-                value={userInputPage}
-                onKeyDown={event => this.onKeyDown(event, page, lastPage, onPageInput)}
-                onChange={event => this.onChange(event, lastPage)}
-              />
-            </div>
+            <TextInput
+              aria-label={currPageAriaLabel}
+              type="number"
+              isDisabled={
+                isDisabled || (itemCount && page === firstPage && page === lastPage && itemCount >= 0) || page === 0
+              }
+              min={lastPage <= 0 && firstPage <= 0 ? 0 : 1}
+              max={lastPage}
+              value={userInputPage}
+              onKeyDown={event => this.onKeyDown(event, page, lastPage, onPageInput)}
+              onChange={event => this.onChange(event, lastPage)}
+            />
             {(itemCount || itemCount === 0) && (
               <span aria-hidden="true">
                 {ofWord} {pagesTitle ? pluralize(lastPage, pagesTitle, pagesTitlePlural) : lastPage}
diff --git a/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap b/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
index b60f71b17b9..26c2defb2c4 100644
--- a/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
+++ b/packages/react-core/src/components/Pagination/__tests__/Generated/__snapshots__/Navigation.test.tsx.snap
@@ -71,7 +71,11 @@ exports[`Navigation should match snapshot (auto-generated) 1`] = `
         class="pf-v5-c-form-control"
       >
         <input
+          aria-invalid="false"
           aria-label="Current page"
+          data-ouia-component-id="OUIA-Generated-TextInputBase-1"
+          data-ouia-component-type="PF4/TextInput"
+          data-ouia-safe="true"
           max="0"
           min="0"
           type="number"
diff --git a/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap b/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
index d9e38b85144..3c3f43fa3d6 100644
--- a/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
+++ b/packages/react-core/src/components/Pagination/__tests__/__snapshots__/Pagination.test.tsx.snap
@@ -128,7 +128,11 @@ exports[`Pagination API verify inset2xl inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-45"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -322,7 +326,11 @@ exports[`Pagination API verify insetLg inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-43"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -516,7 +524,11 @@ exports[`Pagination API verify insetMd inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-42"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -710,7 +722,11 @@ exports[`Pagination API verify insetNone inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-40"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -904,7 +920,11 @@ exports[`Pagination API verify insetSm inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-41"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -1098,7 +1118,11 @@ exports[`Pagination API verify insetXl inset breakpoints 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-44"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -1278,7 +1302,11 @@ exports[`Pagination component render custom pagination toggle 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-13"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -1476,7 +1504,11 @@ exports[`Pagination component render custom perPageOptions 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-9"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -1672,7 +1704,11 @@ exports[`Pagination component render custom start end 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-11"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -1829,7 +1865,11 @@ exports[`Pagination component render empty per page options 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-10"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -2025,7 +2065,11 @@ exports[`Pagination component render last page 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-8"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -2222,10 +2266,14 @@ exports[`Pagination component render limited number of pages 1`] = `
         class="pf-v5-c-pagination__nav-page-select"
       >
         <div
-          class="pf-v5-c-form-control"
+          class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-6"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             disabled=""
             max="1"
             min="1"
@@ -2414,7 +2462,11 @@ exports[`Pagination component render should render correctly bottom 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-2"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -2600,7 +2652,11 @@ exports[`Pagination component render should render correctly bottom sticky 1`] =
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-4"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -2921,10 +2977,14 @@ exports[`Pagination component render should render correctly disabled 1`] = `
         class="pf-v5-c-pagination__nav-page-select"
       >
         <div
-          class="pf-v5-c-form-control"
+          class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-5"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             disabled=""
             max="2"
             min="1"
@@ -3125,7 +3185,11 @@ exports[`Pagination component render should render correctly sticky 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-3"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -3323,7 +3387,11 @@ exports[`Pagination component render should render correctly top 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-1"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="2"
             min="1"
             type="number"
@@ -3521,7 +3589,11 @@ exports[`Pagination component render titles 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-12"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -3719,7 +3791,11 @@ exports[`Pagination component render up drop direction 1`] = `
           class="pf-v5-c-form-control"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-14"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             max="4"
             min="1"
             type="number"
@@ -3914,10 +3990,14 @@ exports[`Pagination component render zero results 1`] = `
         class="pf-v5-c-pagination__nav-page-select"
       >
         <div
-          class="pf-v5-c-form-control"
+          class="pf-v5-c-form-control pf-m-disabled"
         >
           <input
+            aria-invalid="false"
             aria-label="Current page"
+            data-ouia-component-id="OUIA-Generated-TextInputBase-7"
+            data-ouia-component-type="PF4/TextInput"
+            data-ouia-safe="true"
             disabled=""
             max="0"
             min="1"