import{__extends as e}from"../../../node_modules/tslib/tslib.es6.js";import t,{Fragment as n,Component as s}from"react";import{BsCaretRightFill as o}from"../../../node_modules/react-icons/bs/index.esm.js";import{List as i,ListItem as r,ListIcon as u}from"../../../node_modules/@chakra-ui/layout/dist/esm/list.js";import{Input as a}from"../../../node_modules/@chakra-ui/input/dist/esm/input.js";var l=function(s){function l(e){var t=s.call(this,e)||this;return t.onChange=function(e){var n=t.props.suggestions,s=e.currentTarget.value,o=n.filter((function(e){return e.label.toLowerCase().indexOf(s.toLowerCase())>-1}));t.setState({activeSuggestion:0,filteredSuggestions:o,showSuggestions:!0,userInput:e.currentTarget.value})},t.onClick=function(e){var n=t.props.suggestions.filter((function(t){return t.label.toLowerCase().indexOf(e.currentTarget.innerText.toLowerCase())>-1})),s=e.currentTarget.innerText;s.startsWith("/")||(s="/"+s),t.setState({activeSuggestion:0,filteredSuggestions:[],showSuggestions:!1,userInput:n[0].path})},t.onKeyDown=function(e){var n=t.state,s=n.activeSuggestion,o=n.filteredSuggestions;if(13===e.keyCode)t.setState({activeSuggestion:0,showSuggestions:!1,userInput:o[s]});else if(38===e.keyCode){if(0===s)return;t.setState({activeSuggestion:s-1})}else if(40===e.keyCode){if(s-1===o.length)return;t.setState({activeSuggestion:s+1})}},t.state={activeSuggestion:0,filteredSuggestions:[],showSuggestions:!1,userInput:""},t}return e(l,s),l.prototype.componentDidMount=function(){this.props.initialValue!=this.state.userInput&&this.setState({userInput:this.props.initialValue})},l.prototype.render=function(){var e=this,s=e.onChange,l=e.onClick,g=e.onKeyDown,c=e.state;c.activeSuggestion;var p,f=c.filteredSuggestions,m=c.showSuggestions,d=c.userInput;return m&&d&&(p=f.length?t.createElement(i,{spacing:3},f.map((function(e,n){return t.createElement(r,{onClick:l},t.createElement(u,{as:o,color:"green.500"}),e.label)}))):t.createElement("div",{class:"no-suggestions"},t.createElement("em",null,"No suggestions available."))),t.createElement(n,null,t.createElement(a,{autoComplete:"off",name:this.props.name,ref:this.props.register,type:"text",onChange:s,onKeyDown:g,value:d}),p,t.createElement("style",{global:!0,jsx:!0},"\n        .form-group label {\n          font-size: 18px;\n        }\n       li {\n        font-size: 18px;\n        cursor: pointer;\n      }\n      ul .suggestions {\n        max-height: 500px;\n        overflow: scroll;\n      }\n      "))},l}(s);export default l;
//# sourceMappingURL=Autocomplete.js.map
