Network Processor Module

    @xendora/react-timer

    1.1.0 • Public • Published

    react-timer

    A minimalistic yet customizable timer component!

    Live demo

    Travis (.org) branch GitHub Release Date npm NPM npm bundle size npm bundle size

    Basic Timer with 100ms interval

    Installation

    For NPM

    npm install @xendora/react-timer
    

    For Yarn

    yarn add @xendora/react-timer
    

    Usage

    import ReactTimer from "@xendora/react-timer";
    
    // Incremental counter
    <ReactTimer
        interval={100}
        start={0}
        end={t => t === 100}
        onTick={t => t + 1}
    >
        {time => <span>{time}</span>}
    </ReactTimer>
    
    // Decremetal counter
    <ReactTimer
        interval={100}
        start={100}
        end={t => t === 0}
        onTick={t => t - 1}
    >
        {time => <span>{time}</span>}
    </ReactTimer>
    
    // Infinite counter
    <ReactTimer
        interval={100}
        start={0}
        end={t => false}
        onTick={t => t + 1}
    >
        {time => <span>{time}</span>}
    </ReactTimer>

    Props

    Name Type Description
    children object (required) Define your react component here
    start number (required) A start value for the timer
    end function (required) A function which determines the end for the timer
    interval number An interval value for the timer. Default is 1 second
    onTick function (required) A callback function where the next computed value is determined
    onEnd function A callback function which executes when the timer stops executing

    License

    MIT © xendora

    Install

    npm i @xendora/react-timer

    DownloadsWeekly Downloads

    80

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    20.1 kB

    Total Files

    7

    Last publish

    Collaborators

    • xendora