import { jsx as _jsx } from "react/jsx-runtime";
import { forwardRef, useImperativeHandle, useRef } from 'react';
import { useIsomorphicLayoutEffect } from '../../utils/hooks/useIsomorphicLayoutEffect';
import { runInNextFrame } from '../../utils/nextFrame';
export var SearchInput = forwardRef(function (props, ref) {
    var inputRef = useRef(null);
    var placeholder = props.placeholder, value = props.value, onChange = props.onChange;
    useImperativeHandle(ref, function () { return ({
        focus: function () {
            runInNextFrame(function () {
                var _a;
                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
            });
        },
    }); }, [inputRef]);
    useIsomorphicLayoutEffect(function () {
        inputRef.current.focus({
            preventScroll: true,
        });
    }, []);
    return (_jsx("input", { ref: inputRef, placeholder: placeholder, className: "zent-cascader-v2--search", value: value, onChange: onChange, "data-zv": 'v10.0.12' }, void 0));
});
SearchInput.displayName = 'SearchInput';
