@coveops/abi 0.7.0 → 0.9.0

package/src/components/faq-popup-component/faq-popup-component.tsx

@@ -44,47 +44,63 @@ export class FaqPopupComponent {
 
   private openFAQModal(result: Result) {
     if(this.bindings){
-    const { logClickEvent } = loadGenericAnalyticsActions (this.bindings.engine);
-    const logClickPayload : LogClickEventActionCreatorPayload= { 
-      evt: 'documentQuickview',
-      result: result,
+      const { logClickEvent } = loadGenericAnalyticsActions (this.bindings.engine);
+      const logClickPayload : LogClickEventActionCreatorPayload= { 
+        evt: 'documentQuickview',
+        result: result,
+      }
+      this.bindings.engine.dispatch(logClickEvent(logClickPayload))
     }
-    this.bindings.engine.dispatch(logClickEvent(logClickPayload))
-  }
     this.modalElement.source = this.host; 
-    this.modalElement.querySelector('[slot=header]').children[0].innerHTML = 'Question: ' + (this.result?.title || '');
     // Get the body slot
     const bodySlot = this.modalElement.querySelector('[slot=body]');
 
     // Clear any existing content
     bodySlot.innerHTML = '';
 
-    const answerElement = document.createElement('div');
-    answerElement.style.display = 'flex';
-    answerElement.style.gap = '16px';
+    const tableEl = document.createElement('table');
+
+    const questionElement = document.createElement("tr");
+    questionElement.className = "question-row";
+    questionElement.innerHTML = '<td>Question: </td> <td>' + (this.result?.title || '') + '</td>'
+        +'<div id="faq-modal-close-button"><svg width="48" height="49" viewBox="0 0 48 49" fill="black" xmlns="http://www.w3.org/2000/svg"><rect y="0.5" width="48" height="48" rx="24" fill="white"/><path fill-rule="evenodd" clip-rule="evenodd" d="M22.5382 24.5L15 16.9618L16.4618 15.5L24 23.0382L31.5382 15.5L33 16.9618L25.4618 24.5L33 32.0382L31.5382 33.5L24 25.9618L16.4618 33.5L15 32.0382L22.5382 24.5Z" fill="#17171A"/></svg></div>';
 
+    tableEl.appendChild(questionElement);
+
+    const answerElement = document.createElement('tr');
+    
     // Create the answer title element and set its text
-    const answerTitleElement = document.createElement('div');
+    const answerTitleElement = document.createElement('td');
     answerTitleElement.innerText = 'Answer:';
     answerElement.appendChild(answerTitleElement);
 
-    // Get the answer from the result object
-    const answerContent = this.result?.raw.answer as string || '';
-
     // Create a new element to contain the answer content
-    const answerContentElement = document.createElement('div');
-    answerContentElement.innerHTML = answerContent;
+    const answerContentElement = document.createElement('td');
+    answerContentElement.innerHTML = this.result?.raw.answer as string || '';
 
     // Append the answer content element to the answer element
     answerElement.appendChild(answerContentElement);
 
     // Now, the answer element has the title and the content properly appended
 
-    bodySlot.appendChild(answerElement);
+    tableEl.appendChild(answerElement);
 
 
+    if(this.result?.raw.category) {
+      const categoryElement = document.createElement("tr");
+      categoryElement.innerHTML = '<td> Category: </td><td>'+ this.result.raw.category + '</td>';
+      tableEl.appendChild(categoryElement);
+    }
+
+    if(this.result?.raw.newmoreinfo) {
+      const linkElement = document.createElement("tr");
+      const linkUrl = this.result.raw.newmoreinfo;
+      linkElement.innerHTML = '<td> Link: </td><td> <a href="'+linkUrl+'" target="_blank">'+linkUrl+'</a> </td>';
+      tableEl.appendChild(linkElement);
+    }
+
     // Create and append the category element
-    const categoryElement = document.createElement('div');
+    /*const categoryElement = document.createElement('div');
     categoryElement.innerHTML = 'Category: ' + (this.result?.raw.category || '');
     bodySlot.appendChild(categoryElement);
 
@@ -94,9 +110,11 @@ export class FaqPopupComponent {
     const linkElement = document.createElement('div');
     const linkUrl = this.result?.raw.newmoreinfo || '';
     linkElement.innerHTML = `Link: <a href="${linkUrl}" target="_blank">${linkUrl}</a>`;
-    bodySlot.appendChild(linkElement);
+    bodySlot.appendChild(linkElement);*/
+
+    bodySlot.appendChild(tableEl);
 
-    this.modalElement.querySelector('#faq-modal-close').addEventListener('click', this.closeFAQModal);
+    this.modalElement.querySelector('#faq-modal-close-button').addEventListener('click', this.closeFAQModal);
     this.modalElement.setAttribute('is-open', 'true');
 
     if (this.result) {

package/src/components/results-manager/QuickLinksTemplate.html

@@ -44,6 +44,13 @@
         display: grid;
         align-items: center;
     }
+
+    atomic-result-section-excerpt {
+    font-size: 1.3rem !important;
+    margin-top: 2px !important;
+    max-height: unset !important;
+    line-height: normal !important;
+  }
 </style>
 
 <atomic-result-section-visual>

package/src/pages/index.html

@@ -60,7 +60,7 @@
      
     </div>
     <div slot="body" style="max-width: none;">This is the body</div>
-    <!-- <div slot="footer"><button id="btn-done">Done</button></div> -->
+    <div slot="footer"><button id="btn-done">Done</button></div>
   </atomic-modal>
       <atomic-search-layout>
         <atomic-layout-section style="justify-self:center" section="search">

package/src/style/index.css

@@ -4,12 +4,6 @@ body {
 
 }
 
-atomic-modal#faq-modal::part(header-wrapper) {
-display: grid;
-width: 100%;
-padding-right: 0px !important;
-}
-
 atomic-search-box::part(wrapper) {
   border-radius: 30px;
   border: thin solid #7e8c9a;
@@ -51,28 +45,67 @@ atomic-pager::part(page-button):hover {
   cursor: pointer;
 }
 
-atomic-modal#faq-modal::part(header-wrapper) {
-  display: grid;
-  width: 100%;
-  padding-right: 0px !important;
-  }
-
-
 atomic-result-section-visual {
     height: 6rem !important;
     width: 3rem !important;
 }
 
+atomic-modal#faq-modal::part(header-wrapper) {
+  display: none;
+}
 atomic-modal::part(backdrop){
   grid-template-columns: none !important;
 }
 atomic-modal::part(header){
   max-width: none;
-  }
+}
+atomic-modal::part(body-wrapper) {
+  padding: 0;
+}
 atomic-modal::part(body){
   max-width: none;
-  }
+}
+
+atomic-modal::part(footer),
+atomic-modal::part(footer-wrapper) {
+  display: none;
+}
+
+atomic-modal#faq-modal table {
+  width: -moz-available;          /* WebKit-based browsers will ignore this. */
+  width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
+  width: fill-available;
+  border-collapse: collapse;
+  font-size: 1.3rem;
+}
+
+atomic-modal#faq-modal table tr.question-row {
+  border-bottom: 1px solid #a6a6a6;
+}
+
+atomic-modal#faq-modal table tr {
+  vertical-align: top;
+}
+
+atomic-modal#faq-modal table tr td {
+  padding: 1.5rem;
+}
+atomic-modal#faq-modal table tr td a {
+  color: #caa144;
+}
+
+
+atomic-modal#faq-modal #faq-modal-close-button {
+  cursor: pointer;
+  top: 0;
+  right: 1.5rem;
+  position: absolute;
+}
+
+atomic-search-box::part(recent-query-text), 
+atomic-search-box::part(input), 
+atomic-search-box::part(query-suggestion-text) {
+  font-size: 1.3rem !important
+}
+
 
