0.2.1 • Published 3 years ago
ab-paginate v0.2.1
this package replaced with @abasb75/paginate
npm install @abasb75/paginate --saveusage example :
import { useState } from 'react';
import {ABPaginate} from "@abasb75/paginate"; 
function App() {
  const [activePage,setActivePage] = useState(1);
  const pageRangeDisplayed = 4;
  return (<>
    <h1>page : {activePage}</h1>
    <ABPaginate
      activePage={activePage}
      lastPage={10}
      pageRangeDisplayed={pageRangeDisplayed}
      onChange={setActivePage}
    />
    
  </>
    
    
  );
}
export default App;props :
Properties
| Property | PropType | Required | Default | Description | 
|---|---|---|---|---|
| activePage | number | 1 | ||
| lastPage | number | 1 | ||
| pageRangeDisplayed | number | 4 | ||
| onChange | func | ()=>{} | ||
| listClassName | string | 'ab-paginate-list-2857373' | ||
| itemClassName | string | 'ab-paginate-item-1683646' | ||
| nextClassName | string | 'ab-paginate-next-1837342' | ||
| previousClassName | string | 'ab-paginate-prev-5567886' | ||
| firstClassName | string | 'ab-paginate-first-3873878' | ||
| lastClassName | string | 'ab-paginate-last-8866568' | ||
| disabledFirstClassName | string | 'ab-paginate-dfirst-3203808' | ||
| disabledLastClassName | string | 'ab-paginate-dlast-8843780' | ||
| disabledPreviousClassName | string | 'ab-paginate-prev-4034800' | ||
| disabledNextClassName | string | 'ab-paginate-next-1324686' | ||
| activeItemClassName | string | 'ab-paginate-actv-5623876' | ||
| breakClassName | string | 'ab-paginate-brek-4343078' | ||
| showNextPage | bool | true | ||
| showPreviousPage | bool | true | ||
| showFirstPage | bool | true | ||
| showLastPage | bool | true | ||
| nextPageLabel | string | 'next >' | ||
| previousPageLabel | string | '< previous' | ||
| firstPageLabel | string | '<<' | ||
| lastPageLabel | string | '>>' | ||
| breakLabel | string | '...' |