{"version":3,"sources":["searchBlock.js"],"names":["SearchBlock","[object Object]","el","this","input","querySelector","results","searchResultsBtn","queryStringElement","dropdownElement","reset","handleOutsideClick","bind","handleKeydown","addEventListener","resetInput","e","key","querySelectorAll","click","debounce","value","classList","toggle","length","fetch","then","response","text","data","href","dataset","searchResultsPage","innerHTML","openDropDown","closeDropDown","add","document","remove","removeEventListener","focus","event","contains","target","focusableElements","lastFocusableElement","activeElement","shiftKey","func","wait","_this","timeout","_len","arguments","args","Array","_key","clearTimeout","setTimeout","apply","ControlBinders","register"],"mappings":"AAAA,MAAMA,YACJC,YAAYC,GACVC,KAAKD,GAAKA,EACVC,KAAKC,MAAQF,EAAGG,cAAc,SAC9BF,KAAKG,QAAUJ,EAAGG,cAAc,kBAChCF,KAAKI,iBAAmBL,EAAGG,cAAc,8BACzCF,KAAKK,mBAAqBN,EAAGG,cAAc,uBAC3CF,KAAKM,gBAAkBP,EAAGG,cAAc,mBACxCF,KAAKO,MAAQR,EAAGG,cAAc,gBAC9BF,KAAKQ,mBAAqBR,KAAKQ,mBAAmBC,KAAKT,MACvDA,KAAKU,cAAgBV,KAAKU,cAAcD,KAAKT,MAC7CA,KAAKO,MAAMI,iBAAiB,QAAS,IAAMX,KAAKY,cAChDZ,KAAKC,MAAMU,iBAAiB,QAASE,IACrB,UAAVA,EAAEC,KACJd,KAAKM,gBAAgBS,iBAAiB,KAAK,GAAGC,UAGlDhB,KAAKC,MAAMU,iBAAiB,QAASX,KAAKiB,SAAS,KACjD,IAAIC,EAAQlB,KAAKC,MAAMiB,MACvBlB,KAAKO,MAAMY,UAAUC,OAAO,SAAUF,EAAMG,OAAS,GAEjDH,EAAMG,OAAS,IACjBC,0DAA0DJ,KAASK,KAAKC,GAAYA,EAASC,QAAQF,KAAKG,IACxG1B,KAAKI,iBAAiBuB,KAAO3B,KAAKI,iBAAiBwB,QAAQC,kBAAoBX,EAC/ElB,KAAKG,QAAQ2B,UAAYJ,IAE3B1B,KAAKK,mBAAmByB,UAAYZ,EACpClB,KAAK+B,gBAGc,IAAjBb,EAAMG,QACRrB,KAAKgC,iBAEN,MAGLlC,eACEE,KAAKD,GAAGG,cAAc,aAAaiB,UAAUc,IAAI,oBACjDC,SAASvB,iBAAiB,QAASX,KAAKQ,oBACxC0B,SAASvB,iBAAiB,UAAWX,KAAKU,eAG5CZ,gBACEE,KAAKD,GAAGG,cAAc,aAAaiB,UAAUgB,OAAO,oBACpDD,SAASE,oBAAoB,QAASpC,KAAKQ,oBAC3C0B,SAASE,oBAAoB,UAAWpC,KAAKU,eAG/CZ,aACEE,KAAKC,MAAMiB,MAAQ,GACnBlB,KAAKO,MAAMY,UAAUc,IAAI,UACzBjC,KAAKC,MAAMoC,QACXrC,KAAKgC,gBAGPlC,mBAAmBwC,GACZtC,KAAKD,GAAGwC,SAASD,EAAME,SAC1BxC,KAAKgC,gBAITlC,cAAcwC,GAEZ,GAAkB,QAAdA,EAAMxB,IAAe,CACvB,MAAM2B,EAAoBzC,KAAKD,GAAGgB,iBAAiB,4EAC7C2B,EAAuBD,EAAkBA,EAAkBpB,OAAS,GAEtEa,SAASS,gBAAkBD,GAAyBJ,EAAMM,UAC5D5C,KAAKgC,iBAKXlC,SAAS+C,EAAMC,GACb,IAAIC,EAAQ/C,KAEZ,IAAIgD,EACJ,OAAO,WACL,IAAK,IAAIC,EAAOC,UAAU7B,OAAQ8B,EAAO,IAAIC,MAAMH,GAAOI,EAAO,EAAGA,EAAOJ,EAAMI,IAC/EF,EAAKE,GAAQH,UAAUG,GAGzBC,aAAaN,GACbA,EAAUO,WAAW,IAAMV,EAAKW,MAAMT,EAAOI,GAAOL,KAO1DW,eAAeC,SAAS,sBAAuB3D,GAAM,IAAIF,YAAYE","sourcesContent":["class SearchBlock {\r\n constructor(el) {\r\n this.el = el;\r\n this.input = el.querySelector(\"input\");\r\n this.results = el.querySelector('[data-results]');\r\n this.searchResultsBtn = el.querySelector(\"[data-search-results-page]\");\r\n this.queryStringElement = el.querySelector(\"[data-query-string]\");\r\n this.dropdownElement = el.querySelector(\"[data-dropdown]\");\r\n this.reset = el.querySelector(\"[data-reset]\");\r\n this.handleOutsideClick = this.handleOutsideClick.bind(this);\r\n this.handleKeydown = this.handleKeydown.bind(this);\r\n this.reset.addEventListener(\"click\", () => this.resetInput());\r\n this.input.addEventListener('keyup', e=>{\r\n if(e.key === \"Enter\"){\r\n this.dropdownElement.querySelectorAll(\"a\")[0].click();\r\n }\r\n })\r\n this.input.addEventListener('keyup', this.debounce(() => {\r\n let value = this.input.value;\r\n this.reset.classList.toggle(\"hidden\", value.length < 1)\r\n if (value.length > 2) {\r\n fetch(`/umbraco/surface/SearchSurface/Search?searchTerm=${value}`).then(response => response.text()).then(data => {\r\n this.searchResultsBtn.href = this.searchResultsBtn.dataset.searchResultsPage + value\r\n this.results.innerHTML = data;\r\n });\r\n this.queryStringElement.innerHTML = value;\r\n this.openDropDown();\r\n }\r\n if(value.length === 0){\r\n this.closeDropDown();\r\n }\r\n }, 100));\r\n }\r\n\r\n openDropDown() {\r\n this.el.querySelector('.dropdown').classList.add('dropdown--active');\r\n document.addEventListener('click', this.handleOutsideClick);\r\n document.addEventListener('keydown', this.handleKeydown);\r\n }\r\n\r\n closeDropDown() {\r\n this.el.querySelector('.dropdown').classList.remove('dropdown--active');\r\n document.removeEventListener('click', this.handleOutsideClick);\r\n document.removeEventListener('keydown', this.handleKeydown);\r\n }\r\n\r\n resetInput() {\r\n this.input.value = \"\";\r\n this.reset.classList.add(\"hidden\");\r\n this.input.focus();\r\n this.closeDropDown();\r\n }\r\n\r\n handleOutsideClick(event) {\r\n if (!this.el.contains(event.target)) {\r\n this.closeDropDown();\r\n }\r\n }\r\n\r\n handleKeydown(event) {\r\n // Close dropdown on Tab key press when the focus is on the last focusable element inside the dropdown\r\n if (event.key === \"Tab\") {\r\n const focusableElements = this.el.querySelectorAll('input, button, [href], select, textarea, [tabindex]:not([tabindex=\"-1\"])');\r\n const lastFocusableElement = focusableElements[focusableElements.length - 1];\r\n\r\n if ((document.activeElement === lastFocusableElement) && !event.shiftKey) {\r\n this.closeDropDown();\r\n }\r\n }\r\n }\r\n\r\n debounce(func, wait) {\r\n var _this = this;\r\n\r\n let timeout;\r\n return function () {\r\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\r\n args[_key] = arguments[_key];\r\n }\r\n\r\n clearTimeout(timeout);\r\n timeout = setTimeout(() => func.apply(_this, args), wait);\r\n };\r\n }\r\n\r\n} // Usage example:\r\n\r\n\r\nControlBinders.register(`[data-search-block]`, el => new SearchBlock(el));"],"file":"searchBlock-min.js"}