@coveops/abi 0.3.2 → 0.4.1

package/dist/esm/abi.js

@@ -0,0 +1,17 @@
+import { p as promiseResolve, b as bootstrapLazy } from './index-51334f26.js';
+
+/*
+ Stencil Client Patch Browser v2.17.3 | MIT Licensed | https://stenciljs.com
+ */
+const patchBrowser = () => {
+    const importMeta = import.meta.url;
+    const opts = {};
+    if (importMeta !== '') {
+        opts.resourcesUrl = new URL('.', importMeta).href;
+    }
+    return promiseResolve(opts);
+};
+
+patchBrowser().then(options => {
+  return bootstrapLazy([["faq-popup-component",[[1,"faq-popup-component",{"result":[32]}]]],["results-manager",[[0,"results-manager"]]],["sample-component",[[1,"sample-component",{"pagerState":[32],"statusState":[32]}]]]], options);
+});

package/dist/esm/faq-popup-component.entry.js

@@ -0,0 +1,109 @@
+import { r as registerInstance, h, g as getElement, H as Host } from './index-51334f26.js';
+import { b as buildCustomEvent, c as closest, i as initializeBindings, F as Fde } from './index-77ebb3d5.js';
+
+class MissingResultParentError extends Error {
+  constructor(elementName) {
+    super(`The "${elementName}" element must be the child of an "atomic-result" element.`);
+  }
+}
+const resultContextEventName = 'atomic/resolveResult';
+/**
+ * Retrieves `Result` on a rendered `atomic-result`.
+ *
+ * This method is useful for building custom result template elements, see [Create a Result List](https://docs.coveo.com/en/atomic/latest/usage/create-a-result-list/) for more information.
+ *
+ * You should use the method in the [connectedCallback lifecycle method](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements#using_the_lifecycle_callbacks).
+ *
+ * @param element The element that the event is dispatched to, which must be the child of a rendered "atomic-result".
+ * @returns A promise that resolves on initialization of the parent "atomic-result" element, or rejects when there is no parent "atomic-result" element.
+ */
+function resultContext(element) {
+  return new Promise((resolve, reject) => {
+    const event = buildCustomEvent(resultContextEventName, (result) => {
+      return resolve(result);
+    });
+    element.dispatchEvent(event);
+    if (!closest(element, 'atomic-result')) {
+      reject(new MissingResultParentError(element.nodeName.toLowerCase()));
+    }
+  });
+}
+
+const faqPopupComponentCss = "b{color:var(--atomic-primary)}";
+
+const FaqPopupComponent = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.closeFAQModal = () => {
+      this.modalElement.setAttribute('is-open', 'false');
+      this.modalElement.querySelector('#btn-done').removeEventListener('click', this.closeFAQModal);
+    };
+  }
+  // We recommended fetching the result context using the `connectedCallback` lifecycle method
+  // with async/await. Using `componentWillLoad` will hang the parent `atomic-search-interface` initialization.
+  async connectedCallback() {
+    var _a;
+    try {
+      this.bindings = await initializeBindings(this.host);
+      this.result = await resultContext(this.host);
+      this.modalElement = (_a = this.bindings) === null || _a === void 0 ? void 0 : _a.interfaceElement.querySelector('#faq-modal');
+    }
+    catch (error) {
+      console.error(error);
+      this.host.remove();
+    }
+  }
+  openFAQModal(result) {
+    var _a, _b, _c, _d;
+    if (this.bindings) {
+      const { logClickEvent } = Fde(this.bindings.engine);
+      const logClickPayload = {
+        evt: 'documentQuickview',
+        result: result,
+      };
+      this.bindings.engine.dispatch(logClickEvent(logClickPayload));
+    }
+    this.modalElement.source = this.host;
+    this.modalElement.querySelector('[slot=header]').children[0].innerHTML = 'Question: ' + (((_a = this.result) === null || _a === void 0 ? void 0 : _a.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';
+    // Create the answer title element and set its text
+    const answerTitleElement = document.createElement('div');
+    answerTitleElement.innerText = 'Answer:';
+    answerElement.appendChild(answerTitleElement);
+    // Get the answer from the result object
+    const answerContent = ((_b = this.result) === null || _b === void 0 ? void 0 : _b.raw.answer) || '';
+    // Create a new element to contain the answer content
+    const answerContentElement = document.createElement('div');
+    answerContentElement.innerHTML = answerContent;
+    // 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);
+    // Create and append the category element
+    const categoryElement = document.createElement('div');
+    categoryElement.innerHTML = 'Category: ' + (((_c = this.result) === null || _c === void 0 ? void 0 : _c.raw.category) || '');
+    bodySlot.appendChild(categoryElement);
+    const linkElement = document.createElement('div');
+    const linkUrl = ((_d = this.result) === null || _d === void 0 ? void 0 : _d.raw.newmoreinfo) || '';
+    linkElement.innerHTML = `Link: <a href="${linkUrl}" target="_blank">${linkUrl}</a>`;
+    bodySlot.appendChild(linkElement);
+    this.modalElement.querySelector('#faq-modal-close').addEventListener('click', this.closeFAQModal);
+    this.modalElement.setAttribute('is-open', 'true');
+  }
+  render() {
+    if (!this.result) {
+      return;
+    }
+    return (h(Host, { className: "clickable-host", onClick: () => this.openFAQModal(this.result) }, this.result.title));
+  }
+  get host() { return getElement(this); }
+};
+FaqPopupComponent.style = faqPopupComponentCss;
+
+export { FaqPopupComponent as faq_popup_component };