react-toggle-aware

    0.2.0 • Public • Published

    react-toggle-aware Build Status

    A tiny higher order component to track toggle state.

    Example

    import { Component } from 'react';
    import { toggleAware } from 'react-toggle-aware';
     
    @toggleAware({ // same as default options
        onDelay: 0,
        offDelay: 0,
        handler: 'onToggle',
        key: 'isToggled'
    })
    class CustomComponent extends Component {
     
        render() {
            // props will include the toggle handler
            let { isToggled, className, ...props } = this.props;
     
            if (isToggled) className += ' on';
     
            return (
                <div {...props} className={className}>
     
                </div>
            )
        }
    };

    API

    As a decorator
    @toggleAware(options)
    export default class Test extends React.Component {
        /* your code */
    }
    As a function
    class Test extends React.Component {
        /* your code */
    }
     
    export default toggleAware(options)(Test);

    Options

    onDelay defaults to 0

    Time in ms to wait before setting the active status to true.

    offDelay defaults to 0

    Time in ms to wait before setting the active status to false.

    handler defaults to 'onToggle'

    Property name to expose the handler as.

    key defaults to 'isToggled'

    Property name to expose the active status as.

    Install

    npm i react-toggle-aware

    DownloadsWeekly Downloads

    4

    Version

    0.2.0

    License

    MIT

    Last publish

    Collaborators

    • floadmin
    • unboundev
    • aembke
    • stegmanh
    • kwilson