redebounce
TypeScript icon, indicating that this package has built-in type declarations

0.2.0 • Public • Published

Redebounce

npm GitHub stars GitHub license

Render Props component to debounce the given value.

  • 🚀 Dependency free
  • 🏄‍ Extremely tiny
  • 🔌 Plug and Play
  • 👷 Well tested
  • 👔 Built with TypeScript

Example

TRY IT OUT HERE

Redebounce Example

Install

npm i -S redebounce

APIs

<Redebounce>

Props

Name Type Required Description
dueTime number The timeout duration in milliseconds for the window of time to wait stopping changes of value and provide it to children
value T The value to provide to children.
children (value: T) => ReactNode A render props function which provides the value from value

Usage

import Redebounce from 'redebounce';
 
class WaitFor600ms extends PureComponent {
  state = { value: '' };
 
  render() {
    return (
      <div>
        <input onChange={this.onChangeInput} />
 
        <Redebounce dueTime={600} value={this.state.value}>
          {value => <input value={value} />}
        </Redebounce>
      </div>
    );
  }
 
  onChangeInput = e => {
    this.setState({ value: e.currentTarget.value });
  };
}

License

MIT

Contribute

You can help improving this project leaving Pull requests and helping with Issues.

/redebounce/

    Package Sidebar

    Install

    npm i redebounce

    Weekly Downloads

    21

    Version

    0.2.0

    License

    MIT

    Unpacked Size

    23.3 kB

    Total Files

    17

    Last publish

    Collaborators

    • axross