New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More

@commercetools-uikit/pagination

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@commercetools-uikit/pagination

Components for navigating through pages of items

  • 0.0.0-canary-20241009193324
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
2.5K
decreased by-5.99%
Maintainers
3
Weekly downloads
 
Created

Pagination

Description

Components for navigating through pages of items

Installation

yarn add @commercetools-uikit/pagination
npm --save install @commercetools-uikit/pagination

Additionally install the peer dependencies (if not present)

yarn add react react-intl
npm --save install react react-intl

Usage

import { Pagination } from '@commercetools-uikit/pagination';

const Example = () => {
  const items = [{ id: '1' }, { id: '2' }];
  return (
    <Pagination
      totalItems={items.length}
      page={1}
      onPageChange={() => {}}
      onPerPageChange={() => {}}
    />
  );
};

export default Example;

Properties

PropsTypeRequiredDefaultDescription
totalItemsnumberTotal number of items across all pages
pagenumberThe current page
onPageChangeFunction
See signature.
A callback function, called when the page is changed.
perPagenumber20Number of items per page, according to the pre-defined range values.
perPageRangeTPageRangeSize's'Range of items per page.
s: 20,50
m: 20,50,100
l: 200,500
onPerPageChangeFunction
See signature.
A callback function, called when perPage is changed.

Signatures

Signature onPageChange

(newPage: number) => void

Signature onPerPageChange

(newPerPage: number) => void

FAQs

Package last updated on 09 Oct 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts