import React, { useMemo, useRef } from "react";
import { Icons } from "../../../assets";
import { useDebouncedCallback } from "../../hooks";
import { Input } from "..";
export function Search({ onDebouncedChange, debounceTime = 500, onChange, ...props }) {
    const initialValue = props.value ?? props.defaultValue ?? "";
    const prevValue = useRef(String(initialValue));
    const handleDebouncedChange = useDebouncedCallback(useMemo(() => {
        if (!onDebouncedChange)
            return;
        return (event) => {
            const current = event.target.value;
            onDebouncedChange(current, prevValue.current);
            prevValue.current = current;
        };
    }, [onDebouncedChange]), debounceTime);
    const handleChange = useMemo(() => {
        if (!handleDebouncedChange && !onChange)
            return;
        return (event) => {
            onChange?.(event);
            handleDebouncedChange?.(event);
        };
    }, [handleDebouncedChange, onChange]);
    return React.createElement(Input, { ...props, icon: React.createElement(Icons.Search, { size: "S" }), onChange: handleChange });
}
//# sourceMappingURL=Search.js.map