Paging details, like "1 - 20 of 100 results".

Example


import { PagingInfo } from "@elastic/react-search-ui";

...

<PagingInfo />

Properties

NameDescription
className
view
Used to override the default view for this Component. See View customization below.
*
Any other property passed will be passed through and available to use in a Custom View

View customization

A complete guide to view customization can be found in the Customization: Component views and HTML section.

The following properties are available in the view:

NameDescription
className
Passed through from main component.
end
Type: number. The position of the last result shown on this page of reuslts.
searchTerm
Type: string. The current search term.
start
Type: number. The position of the first result shown on this page of reuslts.
totalResults
Type: number. The total number of results.

See PagingInfo.tsx for an example.