-  atomic-search-box::part(recent-query-text), 
-  atomic-search-box::part(input), 
-  atomic-search-box::part(query-suggestion-text) {font-size: 1.3rem !important}

package/dist/abi/p-3d7bc0f4.entry.js

@@ -1 +0,0 @@
-import{r as t,h as i,g as s,H as o}from"./p-52c70e74.js";import{i as e,F as a}from"./p-0f4a7ce9.js";import{r as c}from"./p-b83bab81.js";import"./p-d20ee37c.js";const h=class{constructor(i){t(this,i),this.closeFAQModal=()=>{this.modalElement.setAttribute("is-open","false"),this.modalElement.querySelector("#btn-done").removeEventListener("click",this.closeFAQModal)}}async connectedCallback(){var t;try{this.bindings=await e(this.host),this.result=await c(this.host),this.modalElement=null===(t=this.bindings)||void 0===t?void 0:t.interfaceElement.querySelector("#faq-modal"),this.result&&localStorage.getItem(`visited-${this.result.title}`)&&this.host.classList.add("visited-title")}catch(t){console.error(t),this.host.remove()}}openFAQModal(t){var i,s,o,e;if(this.bindings){const{logClickEvent:i}=a(this.bindings.engine);this.bindings.engine.dispatch(i({evt:"documentQuickview",result:t}))}this.modalElement.source=this.host,this.modalElement.querySelector("[slot=header]").children[0].innerHTML="Question: "+((null===(i=this.result)||void 0===i?void 0:i.title)||"");const c=this.modalElement.querySelector("[slot=body]");c.innerHTML="";const h=document.createElement("div");h.style.display="flex",h.style.gap="16px";const n=document.createElement("div");n.innerText="Answer:",h.appendChild(n);const l=(null===(s=this.result)||void 0===s?void 0:s.raw.answer)||"",r=document.createElement("div");r.innerHTML=l,h.appendChild(r),c.appendChild(h);const d=document.createElement("div");d.innerHTML="Category: "+((null===(o=this.result)||void 0===o?void 0:o.raw.category)||""),c.appendChild(d);const v=document.createElement("div"),u=(null===(e=this.result)||void 0===e?void 0:e.raw.newmoreinfo)||"";v.innerHTML=`Link: <a href="${u}" target="_blank">${u}</a>`,c.appendChild(v),this.modalElement.querySelector("#faq-modal-close").addEventListener("click",this.closeFAQModal),this.modalElement.setAttribute("is-open","true"),this.result&&localStorage.setItem(`visited-${this.result.title}`,"true"),this.host.classList.add("visited-title")}render(){if(this.result)return i(o,{className:"clickable-host",onClick:()=>this.openFAQModal(this.result)},this.result.title)}get host(){return s(this)}};h.style="b{color:var(--atomic-primary)}";export{h as faq_popup_component}

