diff --git a/packages/react-core/src/components/Pagination/Navigation.tsx b/packages/react-core/src/components/Pagination/Navigation.tsx
index 487ccf0a681..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,11 +218,10 @@ export class Navigation extends React.Component<NavigationProps, NavigationState
         </div>
         {!isCompact && (
           <div className={styles.paginationNavPageSelect}>
-            <input
-              className={css(styles.formControl)}
+            <TextInput
               aria-label={currPageAriaLabel}
               type="number"
-              disabled={
+              isDisabled={
                 isDisabled || (itemCount && page === firstPage && page === lastPage && itemCount >= 0) || page === 0
               }
               min={lastPage <= 0 && firstPage <= 0 ? 0 : 1}
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..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
@@ -67,14 +67,21 @@ 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-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"
+          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..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
@@ -124,14 +124,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -315,14 +322,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -506,14 +520,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -697,14 +718,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -888,14 +916,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1079,14 +1114,21 @@ 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-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"
+            value="1"
+          />
+        </div>
       </div>
       <div
         class="pf-v5-c-pagination__nav-control"
@@ -1256,14 +1298,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1451,14 +1500,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1644,14 +1700,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1798,14 +1861,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -1991,14 +2061,21 @@ 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-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"
+            value="2"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2188,15 +2265,22 @@ exports[`Pagination component render limited number of pages 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
-          class="pf-v5-c-form-control"
-          disabled=""
-          max="1"
-          min="1"
-          type="number"
-          value="1"
-        />
+        <div
+          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"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2374,14 +2458,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2557,14 +2648,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -2878,15 +2976,22 @@ exports[`Pagination component render should render correctly disabled 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
-          class="pf-v5-c-form-control"
-          disabled=""
-          max="2"
-          min="1"
-          type="number"
-          value="1"
-        />
+        <div
+          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"
+            type="number"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3076,14 +3181,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3271,14 +3383,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3466,14 +3585,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3661,14 +3787,21 @@ 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-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"
+            value="1"
+          />
+        </div>
         <span
           aria-hidden="true"
         >
@@ -3856,15 +3989,22 @@ exports[`Pagination component render zero results 1`] = `
       <div
         class="pf-v5-c-pagination__nav-page-select"
       >
-        <input
-          aria-label="Current page"
-          class="pf-v5-c-form-control"
-          disabled=""
-          max="0"
-          min="1"
-          type="number"
-          value="0"
-        />
+        <div
+          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"
+            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'));
             });
           });