Neighbourhood Party Manager

    itsa-react-paginator

    16.0.13 • Public • Published

    Paginator for react.

    Lightweight, focussable and responses to the keyboard. This is only the UI-interface --> you need the callbacks to give it any functionality you want.

    How to use:

    const React = require("react"),
        ReactDOM = require("react-dom"),
        Paginator = require("itsa-react-paginator");
     
    const pageSizes = [5, 10, 20, 50, 100, 250, 500, 1000, 'all items'];
     
    const changePage = newPage => {
        props.page = newPage;
        renderPaginator();
    };
     
    const changePageSize = newIndex => {
        let newItemsPerPage = pageSizes[newIndex];
        if (typeof newItemsPerPage==='number') {
            props.itemsPerPage = newItemsPerPage;
        }
        else {
            delete props.itemsPerPage;
        }
        props.page = 1;
        renderPaginator();
    };
     
    let props = {
        onChange: changePage,
        onChangePageSize: changePageSize,
        itemsPerPage: 10,
        page: 1,
        pageSizes: pageSizes,
        showCountOutOf: true,
        totalItems: 1500
    };
     
    const renderPaginator = () => {
        ReactDOM.render(
            <Paginator {...props} />,
            document.getElementById("component-container")
        );
    };
     
    renderPaginator();

    About the css

    You need the right css in order to make use of itsa-react-paginator. There are 2 options:

    1. You can use the css-files inside the css-folder.
    2. You can use: Component = require("itsa-react-paginator/lib/component-styled.jsx"); and build your project with webpack. This is needed, because you need the right plugin to handle a requirement of the scss-file.

    View live example

    API

    If you want to express your appreciation

    Feel free to donate to one of these addresses; my thanks will be great :)

    • Ether: 0xE096EBC2D19eaE7dA8745AA5D71d4830Ef3DF963
    • Bitcoin: 37GgB6MrvuxyqkQnGjwxcn7vkcdont1Vmg

    Install

    npm i itsa-react-paginator

    DownloadsWeekly Downloads

    5

    Version

    16.0.13

    License

    BSD-3-Clause

    Unpacked Size

    1.37 MB

    Total Files

    40

    Last publish

    Collaborators

    • itsasbreuk