@searchcraft/javascript-sdk 0.7.0 → 0.7.1

package/dist/cjs/index.cjs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const styles = require('./styles-7b2d06f2.js');
-const store = require('./store-abe47006.js');
+const store = require('./store-f6ba3dfb.js');
 
 
 

package/dist/cjs/loader.cjs.js

@@ -2,13 +2,13 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-d4b4a45e.js');
+const index = require('./index-a81df4f0.js');
 const appGlobals = require('./app-globals-3a1e7e63.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["searchcraft-filter-panel.cjs",[[0,"searchcraft-filter-panel",{"items":[16],"unsubscribe":[32],"lastQuery":[32]}]]],["searchcraft-base-search-results.cjs",[[4,"searchcraft-base-search-results",{"adInterval":[2,"ad-interval"],"customStylesForResults":[1,"custom-styles-for-results"],"searchResultMappings":[16],"placeAdAtEnd":[4,"place-ad-at-end"],"placeAdAtStart":[4,"place-ad-at-start"],"resultImagePlacement":[1,"result-image-placement"],"buttonLabel":[1,"button-label"],"buttonTarget":[1,"button-target"],"buttonRel":[1,"button-rel"],"containerTarget":[1,"container-target"],"containerRel":[1,"container-rel"],"hasSearched":[32],"query":[32],"searchResults":[32]}]]],["searchcraft-popover-button.cjs",[[4,"searchcraft-popover-button"]]],["searchcraft-results-info.cjs",[[0,"searchcraft-results-info",{"isRequesting":[32],"resultsCount":[32],"responseTime":[32],"query":[32]}]]],["searchcraft-base-search-result.cjs",[[0,"searchcraft-base-search-result",{"titleContent":[1,"title-content"],"subtitleContent":[1,"subtitle-content"],"bodyContent":[1,"body-content"],"footerContent":[1,"footer-content"],"buttonLabel":[1,"button-label"],"buttonHref":[1,"button-href"],"buttonTarget":[1,"button-target"],"buttonRel":[1,"button-rel"],"containerHref":[1,"container-href"],"containerTarget":[1,"container-target"],"containerRel":[1,"container-rel"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"imagePlacement":[1,"image-placement"],"customStyles":[1,"custom-styles"],"documentPosition":[2,"document-position"]}]]],["searchcraft-popover-list-item.cjs",[[0,"searchcraft-popover-list-item",{"titleContent":[1,"title-content"],"subtitleContent":[1,"subtitle-content"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"href":[1],"documentPosition":[2,"document-position"]}]]],["searchcraft-button_3.cjs",[[0,"searchcraft-button",{"iconElement":[16],"iconOnly":[4,"icon-only"],"iconPosition":[1,"icon-position"],"label":[1],"isRequesting":[32]}],[0,"searchcraft-input-label",{"inputLabelClassName":[1,"input-label-class-name"],"label":[1]}],[0,"searchcraft-error-message",{"errorMessage":[1,"error-message"]}]]],["searchcraft-input-form_2.cjs",[[0,"searchcraft-input-form",{"config":[16],"autoSearch":[4,"auto-search"],"buttonPlacement":[1,"button-placement"],"buttonLabel":[1,"button-label"],"inputLabel":[1,"input-label"],"customStyles":[1,"custom-styles"],"placeholderValue":[1,"placeholder-value"],"searchTerm":[1,"search-term"],"inputValue":[32],"error":[32],"isSearchcraftInitialized":[32]},null,{"config":["onConfigChange"]}],[0,"searchcraft-popover-list-view",{"popoverResultMappings":[16],"documents":[16]}]]],["searchcraft-popover-form.cjs",[[0,"searchcraft-popover-form",{"config":[16],"type":[1],"popoverResultMappings":[16],"hotkey":[1],"hotkeyModifier":[1,"hotkey-modifier"],"isPopoverVisibleInState":[32],"unsubscribe":[32],"searchResults":[32],"searchTerm":[32],"isFocused":[32],"breakpointSm":[32],"breakpointMd":[32],"breakpointLg":[32],"modalElement":[32]}]]],["searchcraft-facet-list_3.cjs",[[0,"searchcraft-facet-list",{"fieldName":[1,"field-name"],"baseFacetRoot":[32],"facetRoot":[32],"selectedPaths":[32],"lastTimeTaken":[32],"hasNewSearchTerm":[32],"lastQuery":[32],"lastSearchMode":[32],"lastSortType":[32],"unsubscribe":[32]}],[0,"searchcraft-slider",{"max":[2],"min":[2],"granularity":[2],"dataType":[1,"data-type"],"endValue":[32],"startValue":[32],"lastFocusedHandle":[32]}],[0,"searchcraft-toggle-button",{"label":[1],"subLabel":[1,"sub-label"],"isActive":[32],"unsubscribe":[32],"lastQuery":[32]}]]]], options);
+  return index.bootstrapLazy([["searchcraft-filter-panel.cjs",[[0,"searchcraft-filter-panel",{"items":[16],"unsubscribe":[32],"lastQuery":[32]}]]],["searchcraft-base-search-results.cjs",[[4,"searchcraft-base-search-results",{"adInterval":[2,"ad-interval"],"customStylesForResults":[1,"custom-styles-for-results"],"searchResultMappings":[16],"placeAdAtEnd":[4,"place-ad-at-end"],"placeAdAtStart":[4,"place-ad-at-start"],"resultImagePlacement":[1,"result-image-placement"],"buttonLabel":[1,"button-label"],"buttonTarget":[1,"button-target"],"buttonRel":[1,"button-rel"],"containerTarget":[1,"container-target"],"containerRel":[1,"container-rel"],"hasSearched":[32],"query":[32],"searchResults":[32]}]]],["searchcraft-popover-button.cjs",[[4,"searchcraft-popover-button"]]],["searchcraft-results-info.cjs",[[0,"searchcraft-results-info",{"isRequesting":[32],"resultsCount":[32],"responseTime":[32],"query":[32]}]]],["searchcraft-theme.cjs",[[0,"searchcraft-theme"]]],["searchcraft-base-search-result.cjs",[[0,"searchcraft-base-search-result",{"titleContent":[1,"title-content"],"subtitleContent":[1,"subtitle-content"],"bodyContent":[1,"body-content"],"footerContent":[1,"footer-content"],"buttonLabel":[1,"button-label"],"buttonHref":[1,"button-href"],"buttonTarget":[1,"button-target"],"buttonRel":[1,"button-rel"],"containerHref":[1,"container-href"],"containerTarget":[1,"container-target"],"containerRel":[1,"container-rel"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"imagePlacement":[1,"image-placement"],"customStyles":[1,"custom-styles"],"documentPosition":[2,"document-position"]}]]],["searchcraft-popover-list-item.cjs",[[0,"searchcraft-popover-list-item",{"titleContent":[1,"title-content"],"subtitleContent":[1,"subtitle-content"],"imageSrc":[1,"image-src"],"imageAlt":[1,"image-alt"],"href":[1],"documentPosition":[2,"document-position"]}]]],["searchcraft-button_3.cjs",[[0,"searchcraft-button",{"iconElement":[16],"iconOnly":[4,"icon-only"],"iconPosition":[1,"icon-position"],"label":[1],"isRequesting":[32]}],[0,"searchcraft-input-label",{"inputLabelClassName":[1,"input-label-class-name"],"label":[1]}],[0,"searchcraft-error-message",{"errorMessage":[1,"error-message"]}]]],["searchcraft-input-form_2.cjs",[[0,"searchcraft-input-form",{"config":[16],"autoSearch":[4,"auto-search"],"buttonPlacement":[1,"button-placement"],"buttonLabel":[1,"button-label"],"inputLabel":[1,"input-label"],"customStyles":[1,"custom-styles"],"placeholderValue":[1,"placeholder-value"],"searchTerm":[1,"search-term"],"inputValue":[32],"error":[32],"isSearchcraftInitialized":[32]},null,{"config":["onConfigChange"]}],[0,"searchcraft-popover-list-view",{"popoverResultMappings":[16],"documents":[16]}]]],["searchcraft-popover-form.cjs",[[0,"searchcraft-popover-form",{"config":[16],"type":[1],"popoverResultMappings":[16],"hotkey":[1],"hotkeyModifier":[1,"hotkey-modifier"],"isPopoverVisibleInState":[32],"unsubscribe":[32],"searchResults":[32],"searchTerm":[32],"isFocused":[32],"breakpointSm":[32],"breakpointMd":[32],"breakpointLg":[32],"modalElement":[32]}]]],["searchcraft-facet-list_3.cjs",[[0,"searchcraft-facet-list",{"fieldName":[1,"field-name"],"baseFacetRoot":[32],"facetRoot":[32],"selectedPaths":[32],"lastTimeTaken":[32],"hasNewSearchTerm":[32],"lastQuery":[32],"lastSearchMode":[32],"lastSortType":[32],"unsubscribe":[32]}],[0,"searchcraft-slider",{"max":[2],"min":[2],"granularity":[2],"dataType":[1,"data-type"],"endValue":[32],"startValue":[32],"lastFocusedHandle":[32]}],[0,"searchcraft-toggle-button",{"label":[1],"subLabel":[1,"sub-label"],"isActive":[32],"unsubscribe":[32],"lastQuery":[32]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/searchcraft-base-search-result.cjs.entry.js

@@ -2,55 +2,103 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-d4b4a45e.js');
-const store = require('./store-abe47006.js');
-
-const searchcraftBaseSearchResultModuleCss = ":root{--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px;--sc-popover-form-border-radius:8px;--sc-popover-list-view-height:400px;--sc-popover-list-item-image-size:60px;--sc-popover-list-item-padding-horizontal:8px;--sc-popover-list-item-padding-vertical:8px;--sc-popover-modal-max-width:570px}:root{--sc-surface-disabled:#D9D9D9;--sc-surface-neutral-primary:#FFFFFF;--sc-surface-neutral-secondary:#F3F3F3;--sc-surface-neutral-light:#FFFFFF;--sc-surface-neutral-primary-hover:#FAFAFA;--sc-surface-neutral-primary-active:#F7F7F7;--sc-surface-neutral-secondary-hover:#EDEDED;--sc-surface-neutral-secondary-active:#E6E6E6;--sc-surface-brand-primary:#000000;--sc-surface-brand-secondary:#E6E6E6;--sc-surface-brand-primary-hover:#2E2E2E;--sc-surface-brand-primary-active:#292929;--sc-surface-brand-secondary-hover:#EBEBEB;--sc-surface-brand-secondary-active:#E0E0E0;--sc-surface-success-primary:#008000;--sc-surface-success-secondary:#CCFFCC;--sc-surface-success-primary-hover:#009900;--sc-surface-success-primary-active:#006600;--sc-surface-success-secondary-hover:#E6FFE6;--sc-surface-success-secondary-active:#E6FFE6;--sc-surface-caution-primary:#CC6600;--sc-surface-caution-secondary:#FFD9B3;--sc-surface-caution-primary-hover:#E57300;--sc-surface-caution-primary-active:#B25A00;--sc-surface-caution-secondary-hover:#FFE5CC;--sc-surface-caution-secondary-active:#FFCC99;--sc-surface-danger-primary:#CC0000;--sc-surface-danger-secondary:#FFCCCC;--sc-surface-danger-primary-hover:#E50000;--sc-surface-danger-primary-active:#B30000;--sc-surface-danger-secondary-hover:#FFE7E7;--sc-surface-danger-secondary-active:#FFB3B3;--sc-content-brand:#000000;--sc-content-success:#008000;--sc-content-caution:#994D00;--sc-content-danger:#990000;--sc-content-disabled:#737373;--sc-content-neutral-primary:#292929;--sc-content-neutral-secondary:#404040;--sc-content-brand-on-primary:#FFFFFF;--sc-content-success-on-primary:#FFFFFF;--sc-content-caution-on-primary:#FFFFFF;--sc-content-danger-on-primary:#FFFFFF;--sc-content-disabled-on-disabled:#737373;--sc-border-neutral:rgba(0,0,0, 0.1);--sc-border-brand:#000000;--sc-border-success:#008000;--sc-border-caution:#CC6600;--sc-border-danger:#CC0000;--sc-border-disabled:#737373}:root{--sc-font-family:sans-serif;--sc-heading-1-font-size:32px;--sc-heading-1-line-height:36px;--sc-heading-1-font-weight:700;--sc-heading-2-font-size:29px;--sc-heading-2-line-height:32px;--sc-heading-2-font-weight:700;--sc-heading-3-font-size:26px;--sc-heading-3-line-height:28px;--sc-heading-3-font-weight:700;--sc-heading-4-font-size:23px;--sc-heading-4-line-height:24px;--sc-heading-4-font-weight:700;--sc-heading-5-font-size:20px;--sc-heading-5-line-height:24px;--sc-heading-5-font-weight:700;--sc-heading-6-font-size:10px;--sc-heading-6-line-height:12px;--sc-heading-6-font-weight:700;--sc-body-bold-font-size:16px;--sc-body-bold-line-height:20px;--sc-body-bold-font-weight:700;--sc-body-font-size:16px;--sc-body-line-height:20px;--sc-body-font-weight:400;--sc-body-small-bold-font-size:12px;--sc-body-small-bold-line-height:16px;--sc-body-small-bold-font-weight:700;--sc-body-small-font-size:12px;--sc-body-small-line-height:16px;--sc-body-small-font-weight:400}:root{--sc-breakpoint-sm:576px;--sc-breakpoint-md:768px;--sc-breakpoint-lg:992px}.searchcraft-search-result-container{all:unset;align-items:flex-start;border-radius:16px;display:flex;flex-direction:column;gap:16px;padding:8px;color:inherit;background-color:var(--sc-surface-neutral-primary)}@media (min-width: 768px){.searchcraft-search-result-container{flex-direction:row}}a.searchcraft-search-result-container{cursor:pointer;transition:background-color 100ms}.searchcraft-base-search-result-content-container{flex:1;display:flex;flex-direction:column;gap:8px}.searchcraft-search-result-image{border-radius:var(--sc-image-border-radius);width:100%}@media (min-width: 768px){.searchcraft-search-result-image{width:200px}}.searchcraft-base-search-result-title{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-bold-font-size);font-weight:var(--sc-body-bold-font-weight);line-height:var(--sc-body-bold-line-height);margin:0;color:var(--sc-content-neutral-primary)}.searchcraft-base-search-result-subtitle{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-small-font-size);font-weight:var(--sc-body-small-font-weight);line-height:var(--sc-body-small-line-height);margin:0;color:var(--sc-content-disabled)}.searchcraft-base-search-result-body-content{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-font-size);font-weight:var(--sc-body-font-weight);line-height:var(--sc-body-line-height);margin:0;color:var(--sc-content-neutral-secondary)}.searchcraft-base-search-result-footer-content{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-font-size);font-weight:var(--sc-body-font-weight);line-height:var(--sc-body-line-height);margin:0;color:var(--sc-content-disabled)}";
-const SearchcraftBaseSearchResultStyle0 = searchcraftBaseSearchResultModuleCss;
+const index = require('./index-a81df4f0.js');
+const store = require('./store-f6ba3dfb.js');
 
 const SearchcraftBaseSearchResult = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        /**
-         * Where to open the link for the button rendered when containerHref is not present.
-         */
-        this.buttonTarget = '_blank';
-        /**
-         * Where to open the link for the containing element.
-         */
-        this.containerTarget = '_blank';
-        /**
-         * The position in the document. Used with the "document_clicked" measure event.
-         */
-        this.documentPosition = 0;
-        this.searchcraftStore = store.useSearchcraftStore.getState();
-        this.recordMeasureEvent = () => {
-            var _a, _b, _c;
-            const searchcraft = this.searchcraftStore.getSearchcraftInstance();
-            if (searchcraft) {
-                const document_position = this.documentPosition;
-                const search_term = this.searchcraftStore.query;
-                const number_of_documents = ((_c = (_b = (_a = this.searchcraftStore.searchResults) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.hits) === null || _c === void 0 ? void 0 : _c.length) || 0;
-                searchcraft.sendMeasureEvent('document_clicked', {
-                    document_position,
-                    number_of_documents,
-                    search_term,
-                });
+    }
+    /**
+     * The title content.
+     */
+    titleContent;
+    /**
+     * The subtitle content.
+     */
+    subtitleContent;
+    /**
+     * The body content.
+     */
+    bodyContent;
+    /**
+     * The footer content.
+     */
+    footerContent;
+    /**
+     * The label for the button rendered when containerHref is not present.
+     */
+    buttonLabel;
+    /**
+     * The link for the button rendered when containerHref is not present.
+     */
+    buttonHref;
+    /**
+     * Where to open the link for the button rendered when containerHref is not present.
+     */
+    buttonTarget = '_blank';
+    /**
+     * The relationship between the current document and the link for the button rendered when containerHref is not present.
+     */
+    buttonRel;
+    /**
+     * The link for the containing element.
+     */
+    containerHref;
+    /**
+     * Where to open the link for the containing element.
+     */
+    containerTarget = '_blank';
+    /**
+     * The relationship between the current document and the link for the containing element.
+     */
+    containerRel;
+    /**
+     * The image source.
+     */
+    imageSrc;
+    /**
+     * The image alternative text.
+     */
+    imageAlt;
+    /**
+     * The placement of the image.
+     */
+    imagePlacement = 'right';
+    /**
+     * A custom styles object.
+     */
+    customStyles;
+    /**
+     * The position in the document. Used with the "document_clicked" measure event.
+     */
+    documentPosition = 0;
+    searchcraftStore = store.useSearchcraftStore.getState();
+    recordMeasureEvent = () => {
+        const searchcraft = this.searchcraftStore.getSearchcraftInstance();
+        if (searchcraft) {
+            const document_position = this.documentPosition;
+            const search_term = this.searchcraftStore.query;
+            const number_of_documents = this.searchcraftStore.searchResults?.data?.hits?.length || 0;
+            searchcraft.sendMeasureEvent('document_clicked', {
+                document_position,
+                number_of_documents,
+                search_term,
+            });
+        }
+    };
+    parseStyles = () => {
+        if (this.customStyles) {
+            try {
+                return JSON.parse(this.customStyles);
             }
-        };
-        this.parseStyles = () => {
-            if (this.customStyles) {
-                try {
-                    return JSON.parse(this.customStyles);
-                }
-                catch (error) {
-                    console.error('Error parsing custom styles:', error);
-                    return {};
-                }
+            catch (error) {
+                console.error('Error parsing custom styles:', error);
+                return {};
             }
-            return {};
-        };
-    }
+        }
+        return {};
+    };
     render() {
         const styles = this.parseStyles();
         const imageContainer = this.imageSrc && (index.h("img", { alt: this.imageAlt, class: 'searchcraft-search-result-image', src: this.imageSrc, style: styles.image || {} }));
@@ -63,7 +111,6 @@ const SearchcraftBaseSearchResult = class {
         return (index.h("div", { class: 'searchcraft-search-result-container', style: styles.container || {} }, contentContainer));
     }
 };
-SearchcraftBaseSearchResult.style = SearchcraftBaseSearchResultStyle0;
 
 exports.searchcraft_base_search_result = SearchcraftBaseSearchResult;
 

package/dist/cjs/searchcraft-base-search-result.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"searchcraft-base-search-result.entry.cjs.js","mappings":"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","names":["useSearchcraftStore","h","Fragment"],"sources":["src/components/searchcraft-base-search-result/searchcraft-base-search-result.module.scss?tag=searchcraft-base-search-result","src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx"],"sourcesContent":["\n.searchcraft-search-result-container {\n  all: unset;\n  align-items: flex-start;\n  border-radius: 16px;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n  padding: 8px;\n  color: inherit;\n\n  background-color: var(--sc-surface-neutral-primary);\n\n  @media (min-width: $breakpoint-md) {\n    flex-direction: row;\n  }\n}\n\na.searchcraft-search-result-container {\n  cursor: pointer;\n  transition: background-color 100ms;\n}\n\n.searchcraft-base-search-result-content-container {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  gap: 8px;\n}\n\n.searchcraft-search-result-image {\n  border-radius: var(--sc-image-border-radius);\n  width: 100%;\n\n  @media (min-width: $breakpoint-md) {\n    width: 200px;\n  }\n}\n\n.searchcraft-base-search-result-title {\n  @include body-bold();\n  margin: 0;\n  color: var(--sc-content-neutral-primary);\n}\n\n.searchcraft-base-search-result-subtitle {\n  @include body-small();\n  margin: 0;\n  color: var(--sc-content-disabled);\n}\n\n.searchcraft-base-search-result-body-content {\n  @include body();\n  margin: 0;\n  color: var(--sc-content-neutral-secondary);\n}\n\n.searchcraft-base-search-result-footer-content {\n  @include body();\n  margin: 0;\n  color: var(--sc-content-disabled);\n}\n","import { useSearchcraftStore } from '@provider/store';\nimport { Component, Fragment, h, Prop } from '@stencil/core';\n\n/**\n * This web component is designed to display detailed information for a single search result.\n * Once a query is submitted, the component formats and presents the result.\n * It is consumed within the `searchcraft-base-search-results` component.\n */\n@Component({\n  tag: 'searchcraft-base-search-result',\n  styleUrl: 'searchcraft-base-search-result.module.scss',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResult {\n  /**\n   * The title content.\n   */\n  @Prop() titleContent: string | undefined;\n  /**\n   * The subtitle content.\n   */\n  @Prop() subtitleContent: string | undefined;\n  /**\n   * The body content.\n   */\n  @Prop() bodyContent: string | undefined;\n  /**\n   * The footer content.\n   */\n  @Prop() footerContent: string | undefined;\n  /**\n   * The label for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonLabel: string | undefined;\n  /**\n   * The link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonHref: string | undefined;\n  /**\n   * Where to open the link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * The link for the containing element.\n   */\n  @Prop() containerHref: string | undefined;\n  /**\n   * Where to open the link for the containing element.\n   */\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the containing element.\n   */\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * The image source.\n   */\n  @Prop() imageSrc: string | undefined;\n  /**\n   * The image alternative text.\n   */\n  @Prop() imageAlt: string | undefined;\n  /**\n   * The placement of the image.\n   */\n  @Prop() imagePlacement: 'left' | 'right';\n  /**\n   * A custom styles object.\n   */\n  @Prop() customStyles: string | undefined;\n  /**\n   * The position in the document. Used with the \"document_clicked\" measure event.\n   */\n  @Prop() documentPosition = 0;\n\n  private searchcraftStore = useSearchcraftStore.getState();\n\n  private recordMeasureEvent = () => {\n    const searchcraft = this.searchcraftStore.getSearchcraftInstance();\n\n    if (searchcraft) {\n      const document_position = this.documentPosition;\n      const search_term = this.searchcraftStore.query;\n      const number_of_documents =\n        this.searchcraftStore.searchResults?.data?.hits?.length || 0;\n\n      searchcraft.sendMeasureEvent('document_clicked', {\n        document_position,\n        number_of_documents,\n        search_term,\n      });\n    }\n  };\n\n  private parseStyles = (): Record<string, { [key: string]: string }> => {\n    if (this.customStyles) {\n      try {\n        return JSON.parse(this.customStyles);\n      } catch (error) {\n        console.error('Error parsing custom styles:', error);\n        return {};\n      }\n    }\n    return {};\n  };\n\n  render() {\n    const styles = this.parseStyles();\n    const imageContainer = this.imageSrc && (\n      <img\n        alt={this.imageAlt}\n        class='searchcraft-search-result-image'\n        src={this.imageSrc}\n        style={styles.image || {}}\n      />\n    );\n\n    const contentContainer = (\n      <Fragment>\n        {this.imageSrc && this.imagePlacement === 'left' && imageContainer}\n        <div class='searchcraft-base-search-result-content-container'>\n          {this.titleContent && (\n            <h2\n              class='searchcraft-base-search-result-title'\n              style={styles.title || {}}\n            >\n              {this.titleContent}\n            </h2>\n          )}\n          {this.subtitleContent && (\n            <h3\n              class='searchcraft-base-search-result-subtitle'\n              style={styles.subtitle || {}}\n            >\n              {this.subtitleContent}\n            </h3>\n          )}\n          {this.bodyContent && (\n            <p\n              class='searchcraft-base-search-result-body-content'\n              style={styles.primaryContent || {}}\n            >\n              {this.bodyContent}\n            </p>\n          )}\n\n          {this.footerContent && (\n            <p\n              class='searchcraft-base-search-result-footer-content'\n              style={styles.secondaryContent || {}}\n            >\n              {this.footerContent}\n            </p>\n          )}\n          {this.buttonHref && !this.containerHref && this.buttonLabel && (\n            <a\n              class='searchcraft-search-result-button'\n              href={this.buttonHref}\n              style={styles.button || {}}\n              target={this.buttonTarget}\n              rel={this.buttonRel}\n            >\n              {this.buttonLabel}\n            </a>\n          )}\n        </div>\n        {this.imageSrc && this.imagePlacement === 'right' && imageContainer}\n      </Fragment>\n    );\n\n    /** Render as an anchor tag if the containerHref prop is present. */\n    if (this.containerHref) {\n      return (\n        <a\n          class='searchcraft-search-result-container'\n          onClick={this.recordMeasureEvent}\n          href={this.containerHref}\n          rel={this.containerRel}\n          style={styles.container || {}}\n          tabindex='0'\n          target={this.containerTarget}\n        >\n          {contentContainer}\n        </a>\n      );\n    }\n\n    /** Render as a div if no href prop. */\n    return (\n      <div\n        class='searchcraft-search-result-container'\n        style={styles.container || {}}\n      >\n        {contentContainer}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"searchcraft-base-search-result.entry.cjs.js","mappings":"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","names":["useSearchcraftStore","h","Fragment"],"sources":["src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx"],"sourcesContent":["import { useSearchcraftStore } from '@provider/store';\nimport { Component, Fragment, h, Prop } from '@stencil/core';\n\n/**\n * This web component is designed to display detailed information for a single search result.\n * Once a query is submitted, the component formats and presents the result.\n * It is consumed within the `searchcraft-base-search-results` component.\n */\n@Component({\n  tag: 'searchcraft-base-search-result',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResult {\n  /**\n   * The title content.\n   */\n  @Prop() titleContent: string | undefined;\n  /**\n   * The subtitle content.\n   */\n  @Prop() subtitleContent: string | undefined;\n  /**\n   * The body content.\n   */\n  @Prop() bodyContent: string | undefined;\n  /**\n   * The footer content.\n   */\n  @Prop() footerContent: string | undefined;\n  /**\n   * The label for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonLabel: string | undefined;\n  /**\n   * The link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonHref: string | undefined;\n  /**\n   * Where to open the link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the button rendered when containerHref is not present.\n   */\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * The link for the containing element.\n   */\n  @Prop() containerHref: string | undefined;\n  /**\n   * Where to open the link for the containing element.\n   */\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the containing element.\n   */\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * The image source.\n   */\n  @Prop() imageSrc: string | undefined;\n  /**\n   * The image alternative text.\n   */\n  @Prop() imageAlt: string | undefined;\n  /**\n   * The placement of the image.\n   */\n  @Prop() imagePlacement: 'left' | 'right' = 'right';\n  /**\n   * A custom styles object.\n   */\n  @Prop() customStyles: string | undefined;\n  /**\n   * The position in the document. Used with the \"document_clicked\" measure event.\n   */\n  @Prop() documentPosition = 0;\n\n  private searchcraftStore = useSearchcraftStore.getState();\n\n  private recordMeasureEvent = () => {\n    const searchcraft = this.searchcraftStore.getSearchcraftInstance();\n\n    if (searchcraft) {\n      const document_position = this.documentPosition;\n      const search_term = this.searchcraftStore.query;\n      const number_of_documents =\n        this.searchcraftStore.searchResults?.data?.hits?.length || 0;\n\n      searchcraft.sendMeasureEvent('document_clicked', {\n        document_position,\n        number_of_documents,\n        search_term,\n      });\n    }\n  };\n\n  private parseStyles = (): Record<string, { [key: string]: string }> => {\n    if (this.customStyles) {\n      try {\n        return JSON.parse(this.customStyles);\n      } catch (error) {\n        console.error('Error parsing custom styles:', error);\n        return {};\n      }\n    }\n    return {};\n  };\n\n  render() {\n    const styles = this.parseStyles();\n    const imageContainer = this.imageSrc && (\n      <img\n        alt={this.imageAlt}\n        class='searchcraft-search-result-image'\n        src={this.imageSrc}\n        style={styles.image || {}}\n      />\n    );\n\n    const contentContainer = (\n      <Fragment>\n        {this.imageSrc && this.imagePlacement === 'left' && imageContainer}\n        <div class='searchcraft-base-search-result-content-container'>\n          {this.titleContent && (\n            <h2\n              class='searchcraft-base-search-result-title'\n              style={styles.title || {}}\n            >\n              {this.titleContent}\n            </h2>\n          )}\n          {this.subtitleContent && (\n            <h3\n              class='searchcraft-base-search-result-subtitle'\n              style={styles.subtitle || {}}\n            >\n              {this.subtitleContent}\n            </h3>\n          )}\n          {this.bodyContent && (\n            <p\n              class='searchcraft-base-search-result-body-content'\n              style={styles.primaryContent || {}}\n            >\n              {this.bodyContent}\n            </p>\n          )}\n\n          {this.footerContent && (\n            <p\n              class='searchcraft-base-search-result-footer-content'\n              style={styles.secondaryContent || {}}\n            >\n              {this.footerContent}\n            </p>\n          )}\n          {this.buttonHref && !this.containerHref && this.buttonLabel && (\n            <a\n              class='searchcraft-search-result-button'\n              href={this.buttonHref}\n              style={styles.button || {}}\n              target={this.buttonTarget}\n              rel={this.buttonRel}\n            >\n              {this.buttonLabel}\n            </a>\n          )}\n        </div>\n        {this.imageSrc && this.imagePlacement === 'right' && imageContainer}\n      </Fragment>\n    );\n\n    /** Render as an anchor tag if the containerHref prop is present. */\n    if (this.containerHref) {\n      return (\n        <a\n          class='searchcraft-search-result-container'\n          onClick={this.recordMeasureEvent}\n          href={this.containerHref}\n          rel={this.containerRel}\n          style={styles.container || {}}\n          tabindex='0'\n          target={this.containerTarget}\n        >\n          {contentContainer}\n        </a>\n      );\n    }\n\n    /** Render as a div if no href prop. */\n    return (\n      <div\n        class='searchcraft-search-result-container'\n        style={styles.container || {}}\n      >\n        {contentContainer}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/searchcraft-base-search-results.cjs.entry.js

@@ -2,46 +2,68 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-d4b4a45e.js');
-const store = require('./store-abe47006.js');
+const index = require('./index-a81df4f0.js');
+const store = require('./store-f6ba3dfb.js');
 const units = require('./units-fe4d8083.js');
 const styles = require('./styles-7b2d06f2.js');
 
-const searchcraftBaseSearchResultsModuleCss = ":root{--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px;--sc-popover-form-border-radius:8px;--sc-popover-list-view-height:400px;--sc-popover-list-item-image-size:60px;--sc-popover-list-item-padding-horizontal:8px;--sc-popover-list-item-padding-vertical:8px;--sc-popover-modal-max-width:570px}:root{--sc-surface-disabled:#D9D9D9;--sc-surface-neutral-primary:#FFFFFF;--sc-surface-neutral-secondary:#F3F3F3;--sc-surface-neutral-light:#FFFFFF;--sc-surface-neutral-primary-hover:#FAFAFA;--sc-surface-neutral-primary-active:#F7F7F7;--sc-surface-neutral-secondary-hover:#EDEDED;--sc-surface-neutral-secondary-active:#E6E6E6;--sc-surface-brand-primary:#000000;--sc-surface-brand-secondary:#E6E6E6;--sc-surface-brand-primary-hover:#2E2E2E;--sc-surface-brand-primary-active:#292929;--sc-surface-brand-secondary-hover:#EBEBEB;--sc-surface-brand-secondary-active:#E0E0E0;--sc-surface-success-primary:#008000;--sc-surface-success-secondary:#CCFFCC;--sc-surface-success-primary-hover:#009900;--sc-surface-success-primary-active:#006600;--sc-surface-success-secondary-hover:#E6FFE6;--sc-surface-success-secondary-active:#E6FFE6;--sc-surface-caution-primary:#CC6600;--sc-surface-caution-secondary:#FFD9B3;--sc-surface-caution-primary-hover:#E57300;--sc-surface-caution-primary-active:#B25A00;--sc-surface-caution-secondary-hover:#FFE5CC;--sc-surface-caution-secondary-active:#FFCC99;--sc-surface-danger-primary:#CC0000;--sc-surface-danger-secondary:#FFCCCC;--sc-surface-danger-primary-hover:#E50000;--sc-surface-danger-primary-active:#B30000;--sc-surface-danger-secondary-hover:#FFE7E7;--sc-surface-danger-secondary-active:#FFB3B3;--sc-content-brand:#000000;--sc-content-success:#008000;--sc-content-caution:#994D00;--sc-content-danger:#990000;--sc-content-disabled:#737373;--sc-content-neutral-primary:#292929;--sc-content-neutral-secondary:#404040;--sc-content-brand-on-primary:#FFFFFF;--sc-content-success-on-primary:#FFFFFF;--sc-content-caution-on-primary:#FFFFFF;--sc-content-danger-on-primary:#FFFFFF;--sc-content-disabled-on-disabled:#737373;--sc-border-neutral:rgba(0,0,0, 0.1);--sc-border-brand:#000000;--sc-border-success:#008000;--sc-border-caution:#CC6600;--sc-border-danger:#CC0000;--sc-border-disabled:#737373}:root{--sc-font-family:sans-serif;--sc-heading-1-font-size:32px;--sc-heading-1-line-height:36px;--sc-heading-1-font-weight:700;--sc-heading-2-font-size:29px;--sc-heading-2-line-height:32px;--sc-heading-2-font-weight:700;--sc-heading-3-font-size:26px;--sc-heading-3-line-height:28px;--sc-heading-3-font-weight:700;--sc-heading-4-font-size:23px;--sc-heading-4-line-height:24px;--sc-heading-4-font-weight:700;--sc-heading-5-font-size:20px;--sc-heading-5-line-height:24px;--sc-heading-5-font-weight:700;--sc-heading-6-font-size:10px;--sc-heading-6-line-height:12px;--sc-heading-6-font-weight:700;--sc-body-bold-font-size:16px;--sc-body-bold-line-height:20px;--sc-body-bold-font-weight:700;--sc-body-font-size:16px;--sc-body-line-height:20px;--sc-body-font-weight:400;--sc-body-small-bold-font-size:12px;--sc-body-small-bold-line-height:16px;--sc-body-small-bold-font-weight:700;--sc-body-small-font-size:12px;--sc-body-small-line-height:16px;--sc-body-small-font-weight:400}:root{--sc-breakpoint-sm:576px;--sc-breakpoint-md:768px;--sc-breakpoint-lg:992px}.searchcraft-search-results-container{display:flex;flex-direction:column;justify-content:center;gap:16px}.searchcraft-ad-section{align-items:center;background-color:#F1F1F1;border-radius:16px;display:flex;flex-direction:column;font-size:16px;justify-content:center;min-height:176px;text-align:center}.searchcraft-ad-section p{margin:0;color:var(--sc-content-disabled)}.searchcraft-search-results-empty-state-container{text-align:center}.searchcraft-search-results-error-message-container{text-align:center}";
-const SearchcraftBaseSearchResultsStyle0 = searchcraftBaseSearchResultsModuleCss;
-
 const SearchcraftBaseSearchResults = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.noResults = index.createEvent(this, "noResults", 7);
-        /**
-         * How often ads are injected.
-         */
-        this.adInterval = 4;
-        /**
-         * Should an ad be placed at the end of the results.
-         */
-        this.placeAdAtEnd = false;
-        /**
-         * Should an ad be placed at the start of the results.
-         */
-        this.placeAdAtStart = true;
-        /**
-         * The placement of the image for each result.
-         */
-        this.resultImagePlacement = 'right';
-        /**
-         * Where to open the link for the button rendered when containerHref is not present for each result.
-         */
-        this.buttonTarget = '_blank';
-        /**
-         * Where to open the link for the containing element for each result.
-         */
-        this.containerTarget = '_blank';
-        this.hasSearched = false;
-        this.query = '';
-        this.searchResults = null;
     }
+    /**
+     * How often ads are injected.
+     */
+    adInterval = 4;
+    /**
+     * A custom styles object.
+     */
+    customStylesForResults;
+    /**
+     * Formats the content rendered for each result.
+     */
+    searchResultMappings;
+    /**
+     * Should an ad be placed at the end of the results.
+     */
+    placeAdAtEnd = false;
+    /**
+     * Should an ad be placed at the start of the results.
+     */
+    placeAdAtStart = true;
+    /**
+     * The placement of the image for each result.
+     */
+    resultImagePlacement = 'right';
+    /**
+     * The label for the button rendered when containerHref is not present for each result.
+     */
+    buttonLabel;
+    /**
+     * Where to open the link for the button rendered when containerHref is not present for each result.
+     */
+    buttonTarget = '_blank';
+    /**
+     * The relationship between the current document and the link for the button rendered when containerHref is not present for each result.
+     */
+    buttonRel;
+    /**
+     * Where to open the link for the containing element for each result.
+     */
+    containerTarget = '_blank';
+    /**
+     * The relationship between the current document and the link for the containing element for each result.
+     */
+    containerRel;
+    /**
+     * When no results are returned.
+     */
+    noResults;
+    hasSearched = false;
+    query = '';
+    searchResults = null;
+    unsubscribe = () => { };
     componentDidLoad() {
         this.unsubscribe = store.useSearchcraftStore.subscribe((state) => {
             if (state.query.length > 0) {
@@ -50,7 +72,7 @@ const SearchcraftBaseSearchResults = class {
             else {
                 this.hasSearched = false;
             }
-            this.searchResults = Object.assign({}, state.searchResults);
+            this.searchResults = { ...state.searchResults };
             this.query = state.query;
         });
         const { searchResults, query } = store.useSearchcraftStore.getState();
@@ -66,27 +88,30 @@ const SearchcraftBaseSearchResults = class {
         /**
          * Index field values -> Result container props mappings.
          */
-        const titleContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.title);
-        const subtitleContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.subtitle);
-        const bodyContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.body);
-        const containerHref = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.containerHref);
-        const buttonHref = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.buttonHref);
-        const imageSource = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.imageSource);
-        const footerContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings.footer);
-        const serializedStyles = typeof this.customStylesForResults === 'string'
-            ? this.customStylesForResults
-            : styles.serializeStyles(this.customStylesForResults);
+        const titleContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.title);
+        const subtitleContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.subtitle);
+        const bodyContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.body);
+        const containerHref = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.containerHref);
+        const buttonHref = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.buttonHref);
+        const imageSource = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.imageSource);
+        const footerContent = units.getDocumentValueFromSearchResultMapping(document, this.searchResultMappings?.footer);
+        let serializedStyles = '';
+        if (this.customStylesForResults) {
+            serializedStyles =
+                typeof this.customStylesForResults === 'string'
+                    ? this.customStylesForResults
+                    : styles.serializeStyles(this.customStylesForResults);
+        }
         return (index.h("searchcraft-base-search-result", { key: `${document.document_id}-${index$1}`, "custom-styles": serializedStyles, "image-placement": this.resultImagePlacement, "container-rel": this.containerRel, "container-target": this.containerTarget, "button-label": this.buttonLabel || 'View more', "button-rel": this.buttonRel, "button-target": this.buttonTarget, "document-position": index$1, "title-content": titleContent, "subtitle-content": subtitleContent, "body-content": bodyContent, "footer-content": footerContent, "container-href": containerHref, "button-href": buttonHref, "image-src": imageSource }));
     }
     render() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         if (this.query.trim() === '') {
             return (index.h("div", { class: 'searchcraft-search-results-empty-state-container' }, index.h("slot", { name: 'empty-search' })));
         }
-        if (!((_a = this.searchResults) === null || _a === void 0 ? void 0 : _a.data)) {
+        if (!this.searchResults?.data) {
             return;
         }
-        const documents = (_d = (_c = (_b = this.searchResults) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.hits) === null || _d === void 0 ? void 0 : _d.map((data, _index) => {
+        const documents = this.searchResults?.data?.hits?.map((data, _index) => {
             const { doc: result } = data;
             return result;
         });
@@ -109,14 +134,13 @@ const SearchcraftBaseSearchResults = class {
         if (this.placeAdAtEnd) {
             finalComponents.push(index.h("div", { key: 'ad-section-end', class: 'searchcraft-ad-section' }, index.h("p", null, "Ad Section")));
         }
-        if (this.query.length > 0 && ((_g = (_f = (_e = this.searchResults) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f.hits) === null || _g === void 0 ? void 0 : _g.length) === 0) {
-            this.noResults.emit();
+        if (this.query.length > 0 && this.searchResults?.data?.hits?.length === 0) {
+            this.noResults?.emit();
         }
         return (index.h("div", { class: 'searchcraft-search-results-container' }, finalComponents, this.query.length > 0 &&
-            ((_k = (_j = (_h = this.searchResults) === null || _h === void 0 ? void 0 : _h.data) === null || _j === void 0 ? void 0 : _j.hits) === null || _k === void 0 ? void 0 : _k.length) === 0 && (index.h("div", { class: 'searchcraft-search-results-error-message-container' }, index.h("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })))));
+            this.searchResults?.data?.hits?.length === 0 && (index.h("div", { class: 'searchcraft-search-results-error-message-container' }, index.h("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })))));
     }
 };
-SearchcraftBaseSearchResults.style = SearchcraftBaseSearchResultsStyle0;
 
 exports.searchcraft_base_search_results = SearchcraftBaseSearchResults;
 

package/dist/cjs/searchcraft-base-search-results.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"searchcraft-base-search-results.entry.cjs.js","mappings":"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","names":["useSearchcraftStore","index","getDocumentValueFromSearchResultMapping","serializeStyles","h"],"sources":["src/components/searchcraft-base-search-results/searchcraft-base-search-results.module.scss?tag=searchcraft-base-search-results","src/components/searchcraft-base-search-results/searchcraft-base-search-results.tsx"],"sourcesContent":[".searchcraft-search-results-container {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  gap: 16px;\n}\n\n.searchcraft-ad-section {\n  align-items: center;\n  background-color: #F1F1F1;\n  border-radius: 16px;\n  display: flex;\n  flex-direction: column;\n  font-size: 16px;\n  justify-content: center;\n  min-height: 176px;\n  text-align: center;\n\n  p {\n    margin: 0;\n    color: var(--sc-content-disabled);\n  }\n}\n\n.searchcraft-search-results-empty-state-container {\n  text-align: center;\n}\n\n.searchcraft-search-results-error-message-container {\n  text-align: center;\n}\n","import {\n  Component,\n  h,\n  Event,\n  Prop,\n  State,\n  type EventEmitter,\n} from '@stencil/core';\n\nimport type { SearchcraftResponse } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\n\nimport {\n  getDocumentValueFromSearchResultMapping,\n  serializeStyles,\n} from '@utils';\nimport type { SearchResultMappings } from 'types';\n\n/**\n * This web component is responsible for displaying the results of a search query.\n * Once a query is submitted, the component formats and presents an ordered list of the results.\n *\n * ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-base-search-results\n *   ad-interval=\"4\"\n *   place-ad-at-start=\"false\"\n *   result-image-placement=\"right\"\n * />\n * ```\n *\n * ```js\n * // index.js\n * const baseSearchResults = document.querySelector('searchcraft-base-search-results');\n *\n * baseSearchResults.searchResultMappings = containerHref: {\n *   fieldNames: [\n *    {\n *      fieldName: 'canonical_link',\n *      dataType: 'text',\n *    },\n *  ],\n * };\n *\n * baseSearchResults.addEventListener('noResults', () => {\n *   console.log('No search results found');\n * });\n * ```\n */\n@Component({\n  tag: 'searchcraft-base-search-results',\n  styleUrl: 'searchcraft-base-search-results.module.scss',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResults {\n  /**\n   * How often ads are injected.\n   */\n  @Prop() adInterval = 4;\n  /**\n   * A custom styles object.\n   */\n  @Prop() customStylesForResults:\n    | string\n    | Record<string, Record<string, string>>\n    | undefined;\n  /**\n   * Formats the content rendered for each result.\n   */\n  @Prop() searchResultMappings: SearchResultMappings | undefined;\n  /**\n   * Should an ad be placed at the end of the results.\n   */\n  @Prop() placeAdAtEnd = false;\n  /**\n   * Should an ad be placed at the start of the results.\n   */\n  @Prop() placeAdAtStart = true;\n  /**\n   * The placement of the image for each result.\n   */\n  @Prop() resultImagePlacement: 'left' | 'right' = 'right';\n  /**\n   * The label for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonLabel: string | undefined;\n  /**\n   * Where to open the link for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * Where to open the link for the containing element for each result.\n   */\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the containing element for each result.\n   */\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n\n  /**\n   * When no results are returned.\n   */\n  @Event() noResults: EventEmitter<void>;\n\n  @State() hasSearched = false;\n  @State() query = '';\n  @State() searchResults: SearchcraftResponse | null = null;\n\n  private unsubscribe: () => void;\n\n  componentDidLoad() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      if (state.query.length > 0) {\n        this.hasSearched = true;\n      } else {\n        this.hasSearched = false;\n      }\n      this.searchResults = { ...state.searchResults };\n      this.query = state.query;\n    });\n\n    const { searchResults, query } = useSearchcraftStore.getState();\n    this.searchResults = searchResults;\n    this.query = query;\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribe) {\n      this.unsubscribe();\n    }\n  }\n\n  renderDocument(document: Record<string, unknown>, index: number) {\n    /**\n     * Index field values -> Result container props mappings.\n     */\n    const titleContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.title,\n    );\n    const subtitleContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.subtitle,\n    );\n    const bodyContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.body,\n    );\n    const containerHref = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.containerHref,\n    );\n    const buttonHref = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.buttonHref,\n    );\n    const imageSource = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.imageSource,\n    );\n    const footerContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings.footer,\n    );\n\n    const serializedStyles =\n      typeof this.customStylesForResults === 'string'\n        ? this.customStylesForResults\n        : serializeStyles(this.customStylesForResults);\n\n    return (\n      <searchcraft-base-search-result\n        key={`${document.document_id}-${index}`}\n        custom-styles={serializedStyles}\n        image-placement={this.resultImagePlacement}\n        container-rel={this.containerRel}\n        container-target={this.containerTarget}\n        button-label={this.buttonLabel || 'View more'}\n        button-rel={this.buttonRel}\n        button-target={this.buttonTarget}\n        document-position={index}\n        title-content={titleContent}\n        subtitle-content={subtitleContent}\n        body-content={bodyContent}\n        footer-content={footerContent}\n        container-href={containerHref}\n        button-href={buttonHref}\n        image-src={imageSource}\n      />\n    );\n  }\n\n  render() {\n    if (this.query.trim() === '') {\n      return (\n        <div class='searchcraft-search-results-empty-state-container'>\n          <slot name='empty-search' />\n        </div>\n      );\n    }\n\n    if (!this.searchResults?.data) {\n      return;\n    }\n\n    const documents: Record<string, unknown>[] =\n      this.searchResults?.data?.hits?.map((data, _index) => {\n        const { doc: result } = data;\n        return result;\n      });\n\n    const finalComponents: JSX.Element[] = [];\n\n    if (this.placeAdAtStart) {\n      finalComponents.push(\n        <div key='ad-section-start' class='searchcraft-ad-section'>\n          <p>Ad Section</p>\n        </div>,\n      );\n    }\n\n    if (this.adInterval > 0) {\n      documents.forEach((document, index) => {\n        finalComponents.push(this.renderDocument(document, index));\n\n        if ((index + 1) % this.adInterval === 0) {\n          finalComponents.push(\n            <div\n              key={`ad-section-${index + 1}`}\n              class='searchcraft-ad-section '\n            >\n              <p>Ad Section</p>\n            </div>,\n          );\n        }\n      });\n    } else {\n      const documentElements = documents.map((document, index) =>\n        this.renderDocument(document, index),\n      );\n      finalComponents.push(...documentElements);\n    }\n\n    if (this.placeAdAtEnd) {\n      finalComponents.push(\n        <div key='ad-section-end' class='searchcraft-ad-section'>\n          <p>Ad Section</p>\n        </div>,\n      );\n    }\n\n    if (this.query.length > 0 && this.searchResults?.data?.hits?.length === 0) {\n      this.noResults.emit();\n    }\n\n    return (\n      <div class='searchcraft-search-results-container'>\n        {finalComponents}\n        {this.query.length > 0 &&\n          this.searchResults?.data?.hits?.length === 0 && (\n            <div class='searchcraft-search-results-error-message-container'>\n              <searchcraft-error-message\n                error-message={`No search results found for \"${this.query}\" query`}\n              />\n            </div>\n          )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"searchcraft-base-search-results.entry.cjs.js","mappings":";;;;;;;;;MAwDa,4BAA4B;;;;;;;;IAI/B,UAAU,GAAG,CAAC,CAAC;;;;IAIf,sBAAsB,CAGhB;;;;IAIN,oBAAoB,CAAmC;;;;IAIvD,YAAY,GAAG,KAAK,CAAC;;;;IAIrB,cAAc,GAAG,IAAI,CAAC;;;;IAItB,oBAAoB,GAAqB,OAAO,CAAC;;;;IAIjD,WAAW,CAAqB;;;;IAIhC,YAAY,GAA4C,QAAQ,CAAC;;;;IAIjE,SAAS,CAAqD;;;;IAI9D,eAAe,GAA4C,QAAQ,CAAC;;;;IAIpE,YAAY,CAAqD;;;;IAKhE,SAAS,CAAsB;IAE/B,WAAW,GAAG,KAAK,CAAC;IACpB,KAAK,GAAG,EAAE,CAAC;IACX,aAAa,GAA+B,IAAI,CAAC;IAElD,WAAW,GAAe,SAAQ,CAAC;IAE3C,gBAAgB;QACd,IAAI,CAAC,WAAW,GAAGA,yBAAmB,CAAC,SAAS,CAAC,CAAC,KAAK;YACrD,IAAI,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC1B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC;aACzB;iBAAM;gBACL,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;aAC1B;YACD,IAAI,CAAC,aAAa,GAAG,EAAE,GAAG,KAAK,CAAC,aAAa,EAAyB,CAAC;YACvE,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;SAC1B,CAAC,CAAC;QAEH,MAAM,EAAE,aAAa,EAAE,KAAK,EAAE,GAAGA,yBAAmB,CAAC,QAAQ,EAAE,CAAC;QAChE,IAAI,CAAC,aAAa,GAAG,aAAa,CAAC;QACnC,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;KACpB;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,WAAW,EAAE;YACpB,IAAI,CAAC,WAAW,EAAE,CAAC;SACpB;KACF;IAED,cAAc,CAAC,QAAiC,EAAEC,OAAa;;;;QAI7D,MAAM,YAAY,GAAGC,6CAAuC,CAC1D,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,KAAK,CACjC,CAAC;QACF,MAAM,eAAe,GAAGA,6CAAuC,CAC7D,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,QAAQ,CACpC,CAAC;QACF,MAAM,WAAW,GAAGA,6CAAuC,CACzD,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,IAAI,CAChC,CAAC;QACF,MAAM,aAAa,GAAGA,6CAAuC,CAC3D,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,aAAa,CACzC,CAAC;QACF,MAAM,UAAU,GAAGA,6CAAuC,CACxD,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,UAAU,CACtC,CAAC;QACF,MAAM,WAAW,GAAGA,6CAAuC,CACzD,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,WAAW,CACvC,CAAC;QACF,MAAM,aAAa,GAAGA,6CAAuC,CAC3D,QAAQ,EACR,IAAI,CAAC,oBAAoB,EAAE,MAAM,CAClC,CAAC;QAEF,IAAI,gBAAgB,GAAG,EAAE,CAAC;QAC1B,IAAI,IAAI,CAAC,sBAAsB,EAAE;YAC/B,gBAAgB;gBACd,OAAO,IAAI,CAAC,sBAAsB,KAAK,QAAQ;sBAC3C,IAAI,CAAC,sBAAsB;sBAC3BC,sBAAe,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;SACpD;QAED,QACEC,4CACE,GAAG,EAAE,GAAG,QAAQ,CAAC,WAAW,IAAIH,OAAK,EAAE,mBACxB,gBAAgB,qBACd,IAAI,CAAC,oBAAoB,mBAC3B,IAAI,CAAC,YAAY,sBACd,IAAI,CAAC,eAAe,kBACxB,IAAI,CAAC,WAAW,IAAI,WAAW,gBACjC,IAAI,CAAC,SAAS,mBACX,IAAI,CAAC,YAAY,uBACbA,OAAK,mBACT,YAAY,sBACT,eAAe,kBACnB,WAAW,oBACT,aAAa,oBACb,aAAa,iBAChB,UAAU,eACZ,WAAW,GACtB,EACF;KACH;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YAC5B,QACEG,iBAAK,KAAK,EAAC,kDAAkD,IAC3DA,kBAAM,IAAI,EAAC,cAAc,GAAG,CACxB,EACN;SACH;QAED,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE;YAC7B,OAAO;SACR;QAED,MAAM,SAAS,GACb,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM;YAC/C,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;YAC7B,OAAO,MAAM,CAAC;SACf,CAA8B,CAAC;QAElC,MAAM,eAAe,GAAkB,EAAE,CAAC;QAE1C,IAAI,IAAI,CAAC,cAAc,EAAE;YACvB,eAAe,CAAC,IAAI,CAClBA,iBAAK,GAAG,EAAC,kBAAkB,EAAC,KAAK,EAAC,wBAAwB,IACxDA,gCAAiB,CACb,CACP,CAAC;SACH;QAED,IAAI,IAAI,CAAC,UAAU,GAAG,CAAC,EAAE;YACvB,SAAS,CAAC,OAAO,CAAC,CAAC,QAAQ,EAAEH,OAAK;gBAChC,eAAe,CAAC,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAEA,OAAK,CAAC,CAAC,CAAC;gBAE3D,IAAI,CAACA,OAAK,GAAG,CAAC,IAAI,IAAI,CAAC,UAAU,KAAK,CAAC,EAAE;oBACvC,eAAe,CAAC,IAAI,CAClBG,iBACE,GAAG,EAAE,cAAcH,OAAK,GAAG,CAAC,EAAE,EAC9B,KAAK,EAAC,yBAAyB,IAE/BG,gCAAiB,CACb,CACP,CAAC;iBACH;aACF,CAAC,CAAC;SACJ;aAAM;YACL,MAAM,gBAAgB,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,KAAK,KACrD,IAAI,CAAC,cAAc,CAAC,QAAQ,EAAE,KAAK,CAAC,CACrC,CAAC;YACF,eAAe,CAAC,IAAI,CAAC,GAAG,gBAAgB,CAAC,CAAC;SAC3C;QAED,IAAI,IAAI,CAAC,YAAY,EAAE;YACrB,eAAe,CAAC,IAAI,CAClBA,iBAAK,GAAG,EAAC,gBAAgB,EAAC,KAAK,EAAC,wBAAwB,IACtDA,gCAAiB,CACb,CACP,CAAC;SACH;QAED,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC,EAAE;YACzE,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,CAAC;SACxB;QAED,QACEA,iBAAK,KAAK,EAAC,sCAAsC,IAC9C,eAAe,EACf,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC;YACpB,IAAI,CAAC,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC,KAC1CA,iBAAK,KAAK,EAAC,oDAAoD,IAC7DA,wDACiB,gCAAgC,IAAI,CAAC,KAAK,SAAS,GAClE,CACE,CACP,CACC,EACN;KACH;;;;;","names":["useSearchcraftStore","index","getDocumentValueFromSearchResultMapping","serializeStyles","h"],"sources":["src/components/searchcraft-base-search-results/searchcraft-base-search-results.tsx"],"sourcesContent":["import {\n  Component,\n  h,\n  Event,\n  Prop,\n  State,\n  type EventEmitter,\n} from '@stencil/core';\n\nimport type { SearchcraftResponse } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\n\nimport {\n  getDocumentValueFromSearchResultMapping,\n  serializeStyles,\n} from '@utils';\nimport type { SearchResultMappings } from 'types';\nimport type { JSX } from '@stencil/core/internal';\n\n/**\n * This web component is responsible for displaying the results of a search query.\n * Once a query is submitted, the component formats and presents an ordered list of the results.\n *\n * ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-base-search-results\n *   ad-interval=\"4\"\n *   place-ad-at-start=\"false\"\n *   result-image-placement=\"right\"\n * />\n * ```\n *\n * ```js\n * // index.js\n * const baseSearchResults = document.querySelector('searchcraft-base-search-results');\n *\n * baseSearchResults.searchResultMappings = containerHref: {\n *   fieldNames: [\n *    {\n *      fieldName: 'canonical_link',\n *      dataType: 'text',\n *    },\n *  ],\n * };\n *\n * baseSearchResults.addEventListener('noResults', () => {\n *   console.log('No search results found');\n * });\n * ```\n */\n@Component({\n  tag: 'searchcraft-base-search-results',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResults {\n  /**\n   * How often ads are injected.\n   */\n  @Prop() adInterval = 4;\n  /**\n   * A custom styles object.\n   */\n  @Prop() customStylesForResults:\n    | string\n    | Record<string, Record<string, string>>\n    | undefined;\n  /**\n   * Formats the content rendered for each result.\n   */\n  @Prop() searchResultMappings: SearchResultMappings | undefined;\n  /**\n   * Should an ad be placed at the end of the results.\n   */\n  @Prop() placeAdAtEnd = false;\n  /**\n   * Should an ad be placed at the start of the results.\n   */\n  @Prop() placeAdAtStart = true;\n  /**\n   * The placement of the image for each result.\n   */\n  @Prop() resultImagePlacement: 'left' | 'right' = 'right';\n  /**\n   * The label for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonLabel: string | undefined;\n  /**\n   * Where to open the link for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the button rendered when containerHref is not present for each result.\n   */\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  /**\n   * Where to open the link for the containing element for each result.\n   */\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  /**\n   * The relationship between the current document and the link for the containing element for each result.\n   */\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n\n  /**\n   * When no results are returned.\n   */\n  @Event() noResults?: EventEmitter<void>;\n\n  @State() hasSearched = false;\n  @State() query = '';\n  @State() searchResults: SearchcraftResponse | null = null;\n\n  private unsubscribe: () => void = () => {};\n\n  componentDidLoad() {\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      if (state.query.length > 0) {\n        this.hasSearched = true;\n      } else {\n        this.hasSearched = false;\n      }\n      this.searchResults = { ...state.searchResults } as SearchcraftResponse;\n      this.query = state.query;\n    });\n\n    const { searchResults, query } = useSearchcraftStore.getState();\n    this.searchResults = searchResults;\n    this.query = query;\n  }\n\n  disconnectedCallback() {\n    if (this.unsubscribe) {\n      this.unsubscribe();\n    }\n  }\n\n  renderDocument(document: Record<string, unknown>, index: number) {\n    /**\n     * Index field values -> Result container props mappings.\n     */\n    const titleContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.title,\n    );\n    const subtitleContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.subtitle,\n    );\n    const bodyContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.body,\n    );\n    const containerHref = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.containerHref,\n    );\n    const buttonHref = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.buttonHref,\n    );\n    const imageSource = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.imageSource,\n    );\n    const footerContent = getDocumentValueFromSearchResultMapping(\n      document,\n      this.searchResultMappings?.footer,\n    );\n\n    let serializedStyles = '';\n    if (this.customStylesForResults) {\n      serializedStyles =\n        typeof this.customStylesForResults === 'string'\n          ? this.customStylesForResults\n          : serializeStyles(this.customStylesForResults);\n    }\n\n    return (\n      <searchcraft-base-search-result\n        key={`${document.document_id}-${index}`}\n        custom-styles={serializedStyles}\n        image-placement={this.resultImagePlacement}\n        container-rel={this.containerRel}\n        container-target={this.containerTarget}\n        button-label={this.buttonLabel || 'View more'}\n        button-rel={this.buttonRel}\n        button-target={this.buttonTarget}\n        document-position={index}\n        title-content={titleContent}\n        subtitle-content={subtitleContent}\n        body-content={bodyContent}\n        footer-content={footerContent}\n        container-href={containerHref}\n        button-href={buttonHref}\n        image-src={imageSource}\n      />\n    );\n  }\n\n  render() {\n    if (this.query.trim() === '') {\n      return (\n        <div class='searchcraft-search-results-empty-state-container'>\n          <slot name='empty-search' />\n        </div>\n      );\n    }\n\n    if (!this.searchResults?.data) {\n      return;\n    }\n\n    const documents: Record<string, unknown>[] =\n      this.searchResults?.data?.hits?.map((data, _index) => {\n        const { doc: result } = data;\n        return result;\n      }) as Record<string, unknown>[];\n\n    const finalComponents: JSX.Element[] = [];\n\n    if (this.placeAdAtStart) {\n      finalComponents.push(\n        <div key='ad-section-start' class='searchcraft-ad-section'>\n          <p>Ad Section</p>\n        </div>,\n      );\n    }\n\n    if (this.adInterval > 0) {\n      documents.forEach((document, index) => {\n        finalComponents.push(this.renderDocument(document, index));\n\n        if ((index + 1) % this.adInterval === 0) {\n          finalComponents.push(\n            <div\n              key={`ad-section-${index + 1}`}\n              class='searchcraft-ad-section '\n            >\n              <p>Ad Section</p>\n            </div>,\n          );\n        }\n      });\n    } else {\n      const documentElements = documents.map((document, index) =>\n        this.renderDocument(document, index),\n      );\n      finalComponents.push(...documentElements);\n    }\n\n    if (this.placeAdAtEnd) {\n      finalComponents.push(\n        <div key='ad-section-end' class='searchcraft-ad-section'>\n          <p>Ad Section</p>\n        </div>,\n      );\n    }\n\n    if (this.query.length > 0 && this.searchResults?.data?.hits?.length === 0) {\n      this.noResults?.emit();\n    }\n\n    return (\n      <div class='searchcraft-search-results-container'>\n        {finalComponents}\n        {this.query.length > 0 &&\n          this.searchResults?.data?.hits?.length === 0 && (\n            <div class='searchcraft-search-results-error-message-container'>\n              <searchcraft-error-message\n                error-message={`No search results found for \"${this.query}\" query`}\n              />\n            </div>\n          )}\n      </div>\n    );\n  }\n}\n"],"version":3}