@zohodesk/components/es/v1/DropDown/DropDownSearch.js

In this Package, we Provide Some Basic Components to Build Web App

import React, { useEffect, useRef } from 'react';
import { DropDownSearch_propTypes } from "./props/propTypes";
import { DropDownSearch_defaultProps } from "./props/defaultProps";
import TextBox from "../TextBox/TextBox";
import style from "../../DropDown/DropDownSearch.module.css";
export default function DropDownSearch(props) {
  let {
    name,
    id,
    maxLength,
    onKeyDown,
    onChange,
    value,
    onBlur,
    size,
    textBoxSize,
    placeHolder,
    customClass,
    getRef,
    dataId
  } = props;
  let {
    searchClass = '',
    customTextBox = ''
  } = customClass;
  const inputRef = useRef(null); // eslint-disable-next-line func-call-spacing

  useEffect(() => {
    inputRef.current && inputRef.current.focus({
      preventScroll: true
    });
  }, []);

  function getReference(ele) {
    inputRef.current = ele;
    getRef && getRef(ele);
  }

  return /*#__PURE__*/React.createElement("div", {
    className: `${style.search} ${style[`${size}Search`]} ${searchClass}`,
    "data-id": dataId,
    "data-test-id": dataId
  }, /*#__PURE__*/React.createElement(TextBox, {
    id: id,
    inputRef: getReference,
    maxLength: maxLength,
    name: name,
    onBlur: onBlur,
    onChange: onChange,
    onKeyDown: onKeyDown,
    size: textBoxSize,
    value: value,
    placeHolder: placeHolder,
    customClass: customTextBox
  }));
}
DropDownSearch.defaultProps = DropDownSearch_defaultProps;
DropDownSearch.propTypes = DropDownSearch_propTypes;