@abtasty/search 0.0.2-0 → 0.0.2-1

package/dist/main.js

@@ -1 +1 @@
-!function(){"use strict";const e=()=>Object.prototype.hasOwnProperty.call(top,"ABTastyEditor"),t=e=>(e=>{if("string"!=typeof e||!e.trim().length)return null;const[t,s,a]=e.split("[]").map(e=>e.trim()),r=Boolean(a)?a:e,i=s?document.querySelector(t)?.[s]:document;return i?i.querySelector(r):null})(e),s=(e,s)=>{const a=document.querySelector("body")||document.documentElement,r={childList:!0,subtree:!0,attributes:!0},i=()=>n.disconnect(),n=new MutationObserver(()=>{const a=t(s);return a&&!i()&&e(a)});return{clear:i,observe:(e=a)=>n.observe(e,r)}},a=()=>{},r=(i,n)=>{const o=t(i),c={selector:i,clear:a,observe:a};if(o)return setTimeout(()=>n(o),0),c;if(e())return setTimeout(()=>r(i,n),1e3),c;if(i.includes("[]"))return((e,a)=>{const[r,i]=a.split("[]").map(e=>e.trim()),n=t(r),o=n?.[i],{clear:c,observe:l}=s(e,a),h=()=>{const s=t(a);return s&&!d()&&e(s)},d=()=>{c(),n?.removeEventListener("load",h)},g=()=>{l(o),"iframe"===n?.localName&&n.addEventListener("load",h)};return g(),{selector:a,clear:d,observe:g}})(n,i);const{clear:l,observe:h}=s(n,i);return h(),{selector:i,clear:l,observe:h}},i=["hasbro","lego","mattel"],n=e=>({"Content-Type":"application/json",Authorization:`Bearer ${e}`}),o=(e,t)=>{const s=e.toLowerCase(),a=t.toLowerCase();return i.some(e=>s.includes(e))&&!i.some(e=>a.includes(e))?-1:i.some(e=>a.includes(e))&&!i.some(e=>s.includes(e))?1:0};(()=>{const t=(()=>{if(e()||(()=>{const e=!!document.getElementById("ABTastyPreviewBar"),t=location.href.includes("ab_project=preview");return e||t})())return!1;const t=ABTasty.getTestsOnPage()[TEST_ID];return!!t&&Object.keys(t.targetings.qaParameters).length>0})(),s=window.document.cookie.includes("abTastyDebug=")||!0===window.abTastyDebug;if(t||s){const e=(()=>{const e=(()=>{const{type:e}=DATA;return`${PACKAGE.replace("@abtasty/","")}${e?`_${e}`:""}`})();return`${e.charAt(0).toUpperCase()}${e.slice(1)}`.split("-").join(" ")})();window.console.log(`%c${e} - ${t?"QA":"Debug"} Mode for campaign ${TEST_ID} %c Widget launch`,"background-color: #D6FF01; color: #3100be; padding: 3px 0 3px 10px; border-radius: 5px 0 0 5px; font-weight: bold;","background-color: #3100be; color: white; padding: 3px 10px 3px 0; border-radius: 0 5px 5px 0;")}})();const c=new class{constructor(){this.baseClassName="abtasty-search-widget",this.search="",this.target=null}async init(){const{elementReferrer:e}=DATA;return new Promise(t=>{r(e,e=>{const s=e.getRootNode();this.rootElement=s,this.target=e,this.target.onclick=e=>{e.preventDefault(),e.stopPropagation(),this.onSearchOpen()},t()})})}insertIn(e,t){return e.insertAdjacentElement(t,this.container),this}removeChildren(e){for(;e.firstChild;)e.removeChild(e.lastChild)}remove(){const e=this.rootElement.querySelector("body");this.removeChildren(this.container),e.removeChild(this.container)}onSearchOpen(){const e=this.rootElement.querySelector("body");this.container=this.getSearchContainerElement(),this.searchBarContainer=this.getSearchBarContainerElement(),this.searchResultsContainer=this.getSearchResultsContainerElement(),this.container.append(this.searchBarContainer,this.searchResultsContainer),this.insertIn(e,"afterbegin"),this.searchInput.focus()}onSearchClose(){this.remove(),document.body.style.overflow="initial"}onInput=e=>{this.search=e.target.value,this.debouncedQuerySuggest()};debouncedQuerySuggest=(()=>(e=>{let t=null;return function(){for(var s=arguments.length,a=new Array(s),r=0;r<s;r++)a[r]=arguments[r];window.clearTimeout(t),t=window.setTimeout(()=>{e(...a)},350)}})(this.onQuerySuggest.bind(this)))();async onSearch(){const{siteId:e,apiKey:t}=DATA;t&&e&&this.search?fetch("https://sellingassistant.netlify.app/.netlify/functions/search",{method:"POST",headers:n(t),body:JSON.stringify({siteId:e,search:this.search,maxPerPage:50})}).then(e=>e.json()).then(e=>this.setSearchResults(e.hits.sort((e,t)=>o(e.name,t.name)).filter(e=>e.link&&e.img_link&&e.price))).catch(e=>{window.console.error(e)}):this.container.classList.remove("search-completed")}async onQuerySuggest(){const{siteId:e,apiKey:t}=DATA;t&&e&&this.search.length>1?fetch("https://sellingassistant.netlify.app/.netlify/functions/querySuggest",{method:"POST",headers:n(t),body:JSON.stringify({siteId:e,search:this.search,suggestLimit:"20"})}).then(e=>e.json()).then(e=>this.setSuggestions(e.querySuggest.map(e=>e.pleinText).sort((e,t)=>o(e,t)).slice(0,4))).catch(e=>{window.console.error(e)}):(this.removeChildren(this.searchResultsContainer),this.container.classList.remove("search-completed"),this.setSuggestions([]))}setSuggestions(e){if(this.removeChildren(this.searchSuggestionsContainer),e.length){const t=this.getSuggestionsElements(e);this.searchSuggestionsContainer.append(...t),this.searchSuggestionsContainer.classList.add("visible")}else this.searchSuggestionsContainer.classList.remove("visible")}setSearchResults(e){if(this.container.classList.add("search-completed"),this.removeChildren(this.searchResultsContainer),e.length)for(const[t,s]of e.entries()){const e=document.createElement("a");e.href=s.link,e.target="_blank",e.rel="noreferrer",e.className=`${this.baseClassName}-search-result result-${t}`,e.innerHTML=`\n\t\t\t\t\t\t<img src="${s.img_link}" />\n\t\t\t\t\t\t<div class="${this.baseClassName}-search-result-name">${s.name}</div>\n\t\t\t\t\t\t<div class="${this.baseClassName}-search-result-price">${s.price}€</div>\n\t\t\t\t\t`,this.searchResultsContainer.appendChild(e)}else{const e=document.createElement("div");e.className=`${this.baseClassName}-search-no-result`,e.innerHTML="No results found",this.searchResultsContainer.appendChild(e)}this.searchResultsContainer.classList.add("visible")}getSearchContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-container`,document.head.insertAdjacentElement("afterbegin",(e=>{const t=document.createElement("style");return t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e)),t})(".abtasty-search-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;background-color:hsla(0,0%,100%,.5);bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:Lato,sans-serif;height:100vh;left:0;position:fixed;right:0;top:0;width:100vw;z-index:9999}.abtasty-search-widget-container i{display:inline-block;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}.abtasty-search-widget-container.search-completed{background-color:#fff;height:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;background-color:#0c4884;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:22.5px 100px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar{background-color:#fff;border-radius:12px;padding:12px;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-input-label{color:#fff;font-size:12px;font-weight:400;line-height:17px;margin-left:auto;margin-right:auto;margin-top:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar-close-button-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;line-height:unset}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar .abtasty-search-widget-search-input{border:unset;font-size:1.6em;font-weight:700;outline:0;padding:unset;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon-container{border:none;border-radius:100%;padding:8px;-webkit-transform:translateX(150%);transform:translateX(150%);vertical-align:middle}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon{background-color:#0c4884;height:28px;-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512' fill='rgba(0, 0, 0, 0.999)'%3E%3Cpath d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25-6.2 6.25-14.4 9.35-22.6 9.35s-16.38-3.125-22.62-9.375L160 301.3 54.63 406.6C48.38 412.9 40.19 416 32 416s-16.37-3.1-22.625-9.4c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512' fill='rgba(0, 0, 0, 0.999)'%3E%3Cpath d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25-6.2 6.25-14.4 9.35-22.6 9.35s-16.38-3.125-22.62-9.375L160 301.3 54.63 406.6C48.38 412.9 40.19 416 32 416s-16.37-3.1-22.625-9.4c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'/%3E%3C/svg%3E\");vertical-align:middle;width:28px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container{display:none;gap:8px;margin-top:12px;overflow-x:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container.visible{display:-webkit-box;display:-ms-flexbox;display:flex}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion{background-color:transparent;border:none;color:#fff;font-size:15px;font-weight:700;max-width:150px;min-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion>.abtasty-search-widget-search-icon{background-color:#fff;height:12.5px;margin-right:6px;-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='rgba(74, 76, 83, 0.999)'%3E%3Cpath d='M500.3 443.7 380.6 324c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723 99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9 53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0 15.606-15.64 15.606-41.04.006-56.64zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128-57.42 128-128 128-128-57.4-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='rgba(74, 76, 83, 0.999)'%3E%3Cpath d='M500.3 443.7 380.6 324c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723 99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9 53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0 15.606-15.64 15.606-41.04.006-56.64zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128-57.42 128-128 128-128-57.4-128-128z'/%3E%3C/svg%3E\");width:12.5px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion:hover{opacity:.8}.abtasty-search-widget-container .abtasty-search-widget-search-results-container{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;display:none;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:24px;justify-content:center;overflow-y:auto;padding:32px}.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{display:-webkit-box;display:-ms-flexbox;display:flex}.abtasty-search-widget-container .abtasty-search-widget-search-results-container .abtasty-search-widget-search-no-result{font-size:38px;font-weight:700;margin-top:82px}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>.abtasty-search-widget-search-result{-webkit-box-orient:vertical;-webkit-box-direction:normal;border-radius:12px;-webkit-box-shadow:0 2px 8px 0 rgba(0,0,0,.11);box-shadow:0 2px 8px 0 rgba(0,0,0,.11);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:18px;width:200px}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>.abtasty-search-widget-search-result>img{height:100%;margin-left:auto;margin-right:auto;-o-object-fit:contain;object-fit:contain;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>.abtasty-search-widget-search-result>.abtasty-search-widget-search-result-name{color:#0d4884;display:block;font-size:1.167em;font-weight:900;height:60px;line-height:1.43;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>.abtasty-search-widget-search-result>.abtasty-search-widget-search-result-price{color:#404040;font-size:1.833em;font-weight:900}@media (max-width:575.98px){.abtasty-search-widget-container .abtasty-search-widget-search-bar-container{padding:22.5px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon-container{-webkit-transform:translateX(15%);transform:translateX(15%)}}")),e}getSearchBarContainerElement(){const{searchLabel:e}=DATA;document.body.style.overflow="hidden";const t=this.target.closest("header"),s=document.createElement("div");if(s.className=`${this.baseClassName}-search-bar-container`,t){const e=t.getBoundingClientRect().height;s.style.minHeight=`${e}px`}const a=document.createElement("label");a.className=`${this.baseClassName}-search-input-label`,a.innerHTML=e;const r=document.createElement("div");r.className=`${this.baseClassName}-search-bar-close-button-container`;const i=document.createElement("div");i.className=`${this.baseClassName}-search-bar`;const n=document.createElement("input",{autofocus:!0});n.className=`${this.baseClassName}-search-input`,n.addEventListener("input",this.onInput.bind(this)),n.addEventListener("change",this.onSearch.bind(this)),a.htmlFor=n,this.searchInput=n;const o=document.createElement("button");o.className=`${this.baseClassName}-close-icon-container`,o.onclick=this.onSearchClose.bind(this);const c=document.createElement("i");return c.className=`${this.baseClassName}-close-icon`,o.appendChild(c),i.appendChild(n),r.append(i,o),s.appendChild(a),s.appendChild(r),this.searchSuggestionsContainer=this.getSearchSuggestionsContainerElement(),s.appendChild(this.searchSuggestionsContainer),s}getSearchSuggestionsContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-search-suggestions-container`,e}getSuggestionsElements(e){const t=[];for(const s of e){const e=document.createElement("button");e.className=`${this.baseClassName}-search-suggestion`,e.innerHTML=`\n\t\t\t\t<i class="${this.baseClassName}-search-icon"></i>${s}\n\t\t\t`,e.onclick=()=>{this.search=s,this.searchInput.value=s,this.onSearch()},t.push(e)}return t}getSearchResultsContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-search-results-container`,e}}(DATA);c.init().then(()=>{})}();
+!function(){"use strict";const e=()=>Object.prototype.hasOwnProperty.call(top,"ABTastyEditor"),t=e=>(e=>{if("string"!=typeof e||!e.trim().length)return null;const[t,a,s]=e.split("[]").map(e=>e.trim()),r=Boolean(s)?s:e,i=a?document.querySelector(t)?.[a]:document;return i?i.querySelector(r):null})(e),a=(e,a)=>{const s=document.querySelector("body")||document.documentElement,r={childList:!0,subtree:!0,attributes:!0},i=()=>n.disconnect(),n=new MutationObserver(()=>{const s=t(a);return s&&!i()&&e(s)});return{clear:i,observe:(e=s)=>n.observe(e,r)}},s=()=>{},r=(i,n)=>{const c=t(i),o={selector:i,clear:s,observe:s};if(c)return setTimeout(()=>n(c),0),o;if(e())return setTimeout(()=>r(i,n),1e3),o;if(i.includes("[]"))return((e,s)=>{const[r,i]=s.split("[]").map(e=>e.trim()),n=t(r),c=n?.[i],{clear:o,observe:h}=a(e,s),l=()=>{const a=t(s);return a&&!d()&&e(a)},d=()=>{o(),n?.removeEventListener("load",l)},g=()=>{h(c),"iframe"===n?.localName&&n.addEventListener("load",l)};return g(),{selector:s,clear:d,observe:g}})(n,i);const{clear:h,observe:l}=a(n,i);return l(),{selector:i,clear:h,observe:l}},i=["hasbro","lego","mattel"],n=e=>({"Content-Type":"application/json",Authorization:`Bearer ${e}`}),c=(e,t)=>{const a=e.toLowerCase(),s=t.toLowerCase();return i.some(e=>a.includes(e))&&!i.some(e=>s.includes(e))?-1:i.some(e=>s.includes(e))&&!i.some(e=>a.includes(e))?1:0};(()=>{const t=(()=>{if(e()||(()=>{const e=!!document.getElementById("ABTastyPreviewBar"),t=location.href.includes("ab_project=preview");return e||t})())return!1;const t=ABTasty.getTestsOnPage()[TEST_ID];return!!t&&Object.keys(t.targetings.qaParameters).length>0})(),a=window.document.cookie.includes("abTastyDebug=")||!0===window.abTastyDebug;if(t||a){const e=(()=>{const e=(()=>{const{type:e}=DATA;return`${PACKAGE.replace("@abtasty/","")}${e?`_${e}`:""}`})();return`${e.charAt(0).toUpperCase()}${e.slice(1)}`.split("-").join(" ")})();window.console.log(`%c${e} - ${t?"QA":"Debug"} Mode for campaign ${TEST_ID} %c Widget launch`,"background-color: #D6FF01; color: #3100be; padding: 3px 0 3px 10px; border-radius: 5px 0 0 5px; font-weight: bold;","background-color: #3100be; color: white; padding: 3px 10px 3px 0; border-radius: 0 5px 5px 0;")}})();const o=new class{constructor(){this.baseClassName="abtasty-search-widget",this.search="",this.target=null}async init(){const{elementReferrer:e}=DATA;return new Promise(t=>{r(e,e=>{const a=e.getRootNode();this.rootElement=a,this.target=e,this.target.onclick=e=>{e.preventDefault(),e.stopPropagation(),this.onSearchOpen()},t()})})}insertIn(e,t){return e.insertAdjacentElement(t,this.container),this}removeChildren(e){for(;e.firstChild;)e.removeChild(e.lastChild)}remove(){const e=this.rootElement.querySelector("body");this.removeChildren(this.container),e.removeChild(this.container)}onSearchOpen(){const e=this.rootElement.querySelector("body");this.container=this.getSearchContainerElement(),this.searchBarContainer=this.getSearchBarContainerElement(),this.searchResultsContainer=this.getSearchResultsContainerElement(),this.container.append(this.searchBarContainer,this.searchResultsContainer),this.insertIn(e,"afterbegin"),this.searchInput.focus()}onSearchClose(){this.remove(),document.body.style.overflow="initial"}onInput=e=>{this.search=e.target.value,this.debouncedQuerySuggest()};debouncedQuerySuggest=(()=>(e=>{let t=null;return function(){for(var a=arguments.length,s=new Array(a),r=0;r<a;r++)s[r]=arguments[r];window.clearTimeout(t),t=window.setTimeout(()=>{e(...s)},500)}})(this.onQuerySuggest.bind(this)))();async onSearch(){const{siteId:e,apiKey:t}=DATA;t&&e&&this.search?fetch("https://sellingassistant.netlify.app/.netlify/functions/search",{method:"POST",headers:n(t),body:JSON.stringify({siteId:e,search:this.search,maxPerPage:50})}).then(e=>e.json()).then(e=>this.setSearchResults(e.hits.sort((e,t)=>c(e.name,t.name)).filter(e=>e.link&&e.img_link&&e.price))).catch(e=>{window.console.error(e)}):this.container.classList.remove("search-completed")}async onQuerySuggest(){const{siteId:e,apiKey:t}=DATA;t&&e&&this.search.length>1?fetch("https://sellingassistant.netlify.app/.netlify/functions/querySuggest",{method:"POST",headers:n(t),body:JSON.stringify({siteId:e,search:this.search,suggestLimit:"20"})}).then(e=>e.json()).then(e=>this.setSuggestions(e.querySuggest.map(e=>e.pleinText).sort((e,t)=>c(e,t)).slice(0,4))).catch(e=>{window.console.error(e)}):(this.removeChildren(this.searchResultsContainer),this.container.classList.remove("search-completed"),this.setSuggestions([]))}setSuggestions(e){if(this.removeChildren(this.searchSuggestionsContainer),e.length){const t=this.getSuggestionsElements(e);this.searchBarContainer.style.minHeight="auto",this.searchSuggestionsContainer.append(...t),this.searchSuggestionsContainer.classList.add("visible")}else this.searchBarContainer.style.minHeight=this.getSearchBarContainerHeight(),this.searchSuggestionsContainer.classList.remove("visible")}setSearchResults(e){if(this.container.classList.add("search-completed"),this.removeChildren(this.searchResultsContainer),e.length)for(const[t,a]of e.entries()){const e=document.createElement("a");e.href=a.link,e.target="_blank",e.rel="noreferrer",e.innerHTML=`\n\t\t\t\t\t<div class="${this.baseClassName}-search-result result-${t}">\n\t\t\t\t\t\t<img src="${a.img_link}" />\n\t\t\t\t\t\t<div class="${this.baseClassName}-search-result-name">${a.name}</div>\n\t\t\t\t\t\t<div class="${this.baseClassName}-search-result-price">${a.price}€</div>\n\t\t\t\t\t</div\n\t\t\t\t\t`,this.searchResultsContainer.appendChild(e)}else{const e=document.createElement("div");e.className=`${this.baseClassName}-search-no-result`,e.innerHTML="No results found",this.searchResultsContainer.appendChild(e)}this.searchResultsContainer.classList.add("visible")}getSearchBarContainerHeight(){const e=this.target.closest("header");return e?e.getBoundingClientRect().height+"px":"auto"}getSearchContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-container`,document.head.insertAdjacentElement("afterbegin",(e=>{const t=document.createElement("style");return t.styleSheet?t.styleSheet.cssText=e:t.appendChild(document.createTextNode(e)),t})(".abtasty-search-widget-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;background-color:hsla(0,0%,100%,.5);bottom:0;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-family:Lato,sans-serif;height:100vh;left:0;position:fixed;right:0;top:0;width:100vw;z-index:9999}.abtasty-search-widget-container i{display:inline-block;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}.abtasty-search-widget-container.search-completed{background-color:#fff;height:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container{-webkit-box-orient:vertical;-webkit-box-direction:normal;background-color:#0c4884;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:22.5px 100px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar{background-color:#fff;border-radius:12px;padding:12px;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-input-label{color:#fff;font-size:12px;font-weight:400;line-height:17px;margin-left:auto;margin-right:auto;margin-top:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar-close-button-container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;line-height:unset}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-bar .abtasty-search-widget-search-input{border:unset;font-size:1.6em;font-weight:700;outline:0;padding:unset;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon-container{border:none;border-radius:100%;padding:8px;-webkit-transform:translateX(150%);transform:translateX(150%);vertical-align:middle}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon{background-color:#0c4884;height:28px;-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512' fill='rgba(0, 0, 0, 0.999)'%3E%3Cpath d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25-6.2 6.25-14.4 9.35-22.6 9.35s-16.38-3.125-22.62-9.375L160 301.3 54.63 406.6C48.38 412.9 40.19 416 32 416s-16.37-3.1-22.625-9.4c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512' fill='rgba(0, 0, 0, 0.999)'%3E%3Cpath d='M310.6 361.4c12.5 12.5 12.5 32.75 0 45.25-6.2 6.25-14.4 9.35-22.6 9.35s-16.38-3.125-22.62-9.375L160 301.3 54.63 406.6C48.38 412.9 40.19 416 32 416s-16.37-3.1-22.625-9.4c-12.5-12.5-12.5-32.75 0-45.25l105.4-105.4L9.375 150.6c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L160 210.8l105.4-105.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-105.4 105.4L310.6 361.4z'/%3E%3C/svg%3E\");vertical-align:middle;width:28px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container{display:none;gap:8px;margin-top:12px;overflow-x:auto}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container.visible{display:-webkit-box;display:-ms-flexbox;display:flex}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion{background-color:transparent;border:none;color:#fff;font-size:15px;font-weight:700;max-width:150px;min-width:70px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion>.abtasty-search-widget-search-icon{background-color:#fff;height:12.5px;margin-right:6px;-webkit-mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='rgba(74, 76, 83, 0.999)'%3E%3Cpath d='M500.3 443.7 380.6 324c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723 99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9 53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0 15.606-15.64 15.606-41.04.006-56.64zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128-57.42 128-128 128-128-57.4-128-128z'/%3E%3C/svg%3E\");mask-image:url(\"data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' fill='rgba(74, 76, 83, 0.999)'%3E%3Cpath d='M500.3 443.7 380.6 324c27.22-40.41 40.65-90.9 33.46-144.7C401.8 87.79 326.8 13.32 235.2 1.723 99.01-15.51-15.51 99.01 1.724 235.2c11.6 91.64 86.08 166.7 177.6 178.9 53.8 7.189 104.3-6.236 144.7-33.46l119.7 119.7c15.62 15.62 40.95 15.62 56.57 0 15.606-15.64 15.606-41.04.006-56.64zM79.1 208c0-70.58 57.42-128 128-128s128 57.42 128 128-57.42 128-128 128-128-57.4-128-128z'/%3E%3C/svg%3E\");width:12.5px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-search-suggestions-container>.abtasty-search-widget-search-suggestion:hover{opacity:.8}.abtasty-search-widget-container .abtasty-search-widget-search-results-container{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;display:none;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:24px;justify-content:center;overflow-y:auto;padding:32px}.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr}.abtasty-search-widget-container .abtasty-search-widget-search-results-container .abtasty-search-widget-search-no-result{font-size:38px;font-weight:700;margin-top:82px}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>a>.abtasty-search-widget-search-result{-webkit-box-orient:vertical;-webkit-box-direction:normal;border-radius:12px;-webkit-box-shadow:0 2px 8px 0 rgba(0,0,0,.11);box-shadow:0 2px 8px 0 rgba(0,0,0,.11);display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:400px;padding:18px;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>a>.abtasty-search-widget-search-result img{aspect-ratio:400/450;height:100%;margin-left:auto;margin-right:auto;-o-object-fit:contain;object-fit:contain;width:100%}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>a>.abtasty-search-widget-search-result .abtasty-search-widget-search-result-name{color:#0d4884;display:block;font-size:1.167em;font-weight:900;height:50px;line-height:1.43;margin-top:16px;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase}.abtasty-search-widget-container .abtasty-search-widget-search-results-container>a>.abtasty-search-widget-search-result .abtasty-search-widget-search-result-price{color:#404040;font-size:1.833em;font-weight:900}@media (max-width:1199.98px){.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{grid-template-columns:1fr 1fr 1fr 1fr}}@media (max-width:991.98px){.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{grid-template-columns:1fr 1fr 1fr}}@media (max-width:767.98px){.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{grid-template-columns:1fr 1fr}}@media (max-width:575.98px){.abtasty-search-widget-container .abtasty-search-widget-search-bar-container{padding:22.5px}.abtasty-search-widget-container .abtasty-search-widget-search-bar-container .abtasty-search-widget-close-icon-container{-webkit-transform:translateX(15%);transform:translateX(15%)}.abtasty-search-widget-container .abtasty-search-widget-search-results-container.visible{grid-template-columns:1fr}}")),e}getSearchBarContainerElement(){const{searchLabel:e}=DATA;document.body.style.overflow="hidden";const t=document.createElement("div");t.className=`${this.baseClassName}-search-bar-container`,t.style.minHeight=this.getSearchBarContainerHeight();const a=document.createElement("label");a.className=`${this.baseClassName}-search-input-label`,a.innerHTML=e;const s=document.createElement("div");s.className=`${this.baseClassName}-search-bar-close-button-container`;const r=document.createElement("div");r.className=`${this.baseClassName}-search-bar`;const i=document.createElement("input",{autofocus:!0});i.className=`${this.baseClassName}-search-input`,i.addEventListener("input",this.onInput.bind(this),{capture:!0}),i.addEventListener("change",this.onSearch.bind(this),{capture:!0}),a.htmlFor=i,this.searchInput=i;const n=document.createElement("button");n.className=`${this.baseClassName}-close-icon-container`,n.onclick=this.onSearchClose.bind(this);const c=document.createElement("i");return c.className=`${this.baseClassName}-close-icon`,n.appendChild(c),r.appendChild(i),s.append(r,n),t.appendChild(a),t.appendChild(s),this.searchSuggestionsContainer=this.getSearchSuggestionsContainerElement(),t.appendChild(this.searchSuggestionsContainer),t}getSearchSuggestionsContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-search-suggestions-container`,e}getSuggestionsElements(e){const t=[];for(const a of e){const e=document.createElement("button");e.className=`${this.baseClassName}-search-suggestion`,e.innerHTML=`\n\t\t\t\t<i class="${this.baseClassName}-search-icon"></i>${a}\n\t\t\t`,e.onclick=()=>{this.search=a,this.searchInput.value=a,this.onSearch()},t.push(e)}return t}getSearchResultsContainerElement(){const e=document.createElement("div");return e.className=`${this.baseClassName}-search-results-container`,e}}(DATA);o.init().then(()=>{})}();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@abtasty/search",
   "description": "Search Widget MVP",
-  "version": "0.0.2-0",
+  "version": "0.0.2-1",
   "form": "dist/form.js",
   "main": "dist/main.js",
   "type": "module",
@@ -13,7 +13,7 @@
   "scripts": {
     "cloneConfig": "scp ../rollup.default.config.js ./rollup.config.js && scp ../babel.default.config.json ./babel.config.json",
     "publish:package": "yarn build && yarn npm publish --access public",
-    "publish:staging": "yarn && yarn version prerelease && yarn run publish:package",
+    "publish:staging": "yarn && yarn version prerelease -i && yarn run publish:package",
     "publish:prod": "yarn && yarn version patch && yarn run publish:package",
     "publish:staging:breaking:minor": "yarn && yarn version preminor && yarn run publish:package",
     "publish:breaking:minor": "yarn && yarn version minor && yarn run publish:package",
@@ -44,5 +44,5 @@
     "rollup": "^4.12.0",
     "rollup-plugin-postcss": "^4.0.2"
   },
-  "stableVersion": "0.0.1"
+  "stableVersion": "0.0.2-0"
 }