@cavilha/input-autocomplete
Version:
- [Installing](#installing) - [Using](#Using) - [Get Involved](#get-involved) - [License](#license)
2 lines (1 loc) • 3.03 kB
JavaScript
import t,{useState as e,useRef as o,useMemo as n,useEffect as r}from"react";import a from"@cavilha/text-input";import i from"@cavilha/box";import c from"@cavilha/button";import l from"@cavilha/icon";import{faTimes as u}from"@fortawesome/pro-regular-svg-icons";import{styled as m}from"@cavilha/theme";import{Radio as p}from"@cavilha/radio";var f=function(){return f=Object.assign||function(t){for(var e,o=1,n=arguments.length;o<n;o++)for(var r in e=arguments[o])Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r]);return t},f.apply(this,arguments)};var s=m("div",{maxWidth:320,width:"calc(100% - ($medium1*2))",bc:"$background1",zIndex:"$max",borderRadius:4,boxShadow:"0px 0px 8px rgba(116, 116, 116, 0.4)",transform:"translateY(6px)",padding:"$medium2 $medium1",margin:"0 auto",position:"absolute",left:0,right:0,maxHeight:300,overflow:"hidden auto","@md":{maxWidth:600},"> div":{"> div":{margin:0,"&:last-child":{mb:"0px !important"},label:{cursor:"pointer"}}}}),d=m("button",{display:"flex",alignItems:"center",backgroundColor:"transparent",border:"none",cursor:"pointer",fontSize:"$bodyMedium",width:"100%",minHeight:"$large1",padding:"$small3","&:focus":{backgroundColor:"$secondary0Hover"},"&:hover":{backgroundColor:"$secondary0Hover"}});m(p,{display:"none !important"});var v=t.forwardRef((function(m,p){var v=m.options,h=void 0===v?[]:v,g=m.onChange,b=m.onSearch,x=m.onAutocomplete,y=m.onFocus,w=m.onAutocompleteClick,C=m.allowClear,O=function(t,e){var o={};for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&e.indexOf(n)<0&&(o[n]=t[n]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(t);r<n.length;r++)e.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(t,n[r])&&(o[n[r]]=t[n[r]])}return o}(m,["options","onChange","onSearch","onAutocomplete","onFocus","onAutocompleteClick","allowClear"]),k=e([]),E=k[0],$=k[1],j=e(!1),S=j[0],I=j[1],A=e(""),H=A[0],P=A[1],z=o(null),F=n((function(){return h}),[h]);r((function(){var t=function(t){z.current&&!z.current.contains(t.target)&&I(!1)};return document.addEventListener("click",t),function(){return document.removeEventListener("click",t)}}),[z]);return r((function(){F.length>0&&$(F)}),[F]),t.createElement(i,{css:{position:"relative"},ref:z},t.createElement(i,{css:{position:"relative"}},t.createElement(a,f({value:H,onFocus:function(t){I(!0),y&&y(t)},onChange:function(t){if(P(t.target.value),g&&g(t),x||b)if(!x||b){if(b&&!x){var e=b(t.target.value,F);$(e)}}else{var o=x(t.target.value,F);$(o)}else $(F)},ref:p},O)),C&&H.length>0&&t.createElement(c,{onClick:function(){return P("")},variant:"ghost",label:t.createElement(l,{icon:u}),css:{width:"fit-content",height:"fit-content",position:"absolute",right:"5px",top:5,zIndex:"9999999"}})),S&&E.length>0&&t.createElement(s,null,null==E?void 0:E.map((function(e){return t.createElement(d,{tabIndex:0,onClick:function(){return function(t){if(w){var e=w(H,t);return P(e),void I(!1)}P("".concat(H).concat(t)),I(!1)}(e)},key:e},e)}))))}));export{v as default};