debounce-control v1.1.0

DebounceControl

React component that debounce state. Can be used with any form element.

✨ Features

• Minimal re-renders
• Works with any form element
• No dependencies
• TypeScript support
• Custom delay

🚀 Install

npm install debounce-control

🧑‍💻 Usage

import React, { useState } from "react";
import DebounceControl from "debounce-control";

const App = () => {
  const [text, setText] = useState("");

  const onDebouncedChange = (value: string) => {
    setText(value);
  };

  return (
    <DebounceControl
      value={text}
      delay={300}
      onDebouncedChange={onDebouncedChange}
      render={({ value, onChange }) => (
        <input
          type='text'
          value={value}
          onChange={(e) => onChange(e.target.value)}
        />
      )}
    />
  );
};

export default App;

📺 Demo

Input

Slider

Resizable

📎 Props