@abtasty/search 0.0.2-0

package/dist/form.js

@@ -0,0 +1 @@
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).widgetForm=t()}(this,function(){"use strict";const e="layout",t="content",l="text",o={category:e,type:"selectelement",propName:"elementReferrer",label:"widget_common_layout_label_selectElementContainWidget",value:"body"};return delete o.condition,[{type:l,category:t,label:"Search Label",propName:"searchLabel",value:"SEARCH FOR A PRODUCT",placeholder:"SEARCH FOR A PRODUCT"},{type:l,category:t,label:"Api Key",propName:"apiKey",value:""},{type:l,category:t,label:"Site ID",propName:"siteId",value:""},{category:e,type:"group",collapsible:!1,children:[o]}]});

package/dist/main.js

@@ -0,0 +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(()=>{})}();

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@abtasty/search",
+  "description": "Search Widget MVP",
+  "version": "0.0.2-0",
+  "form": "dist/form.js",
+  "main": "dist/main.js",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "author": "ABTasty",
+  "license": "MIT",
+  "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: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",
+    "publish:staging:breaking:major": "yarn && yarn version premajor && yarn run publish:package",
+    "publish:breaking:major": "yarn && yarn version major && yarn run publish:package",
+    "watch": "yarn && yarn run cloneConfig && rollup -c --watch",
+    "build": "yarn && yarn run cloneConfig && rollup -c"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.24.0",
+    "@babel/eslint-parser": "^7.23.10",
+    "@babel/plugin-proposal-object-rest-spread": "^7.18.6",
+    "@babel/preset-env": "^7.24.0",
+    "@rollup/plugin-alias": "5.1.0",
+    "@rollup/plugin-babel": "^6.0.3",
+    "@rollup/plugin-eslint": "^9.0.1",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-terser": "^0.4.4",
+    "babel-plugin-minify-dead-code-elimination": "^0.5.2",
+    "caniuse-lite": "^1.0.30001434",
+    "cssnano": "^5.1.12",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-import-resolver-node": "^0.3.2",
+    "eslint-plugin-import": "^2.29.1",
+    "postcss": "^8.4.19",
+    "postcss-cssnext": "^3.1.1",
+    "rollup": "^4.12.0",
+    "rollup-plugin-postcss": "^4.0.2"
+  },
+  "stableVersion": "0.0.1"
+}