https://www.nivea.co.jp/dist/NiveaX/modules/SearchAutoSuggestion.48a1e5df.js

1"use strict";(self.NiveaXwebpackJsonp=self.NiveaXwebpackJsonp||[]).push([[6890],{43234:(e,t,i)=>{i.r(t),i.d(t,{default:()=>m});var s=i(19446),n=i(42194),r=i(84817),o=i(61269),l=i(60778),u=i(45204),h=i(92752),a=i(41445),c=i(21464);const g='[data-module="SearchAutoSuggestion"]',p=38,d=40,S=(e,t)=>e.pipe((0,o.E)("target"),(0,l.T)(e=>e.closest(t)),(0,u.p)(e=>!!e));class m{static setup(e=g){Array.from(document.querySelectorAll(e)).filter(e=>!e.dataset.moduleInitialized).forEach(e=>{new m(e),e.dataset.moduleInitialized="true"})}constructor(e,t={}){this.element=e,this.options=t,this.ajaxResponseCache={},this.options=(0,c.$E)(this.element,Object.assign(this.getDefaultOptions(),this.options)),this.inputField=this.element.querySelector(this.options.inputWrapperSelector),this.inputFieldText=this.inputField.querySelector(this.options.inputSelector),this.suggestionField=this.element.querySelector(this.options.suggestionListSelector),this.form=this.element.querySelector(this.options.formSelector)||e,this.deleteButton=this.element.querySelector(this.options.deleteBtnSelector),this.setInputEventHandler()}setInputEventHandler(){const e=(0,s.R)(this.inputFieldText,"input").pipe((0,o.E)("target"),(0,h.B)(500),(0,u.p)(e=>e.value.length>=3||this.hideDialog()),(0,o.E)("value"),(0,l.T)(c.HI)),t=(0,s.R)(this.inputFieldText,"keydown").pipe((0,u.p)(({target:e})=>null!=e.value)),i=t.pipe((0,u.p)(e=>13===e.which),(0,o.E)("target","value")),r=t.pipe((0,l.T)(({target:e,which:t})=>({inputValue:(0,c.HI)(e.value),which:t})),(0,u.p)(({inputValue:e})=>e.length>=3),(0,u.p)(({which:e})=>[p,d].includes(e)),(0,a.M)(({inputValue:e})=>!this.isDialogVisible()&&this.initSuggestion(e))),g=(0,s.R)(this.inputField,"click").pipe((0,l.T)(()=>this.inputFieldText.value),(0,u.p)(e=>e.length>=3),(0,l.T)(c.HI)),m=(0,s.R)(this.deleteButton,"click"),v=(0,s.R)(document.body,"click").pipe((0,o.E)("target"),(0,u.p)(e=>null===e.closest(this.options.inputWrapperSelector))),f=(0,s.R)(this.suggestionField,"click"),x=(0,s.R)(this.suggestionField,"mouseover");return e.subscribe(e=>this.initSuggestion(e)),i.subscribe(e=>{let t=this.getSelectedElement(this.suggestionField),i=t?t.textContent:e;this.setToInputText((0,c.HI)(i))}),r.subscribe(({which:e})=>{switch(e){case d:this.moveSelection(!0);break;case p:this.moveSelection(!1)}}),g.subscribe(e=>this.initSuggestion(e)),(0,n.h)(m,v).subscribe(()=>this.hideDialog()),S(f,"li").subscribe(e=>{this.setToInputText((0,c.HI)(e.textContent)).submitForm()}),S(x,"li").subscribe(e=>this.removeSelection(Array.from(this.suggestionField.children)).setSelection(e)),this}initSuggestion(e){return this.clearSuggestion().setLoader(),this.isInCache(e)?this.updateSuggestion(this.getResultsFromCache(e)):this.fetchSuggestions(e),this}isInCache(e){return e in this.ajaxResponseCache}setResultsToCache(e,t){return this.ajaxResponseCache[e]=t,this}getResultsFromCache(e){return this.ajaxResponseCache[e]}updateSuggestion(e){return this.insertNodes(e).showDialog(),this}clearSuggestion(){return this.suggestionField.innerHTML="",this}fetchSuggestions(e){let t=window.location.protocol+"//"+window.location.host+"/xajax/searchSuggestion?q="+e,i=fetch(t,{credentials:"include"}).then(t=>{if(200===t.status)return t.json();throw new Error(`AutoSuggestion for "${e}" was not loaded. Response status: ${t.status}`)});return(0,r.H)(i).pipe((0,l.T)(e=>JSON.parse(e)||{Results:[]}),(0,o.E)("Results"),(0,l.T)(e=>e.map(e=>e.Name)),(0,a.M)(e=>0===e.length&&this.hideDialog()),(0,u.p)(e=>e.length>0)).subscribe(t=>{let i=this.createSuggestionHTML(t,e);this.setResultsToCache(e,i).updateSuggestion(i)},e=>{console.warn("Fetch Error",e),this.hideDialog()}),this}createSuggestionHTML(e,t){return e.map(e=>`<li class="nx-search-result">${e.replace(new RegExp(t,"i"),"<strong>$&</strong>")}</li>`).join("")}insertNodes(e){return this.suggestionField.innerHTML=e,this}showDialog(){return this.suggestionField.classList.add("active"),this}hideDialog(){return this.suggestionField.classList.remove("active"),!1}isDialogVisible(){return this.suggestionField.classList.contains("active")}setToInputText(e){return this.inputFieldText.value=e,this}setLoader(){return this.suggestionField.innerHTML='<div class="nx-spinner nx-spinner__loading nx-spinner--medium">\n            <div class="nx-spinner__container ">\n                <div class="nx-spinner__wheel"></div>\n            </div>\n        </div>',this}moveSelection(e){const t=this.suggestionField,i=Array.from(t.children),s=this.getSelectedElement(t),n=t.firstChild,r=t.lastElementChild;let o;return this.removeSelection(i),e?(o=s?s.nextElementSibling:n,this.setSelection(o||n)):(o=s?s.previousElementSibling:r,this.setSelection(o||r)),this}setSelection(e){return e.classList.add("selected"),this}

1removeSelection(e){return e.forEach(e=>e.classList.remove("selected")),this}getSelectedElement(e){return e.querySelector(".selected")}submitForm(){return this.form.submit(),this}getDefaultOptions(){return{inputWrapperSelector:".nx-search-input__inner",inputSelector:".nx-search-input__text",suggestionListSelector:".nx-search__autosuggest",formSelector:".nx-header-search-form",deleteBtnSelector:".nx-search-input-clear__icon"}}}m.setup(g)},61269:(e,t,i)=>{i.d(t,{E:()=>n});var s=i(60778);function n(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];var i=e.length;if(0===i)throw new Error("list of properties cannot be empty.");return function(t){return(0,s.T)(function(e,t){var i=function(i){for(var s=i,n=0;n<t;n++){var r=s[e[n]];if(void 0===r)return;s=r}return s};return i}(e,i))(t)}}}}]);
2//# sourceMappingURL=/dist/NiveaX/./modules/SearchAutoSuggestion.48a1e5df.js.b9b5d147.map