All Projects → axross → redebounce

axross / redebounce

Licence: MIT license
↘️ Render Props component to debounce the given value

Programming Languages

typescript
32286 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to redebounce

render-props
㸚 Easy-to-use React state containers which utilize the render props (function as child) pattern
Stars: ✭ 33 (+135.71%)
Mutual labels:  debounce, render-props
svelte-search
Accessible, customizable Svelte search component
Stars: ✭ 17 (+21.43%)
Mutual labels:  debounce
React Nprogress
⌛️ A React primitive for building slim progress bars.
Stars: ✭ 173 (+1135.71%)
Mutual labels:  render-props
RateLimiting.NET
Rate Limiting (debounce, throttle) for C# Portable Class Library
Stars: ✭ 20 (+42.86%)
Mutual labels:  debounce
React Firestore
React components to fetch data from firestore using render props
Stars: ✭ 228 (+1528.57%)
Mutual labels:  render-props
MD UISwitch
Uniformly encapsulate different types of switches as user input devices
Stars: ✭ 33 (+135.71%)
Mutual labels:  debounce
React Popper Tooltip
A React hook to effortlessly build smart tooltips.
Stars: ✭ 149 (+964.29%)
Mutual labels:  render-props
together
Group things together!
Stars: ✭ 35 (+150%)
Mutual labels:  debounce
anim-event
Event Manager for Animation
Stars: ✭ 25 (+78.57%)
Mutual labels:  debounce
elm-debounce
Yet another debouncer for Elm
Stars: ✭ 40 (+185.71%)
Mutual labels:  debounce
React Powerplug
🔌 Renderless Containers
Stars: ✭ 2,704 (+19214.29%)
Mutual labels:  render-props
patronum
☄️ Effector operators library delivering modularity and convenience ✨
Stars: ✭ 244 (+1642.86%)
Mutual labels:  debounce
debounce-async
A debounce function that delays invoking asynchronous functions.
Stars: ✭ 21 (+50%)
Mutual labels:  debounce
Material Ui Popup State
boilerplate for common Material-UI Menu, Popover and Popper use cases
Stars: ✭ 186 (+1228.57%)
Mutual labels:  render-props
Unshaky
A software attempt to address the "double key press" issue on Apple's butterfly keyboard [not actively maintained]
Stars: ✭ 2,711 (+19264.29%)
Mutual labels:  debounce
Use Url State
Lift a React component's state into the url
Stars: ✭ 154 (+1000%)
Mutual labels:  render-props
concorde.js
A sexy pinnacle of engineering that’s nonetheless incredibly inefficient and expensive and goes out of business because it can’t find enough use. It also provides some tools to deal with the browser.
Stars: ✭ 17 (+21.43%)
Mutual labels:  debounce
stickyard
Make your React component sticky the easy way
Stars: ✭ 83 (+492.86%)
Mutual labels:  render-props
reason-epitath
CPS sugar usage for React Render Props composition in ReasonML
Stars: ✭ 16 (+14.29%)
Mutual labels:  render-props
sagittarius
🎯 A set of javascript most used utils📑
Stars: ✭ 42 (+200%)
Mutual labels:  debounce

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.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].