Pagination Search
draft
in progress...
Loading
Code
HTML
import { NbhdPaginationSearch } from '@fbin-web/neighborhood-core';<nbhd-pagination-bar> pagination-bar </nbhd-pagination-bar>React
import { NbhdPaginationSearch } from '@fbin-web/neighborhood-react';
const App = () => (
<>
<NbhdPaginationSearch>pagination-search</NbhdPaginationSearch>
</>
);Properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
data
|
object
|
An object containing pagination data, including current page, total pages, and maximum amount of page buttons to display. | ||
onPageChange
|
function
|
A function that is called when the page changes. It receives the new page number as an argument. |
Pagination Search Bar Data
Main data structure expected by the component for page information.
| Property | Type | Description |
|---|---|---|
| currentPage |
number
|
The current page number. |
| totalPages |
number
|
The total number of pages. |
| maxPageButtons |
number
|
The maximum number of page buttons to display at once. |
Slots
| Name | Description |
|---|---|
| default | Content area. |
CSS Parts
| Name | Description |
|---|---|
| base | The component's base wrapper. |
CSS Properties
| Property | Default Value |
|---|---|
--nbhd-element
|
default |