Overview

A naive search input fires on every keystroke. Type "hello" and the backend gets hit five times, results flicker as they arrive out of order, and the app feels heavy. Debounced Search Input waits for typing to pause for a configurable interval before firing its OnSearch event, so the backend gets called exactly once per pause with the current text. It's a tiny piece of code with an outsized impact on performance and perceived quality.

Key features

• Fires OnSearch only after the user pauses typing (default 300ms).
• Minimum-length threshold — don't search until the user has typed N characters (great for "type at least 2 letters" search).
• Clear button — an X icon that appears when there's text; clears and refires with an empty term.
• Enter fires immediately — power users expect Enter to search instantly, bypassing the debounce.
• No same-value refires — pausing after "cat", then unpausing without changing anything, won't refire.
• Accessible: keyboard-focusable, proper labels; the clear button is a real button with type=button.
• No dependencies, no server calls.