/** * External dependencies */ import { __, sprintf } from '@wordpress/i18n'; import PropTypes from 'prop-types'; import classNames from 'classnames'; import Label from '@woocommerce/base-components/label'; /** * Internal dependencies */ import { getIndexes } from './utils.js'; import './style.scss'; const Pagination = ( { currentPage, displayFirstAndLastPages, displayNextAndPreviousArrows, pagesToDisplay, onPageChange, totalPages, } ) => { let { minIndex, maxIndex } = getIndexes( pagesToDisplay, currentPage, totalPages ); const showFirstPage = displayFirstAndLastPages && Boolean( minIndex !== 1 ); const showLastPage = displayFirstAndLastPages && Boolean( maxIndex !== totalPages ); const showFirstPageEllipsis = displayFirstAndLastPages && Boolean( minIndex > 3 ); const showLastPageEllipsis = displayFirstAndLastPages && Boolean( maxIndex < totalPages - 2 ); // Handle the cases where there would be an ellipsis replacing one single page if ( showFirstPage && minIndex === 3 ) { minIndex = minIndex - 1; } if ( showLastPage && maxIndex === totalPages - 2 ) { maxIndex = maxIndex + 1; } const pages = []; if ( minIndex && maxIndex ) { for ( let i = minIndex; i <= maxIndex; i++ ) { pages.push( i ); } } return (

{ displayNextAndPreviousArrows && ( ) } { showFirstPage && ( ) } { showFirstPageEllipsis && ( ) } { pages.map( ( page ) => { return ( ); } ) } { showLastPageEllipsis && ( ) } { showLastPage && ( ) } { displayNextAndPreviousArrows && ( ) }

); }; Pagination.propTypes = { /** * Number of the page currently being displayed. */ currentPage: PropTypes.number.isRequired, /** * Total number of pages. */ totalPages: PropTypes.number.isRequired, /** * Displays first and last pages if they are not in the current range of pages displayed. */ displayFirstAndLastPages: PropTypes.bool, /** * Displays arrows to navigate to the previous and next pages. */ displayNextAndPreviousArrows: PropTypes.bool, /** * Callback function called when the user triggers a page change. */ onPageChange: PropTypes.func, /** * Number of pages to display at the same time, including the active page * and the pages displayed before and after it. It doesn't include the first * and last pages. */ pagesToDisplay: PropTypes.number, }; Pagination.defaultProps = { displayFirstAndLastPages: true, displayNextAndPreviousArrows: true, pagesToDisplay: 3, }; export default Pagination; Teazers Vibe Collection Vibrator Amy. hot pink - Sexshop-xxxl.nl