Skip to content

Add support for numbered pagination#291

Merged
colinrotherham merged 4 commits intomainfrom
numbered-pagination
Oct 27, 2025
Merged

Add support for numbered pagination#291
colinrotherham merged 4 commits intomainfrom
numbered-pagination

Conversation

@colinrotherham
Copy link
Collaborator

This PR adds support for numbered pagination from NHS.UK frontend v10.1.0

To differentiate between pagination links (top level) versus pagination list items, this is a breaking change:

  <Pagination>
-   <Pagination.Link href="/section/treatments" previous>
-     Treatments
-   </Pagination.Link>
-   <Pagination.Link href="/section/symptoms" next>
-     Symptoms
-   </Pagination.Link>
+   <Pagination.Item labelText="Treatments" href="/section/treatments" previous />
+   <Pagination.Item labelText="Symptoms" href="/section/symptoms" next />
  </Pagination>

Which now means both types of pagination are supported:

Pagination (default)

<Pagination>
  <Pagination.Item href="/section/treatments" labelText="Treatments" previous />
  <Pagination.Item href="/section/symptoms" labelText="Symptoms" next />
</Pagination>

Pagination (numbered)

<Pagination>
  <Pagination.Link href="/results?page=1" previous />
  <Pagination.Item href="/results?page=1" number={1} />
  <Pagination.Item href="/results?page=2" number={2} current />
  <Pagination.Item href="/results?page=3" number={3} />
  <Pagination.Link href="/results?page=3" next />
</Pagination>

React numbered pagination

Base automatically changed from small-form-controls to main October 27, 2025 10:32
@sonarqubecloud
Copy link

Copy link
Collaborator

@JoshuaBates-NHS JoshuaBates-NHS left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

all good

@colinrotherham colinrotherham added this pull request to the merge queue Oct 27, 2025
Merged via the queue into main with commit ad8131a Oct 27, 2025
3 checks passed
@colinrotherham colinrotherham deleted the numbered-pagination branch October 27, 2025 11:04
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants