@cloudflare/component-pagination
    TypeScript icon, indicating that this package has built-in type declarations

    6.0.0 • Public • Published

    @cloudflare/component-pagination

    Cloudflare Pagination Component

    Installation

    Installation with yarn is recommended

    $ yarn add @cloudflare/component-pagination
    

    Usage

    import React from 'react';
    import { createComponent } from '@cloudflare/style-container';
    import { Pagination } from '../../src';
    
    const Margin = createComponent(({ theme }) => ({
      margin: theme.space[2]
    }));
    
    const onPrevClick = () => console.log('prev click!');
    const onNextClick = () => console.log('next click!');
    
    class PaginationComponent extends React.Component {
      render() {
        return (
          <div>
            <Margin>
              <Pagination
                start={1}
                end={15}
                total={60}
                onPrevClick={onPrevClick}
                onNextClick={onNextClick}
              />
            </Margin>
            <Margin>
              <Pagination
                start={45}
                end={60}
                total={60}
                onPrevClick={onPrevClick}
                onNextClick={onNextClick}
              />
            </Margin>
            <Margin>
              <Pagination
                start={45}
                end={60}
                onPrevClick={onPrevClick}
                onNextClick={onNextClick}
              />
            </Margin>
            <Margin>
              <Pagination
                start={1}
                end={15}
                total={60}
                onPrevClick={onPrevClick}
                onNextClick={onNextClick}
                loading
              />
            </Margin>
            <Margin>
              <Pagination
                start={1}
                end={15}
                total={15}
                disablePreviousButton={true}
                disableNextButton={true}
                onPrevClick={onPrevClick}
                onNextClick={onNextClick}
              />
            </Margin>
          </div>
        );
      }
    }
    
    export default PaginationComponent;

    Keywords

    none

    Install

    npm i @cloudflare/component-pagination

    DownloadsWeekly Downloads

    1,421

    Version

    6.0.0

    License

    BSD-3-Clause

    Unpacked Size

    221 kB

    Total Files

    25

    Last publish

    Collaborators

    • chiminator
    • sgoodhew_cf
    • janik-cloudflare
    • terinjokes
    • third774
    • evanderkoogh
    • jsteinberger
    • jasnell
    • kkoenig
    • asapzacy
    • pcostanzo
    • gregbrimble
    • geelen
    • jgentes
    • threepointone
    • rexscaria
    • dcruz_cf
    • xuranwang
    • jculvey
    • sejoker
    • caass
    • vasturiano
    • cf-ci-write
    • segments-write
    • thibmeu
    • xortive
    • gurjinder
    • cf-ci2
    • lvalenta
    • worenga