package/dist/abi/p-52c70e74.js

@@ -1,2 +0,0 @@
-let e,t,n=!1;const l="undefined"!=typeof window?window:{},s=l.document||{head:{}},o={t:0,l:"",jmp:e=>e(),raf:e=>requestAnimationFrame(e),ael:(e,t,n,l)=>e.addEventListener(t,n,l),rel:(e,t,n,l)=>e.removeEventListener(t,n,l),ce:(e,t)=>new CustomEvent(e,t)},c=e=>Promise.resolve(e),r=(()=>{try{return new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync}catch(e){}return!1})(),i=new WeakMap,a=e=>"sc-"+e.o,u={},f=e=>"object"==(e=typeof e)||"function"===e,$=(e,t,...n)=>{let l=null,s=!1,o=!1;const c=[],r=t=>{for(let n=0;n<t.length;n++)l=t[n],Array.isArray(l)?r(l):null!=l&&"boolean"!=typeof l&&((s="function"!=typeof e&&!f(l))&&(l+=""),s&&o?c[c.length-1].i+=l:c.push(s?y(null,l):l),o=s)};if(r(n),t){const e=t.className||t.class;e&&(t.class="object"!=typeof e?e:Object.keys(e).filter((t=>e[t])).join(" "))}const i=y(e,null);return i.u=t,c.length>0&&(i.$=c),i},y=(e,t)=>({t:0,m:e,i:t,p:null,$:null,u:null}),d={},m=(e,t,n,s,c,r)=>{if(n!==s){let i=z(e,t),a=t.toLowerCase();if("class"===t){const t=e.classList,l=h(n),o=h(s);t.remove(...l.filter((e=>e&&!o.includes(e)))),t.add(...o.filter((e=>e&&!l.includes(e))))}else if("style"===t){for(const t in n)s&&null!=s[t]||(t.includes("-")?e.style.removeProperty(t):e.style[t]="");for(const t in s)n&&s[t]===n[t]||(t.includes("-")?e.style.setProperty(t,s[t]):e.style[t]=s[t])}else if(i||"o"!==t[0]||"n"!==t[1]){const l=f(s);if((i||l&&null!==s)&&!c)try{if(e.tagName.includes("-"))e[t]=s;else{const l=null==s?"":s;"list"===t?i=!1:null!=n&&e[t]==l||(e[t]=l)}}catch(e){}null==s||!1===s?!1===s&&""!==e.getAttribute(t)||e.removeAttribute(t):(!i||4&r||c)&&!l&&e.setAttribute(t,s=!0===s?"":s)}else t="-"===t[2]?t.slice(3):z(l,a)?a.slice(2):a[2]+t.slice(3),n&&o.rel(e,t,n,!1),s&&o.ael(e,t,s,!1)}},p=/\s/,h=e=>e?e.split(p):[],b=(e,t,n,l)=>{const s=11===t.p.nodeType&&t.p.host?t.p.host:t.p,o=e&&e.u||u,c=t.u||u;for(l in o)l in c||m(s,l,o[l],void 0,n,t.t);for(l in c)m(s,l,o[l],c[l],n,t.t)},w=(t,n,l)=>{const o=n.$[l];let c,r,i=0;if(null!==o.i)c=o.p=s.createTextNode(o.i);else if(c=o.p=s.createElement(o.m),b(null,o,!1),null!=e&&c["s-si"]!==e&&c.classList.add(c["s-si"]=e),o.$)for(i=0;i<o.$.length;++i)r=w(t,o,i),r&&c.appendChild(r);return c},S=(e,n,l,s,o,c)=>{let r,i=e;for(i.shadowRoot&&i.tagName===t&&(i=i.shadowRoot);o<=c;++o)s[o]&&(r=w(null,l,o),r&&(s[o].p=r,i.insertBefore(r,n)))},g=(e,t,n,l)=>{for(;t<=n;++t)(l=e[t])&&l.p.remove()},j=(e,t)=>e.m===t.m,k=(e,t)=>{const n=t.p=e.p,l=e.$,s=t.$,o=t.i;null===o?(b(e,t,!1),null!==l&&null!==s?((e,t,n,l)=>{let s,o=0,c=0,r=t.length-1,i=t[0],a=t[r],u=l.length-1,f=l[0],$=l[u];for(;o<=r&&c<=u;)null==i?i=t[++o]:null==a?a=t[--r]:null==f?f=l[++c]:null==$?$=l[--u]:j(i,f)?(k(i,f),i=t[++o],f=l[++c]):j(a,$)?(k(a,$),a=t[--r],$=l[--u]):j(i,$)?(k(i,$),e.insertBefore(i.p,a.p.nextSibling),i=t[++o],$=l[--u]):j(a,f)?(k(a,f),e.insertBefore(a.p,i.p),a=t[--r],f=l[++c]):(s=w(t&&t[c],n,c),f=l[++c],s&&i.p.parentNode.insertBefore(s,i.p));o>r?S(e,null==l[u+1]?null:l[u+1].p,n,l,c,u):c>u&&g(t,o,r)})(n,l,t,s):null!==s?(null!==e.i&&(n.textContent=""),S(n,null,t,s,0,s.length-1)):null!==l&&g(l,0,l.length-1)):e.i!==o&&(n.data=o)},C=e=>F(e).h,v=(e,t)=>{t&&!e.S&&t["s-p"]&&t["s-p"].push(new Promise((t=>e.S=t)))},M=(e,t)=>{if(e.t|=16,!(4&e.t))return v(e,e.g),ee((()=>O(e,t)));e.t|=512},O=(e,t)=>{const n=e.j;let l;return t&&(l=T(n,"componentWillLoad")),W(l,(()=>P(e,n,t)))},P=async(e,t,n)=>{const l=e.h,o=l["s-rc"];n&&(e=>{const t=e.k,n=e.h,l=t.t,o=((e,t)=>{let n=a(t);const l=I.get(n);if(e=11===e.nodeType?e:s,l)if("string"==typeof l){let t,o=i.get(e=e.head||e);o||i.set(e,o=new Set),o.has(n)||(t=s.createElement("style"),t.innerHTML=l,e.insertBefore(t,e.querySelector("link")),o&&o.add(n))}else e.adoptedStyleSheets.includes(l)||(e.adoptedStyleSheets=[...e.adoptedStyleSheets,l]);return n})(n.shadowRoot?n.shadowRoot:n.getRootNode(),t);10&l&&(n["s-sc"]=o,n.classList.add(o+"-h"))})(e);x(e,t),o&&(o.map((e=>e())),l["s-rc"]=void 0);{const t=l["s-p"],n=()=>E(e);0===t.length?n():(Promise.all(t).then(n),e.t|=4,t.length=0)}},x=(n,l)=>{try{l=l.render(),n.t&=-17,n.t|=2,((n,l)=>{const s=n.h,o=n.C||y(null,null),c=(e=>e&&e.m===d)(l)?l:$(null,null,l);t=s.tagName,c.m=null,c.t|=4,n.C=c,c.p=o.p=s.shadowRoot||s,e=s["s-sc"],k(o,c)})(n,l)}catch(e){B(e,n.h)}return null},E=e=>{const t=e.h,n=e.g;64&e.t||(e.t|=64,A(t),e.v(t),n||N()),e.S&&(e.S(),e.S=void 0),512&e.t&&Z((()=>M(e,!1))),e.t&=-517},L=e=>{{const t=F(e),n=t.h.isConnected;return n&&2==(18&t.t)&&M(t,!1),n}},N=()=>{A(s.documentElement),Z((()=>(e=>{const t=o.ce("appload",{detail:{namespace:"abi"}});return e.dispatchEvent(t),t})(l)))},T=(e,t,n)=>{if(e&&e[t])try{return e[t](n)}catch(e){B(e)}},W=(e,t)=>e&&e.then?e.then(t):t(),A=e=>e.classList.add("hydrated"),H=(e,t,n)=>{if(t.M){const l=Object.entries(t.M),s=e.prototype;l.map((([e,[t]])=>{(31&t||2&n&&32&t)&&Object.defineProperty(s,e,{get(){return((e,t)=>F(this).O.get(t))(0,e)},set(t){((e,t,n)=>{const l=F(e),s=l.O.get(t),o=l.t,c=l.j;n=(e=>(null==e||f(e),e))(n),8&o&&void 0!==s||n===s||Number.isNaN(s)&&Number.isNaN(n)||(l.O.set(t,n),c&&2==(18&o)&&M(l,!1))})(this,e,t)},configurable:!0,enumerable:!0})}))}return e},R=e=>{T(e,"connectedCallback")},U=(e,t={})=>{const n=[],c=t.exclude||[],i=l.customElements,u=s.head,f=u.querySelector("meta[charset]"),$=s.createElement("style"),y=[];let d,m=!0;Object.assign(o,t),o.l=new URL(t.resourcesUrl||"./",s.baseURI).href,e.map((e=>{e[1].map((t=>{const l={t:t[0],o:t[1],M:t[2],P:t[3]};l.M=t[2];const s=l.o,u=class extends HTMLElement{constructor(e){super(e),_(e=this,l),1&l.t&&e.attachShadow({mode:"open"})}connectedCallback(){d&&(clearTimeout(d),d=null),m?y.push(this):o.jmp((()=>(e=>{if(0==(1&o.t)){const t=F(e),n=t.k,l=()=>{};if(1&t.t)R(t.j);else{t.t|=1;{let n=e;for(;n=n.parentNode||n.host;)if(n["s-p"]){v(t,t.g=n);break}}(async(e,t,n,l,s)=>{if(0==(32&t.t)){{if(t.t|=32,(s=G(n)).then){const e=()=>{};s=await s,e()}s.isProxied||(H(s,n,2),s.isProxied=!0);const e=()=>{};t.t|=8;try{new s(t)}catch(e){B(e)}t.t&=-9,e(),R(t.j)}if(s.style){let e=s.style;const t=a(n);if(!I.has(t)){const l=()=>{};((e,t,n)=>{let l=I.get(e);r&&n?(l=l||new CSSStyleSheet,"string"==typeof l?l=t:l.replaceSync(t)):l=t,I.set(e,l)})(t,e,!!(1&n.t)),l()}}}const o=t.g,c=()=>M(t,!0);o&&o["s-rc"]?o["s-rc"].push(c):c()})(0,t,n)}l()}})(this)))}disconnectedCallback(){o.jmp((()=>(()=>{0==(1&o.t)&&T(F(this).j,"disconnectedCallback")})()))}componentOnReady(){return F(this).L}};l.N=e[0],c.includes(s)||i.get(s)||(n.push(s),i.define(s,H(u,l,1)))}))})),$.innerHTML=n+"{visibility:hidden}.hydrated{visibility:inherit}",$.setAttribute("data-styles",""),u.insertBefore($,f?f.nextSibling:u.firstChild),m=!1,y.length?y.map((e=>e.connectedCallback())):o.jmp((()=>d=setTimeout(N,30)))},q=new WeakMap,F=e=>q.get(e),V=(e,t)=>q.set(t.j=e,t),_=(e,t)=>{const n={t:0,h:e,k:t,O:new Map};return n.L=new Promise((e=>n.v=e)),e["s-p"]=[],e["s-rc"]=[],q.set(e,n)},z=(e,t)=>t in e,B=(e,t)=>(0,console.error)(e,t),D=new Map,G=e=>{const t=e.o.replace(/-/g,"_"),n=e.N,l=D.get(n);return l?l[t]:import(`./${n}.entry.js`).then((e=>(D.set(n,e),e[t])),B)
-/*!__STENCIL_STATIC_IMPORT_SWITCH__*/},I=new Map,J=[],K=[],Q=(e,t)=>l=>{e.push(l),n||(n=!0,t&&4&o.t?Z(Y):o.raf(Y))},X=e=>{for(let t=0;t<e.length;t++)try{e[t](performance.now())}catch(e){B(e)}e.length=0},Y=()=>{X(J),X(K),(n=J.length>0)&&o.raf(Y)},Z=e=>c().then(e),ee=Q(K,!0);export{d as H,U as b,L as f,C as g,$ as h,c as p,V as r}