import r from"@babel/runtime/helpers/slicedToArray";import{useState as e,useCallback as a}from"react";import{debounce as o}from"lodash";import{makeStyles as t,Paper as i,InputBase as n}from"@material-ui/core";import c from"@material-ui/icons/Search";import s from"@material-ui/icons/Close";import l from"prop-types";import m from"classnames";import{jsxs as p,jsx as h}from"react/jsx-runtime";var u=t((function(r){return{root:{display:"flex",alignItems:"center",height:30,paddingLeft:19,borderRadius:30,boxShadow:"none","&:focus-within":{boxShadow:"inset 0 0 0 2px ".concat(r.palette.primary.main)}},input:{flex:1,fontFamily:"Roboto",fontSize:14,fontWeight:200},searchIcon:{height:16,width:16,color:r.palette.primary.contrastText,marginRight:9},closeIcon:{height:16,width:16,margin:"0 10px",color:r.palette.primary.text6,cursor:"pointer"}}}));function f(t){var l=t.handleSearch,f=t.className,d=u(),g=e(""),x=r(g,2),y=x[0],b=x[1],N=a(o(l,500),[]);return p(i,{className:m(d.root,f),children:[h(c,{className:d.searchIcon}),h(n,{className:d.input,placeholder:"Search ...",value:y,inputProps:{"aria-label":"search"},onChange:function(r){return e=r.target.value,b(e),void N(e);var e}}),y&&h(s,{className:d.closeIcon,onClick:function(){l(""),b("")}})]})}f.propTypes={handleSearch:l.func.isRequired,className:l.string},f.defaultProps={className:""};export{f as default};
//# sourceMappingURL=index.js.map
