# Configuration
You can change the defined props and set them to your desired values to achieve your customized pagination. Find the available props in the below table.
Required props and type of each prop are shown with required and Number badges, respectively.
Name | Default value | Description |
---|---|---|
totalItemsCount | - | Number required The total number of rows (items) in your table. The Min value is 0. |
itemsPerPage | - | Number required The number of rows (items) that will be shown in each page of the table. The Min value is 1. |
siblingCount | 2 | Number The number of digits to display either side of current page. The Min value is 1. |
currentPage | 1 | Number required The current page number. The Min value is 1. |
hasFirstLastButtons | true | Boolean Defines if the pagination component should have the go to first and go to last pages icons. |
hasNextPrevButtons | true | Boolean Defines if the pagination component should have the previous and next pages icons. |
theme | basic | String Defines the pagination theme. The available themes are: basic , rounded , and outlined . While the basic theme has no background for pages numbers, the other two themes set background color. The rounded theme sets the fully rounded (circle) background, but the outlined theme sets a background with curvy corners. |
disabledColor | #a8a8a8 | String The color for disabled icons. |
iconColor | #000 | String The color for active icons. |
activeColor | #000 | String The color of active pages numbers. |
activeBorderColor | transparent | String The border color of active pages. It would only be added if you choose one of the rounded and outlined themes. |
activeBackgroundColor | transparent | String The background color of active pages. It would only be added if you choose one of the rounded and outlined themes. |
inactiveColor | #acacac | String The color of inactive pages numbers. |
inactiveBorderColor | transparent | String The border color of inactive pages. It would only be added if you choose one of the rounded and outlined themes. |
inactiveBackgroundColor | transparent | String The background color of inactive pages. It would only be added if you choose one of the rounded and outlined themes. |
← Demos