@searchcraft/javascript-sdk 0.3.1 → 0.4.0

package/dist/collection/components/searchcraft-base-search-form/searchcraft-base-search-form.module.css

@@ -1,18 +1,104 @@
 :root {
-  --font-stack: Helvetica, Arial, sans-serif;
+  /** Appearance & Layout */
+  --sc-spinner-size: 20px;
+  --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;
 }
 
-.formLTR {
-  font-family: var(--font-stack);
-  text-align: left;
+: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;
 }
 
-.formRTL {
-  font-family: var(--font-stack);
-  text-align: right;
+:root {
+  /** Typography */
+  --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;
 }
 
-.searchContainer {
+.searchcraft-base-search-form-input-container {
   align-items: center;
   display: flex;
+  gap: 8px;
 }

package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js

@@ -1,16 +1,9 @@
 import { useSearchcraftStore } from "../../provider/store";
 import { Fragment, h } from "@stencil/core";
-import classNames from "classnames";
 export class SearchcraftBaseSearchResult {
     constructor() {
-        this.buttonCallback = () => { };
-        this.keyDownCallback = () => { };
-        this.resultCallback = () => { };
         this.searchcraftStore = useSearchcraftStore.getState();
-        this.handleButtonClick = () => {
-            this.buttonCallback();
-        };
-        this.handleClick = () => {
+        this.recordMeasureEvent = () => {
             var _a, _b, _c;
             const searchcraft = this.searchcraftStore.getSearchcraftInstance();
             if (searchcraft) {
@@ -25,40 +18,44 @@ export class SearchcraftBaseSearchResult {
             }
         };
         this.parseStyles = () => {
-            try {
-                return JSON.parse(this.customStyles);
-            }
-            catch (error) {
-                console.error('Error parsing custom styles:', error);
-                return {};
+            if (this.customStyles) {
+                try {
+                    return JSON.parse(this.customStyles);
+                }
+                catch (error) {
+                    console.error('Error parsing custom styles:', error);
+                    return {};
+                }
             }
+            return {};
         };
-        this.buttonText = '';
-        this.customStyles = '{}';
-        this.titleContent = '';
-        this.imageDescription = '';
-        this.imageSource = '';
-        this.isInteractive = false;
-        this.linkHref = '';
-        this.primaryContent = '';
-        this.secondaryContent = '';
-        this.subtitleContent = '';
-        this.tertiaryContent = '';
-        this.themeMode = 'light';
-        this.placeImageRight = false;
+        this.titleContent = undefined;
+        this.subtitleContent = undefined;
+        this.bodyContent = undefined;
+        this.footerContent = undefined;
+        this.buttonLabel = undefined;
+        this.buttonHref = undefined;
+        this.buttonTarget = '_blank';
+        this.buttonRel = undefined;
+        this.containerHref = undefined;
+        this.containerTarget = '_blank';
+        this.containerRel = undefined;
+        this.imageSrc = undefined;
+        this.imageAlt = undefined;
+        this.imagePlacement = undefined;
+        this.customStyles = undefined;
         this.documentPosition = 0;
     }
     render() {
-        const isLightTheme = this.themeMode === 'light';
         const styles = this.parseStyles();
-        const imageStyle = isLightTheme ? 'imageLight' : 'imageDark';
-        const imageContainer = this.imageSource && (h("div", { key: '53541a311548a653d43505356b9a4f25a417093f', class: classNames('imageContainer', 'searchcraft-base-search-result-image-container') }, h("img", { key: '919a46fd856b521a548c2ce6bab8b360507469c2', alt: this.imageDescription, class: classNames(imageStyle, 'searchcraft-search-result-image'), src: this.imageSource, style: styles.image || {} })));
-        const contentContainer = (h("div", { key: '944700daf2a0b683769bad992253a8482f71f685', class: classNames('contentContainer', 'searchcraft-base-search-result-content-container') }, h("h2", { key: '623096e2c7cf5f11bac7127cb00342386866089e', class: classNames(isLightTheme ? 'titleLight' : 'titleDark', 'searchcraft-base-search-result-title'), style: styles.title || {} }, this.titleContent), h("h3", { key: '2928f4d872e90d99fac31b75c9fecfee7e2a9a41', class: classNames(isLightTheme ? 'subtitleContentLight' : 'subtitleContentDark', 'searchcraft-base-search-result-subtitle'), style: styles.subtitle || {} }, this.subtitleContent), h("p", { key: '93bd00c9482d492a2d3d6262dba33044d4470d2c', class: classNames(isLightTheme ? 'primaryContentLight' : 'primaryContentDark', 'searchcraft-base-search-result-primary-content'), style: styles.primaryContent || {} }, this.primaryContent), h("div", { key: 'dc3bce7c0f75d121ba3068b3717fd5d934036012', class: classNames('secondaryContentContainer', 'searchcraft-base-search-result-secondary-content-container') }, h("p", { key: '80624ec83a0a7086142b6a35b4ac65d1fdb76a4e', class: classNames(isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark', 'searchcraft-base-search-result-secondary-content'), style: styles.secondaryContent || {} }, this.secondaryContent), h("p", { key: '53bdb3471b16fd4a1f525d99472c3a4d5662b722', class: classNames(`${isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark'}${this.tertiaryContent ? ' hasContent' : ''}`, 'searchcraft-base-search-result-tertiary-content'), style: styles.tertiaryContent || {} }, this.tertiaryContent)), this.buttonText && (h("button", { key: '442dc9aebe748ef06710e196382a80bf006a383e', onClick: this.handleButtonClick, style: styles.button || {}, type: 'button' }, this.buttonText))));
-        return (h("a", { key: '2cf6a6d3768266f6d46e700588083aade92142f7', class: classNames(this.isInteractive
-                ? isLightTheme
-                    ? 'interactiveResultContainerLight'
-                    : 'interactiveResultContainerDark'
-                : 'resultContainer', 'searchcraft-search-result-container'), onKeyDown: this.keyDownCallback, onClick: this.handleClick, href: this.linkHref, rel: 'noreferrer', style: styles.container || {}, tabindex: '0', target: '_blank' }, this.placeImageRight ? (h(Fragment, null, contentContainer, imageContainer)) : (h(Fragment, null, imageContainer, contentContainer))));
+        const imageContainer = this.imageSrc && (h("img", { alt: this.imageAlt, class: 'searchcraft-search-result-image', src: this.imageSrc, style: styles.image || {} }));
+        const contentContainer = (h(Fragment, null, this.imageSrc && this.imagePlacement === 'left' && imageContainer, h("div", { class: 'searchcraft-base-search-result-content-container' }, this.titleContent && (h("h2", { class: 'searchcraft-base-search-result-title', style: styles.title || {} }, this.titleContent)), this.subtitleContent && (h("h3", { class: 'searchcraft-base-search-result-subtitle', style: styles.subtitle || {} }, this.subtitleContent)), this.bodyContent && (h("p", { class: 'searchcraft-base-search-result-body-content', style: styles.primaryContent || {} }, this.bodyContent)), this.footerContent && (h("p", { class: 'searchcraft-base-search-result-footer-content', style: styles.secondaryContent || {} }, this.footerContent)), this.buttonHref && !this.containerHref && this.buttonLabel && (h("a", { class: 'searchcraft-search-result-button', href: this.buttonHref, style: styles.button || {}, target: this.buttonTarget, rel: this.buttonRel }, this.buttonLabel))), this.imageSrc && this.imagePlacement === 'right' && imageContainer));
+        /** Render as an anchor tag if the containerHref prop is present. */
+        if (this.containerHref) {
+            return (h("a", { class: 'searchcraft-search-result-container', onClick: this.recordMeasureEvent, href: this.containerHref, rel: this.containerRel, style: styles.container || {}, tabindex: '0', target: this.containerTarget }, contentContainer));
+        }
+        /** Render as a div if no href prop. */
+        return (h("div", { class: 'searchcraft-search-result-container', style: styles.container || {} }, contentContainer));
     }
     static get is() { return "searchcraft-base-search-result"; }
     static get originalStyleUrls() {
@@ -73,11 +70,11 @@ export class SearchcraftBaseSearchResult {
     }
     static get properties() {
         return {
-            "buttonText": {
+            "titleContent": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -87,15 +84,14 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "button-text",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "title-content",
+                "reflect": false
             },
-            "customStyles": {
+            "subtitleContent": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -105,15 +101,14 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "custom-styles",
-                "reflect": false,
-                "defaultValue": "'{}'"
+                "attribute": "subtitle-content",
+                "reflect": false
             },
-            "titleContent": {
+            "bodyContent": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -123,15 +118,14 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "title-content",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "body-content",
+                "reflect": false
             },
-            "imageDescription": {
+            "footerContent": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -141,15 +135,14 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "image-description",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "footer-content",
+                "reflect": false
             },
-            "imageSource": {
+            "buttonLabel": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -159,16 +152,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "image-source",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "button-label",
+                "reflect": false
             },
-            "isInteractive": {
-                "type": "boolean",
+            "buttonHref": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
+                    "original": "string | undefined",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -177,16 +169,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "is-interactive",
-                "reflect": false,
-                "defaultValue": "false"
+                "attribute": "button-href",
+                "reflect": false
             },
-            "linkHref": {
+            "buttonTarget": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "'_blank' | '_self' | '_top' | '_parent'",
+                    "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
                     "references": {}
                 },
                 "required": false,
@@ -195,16 +186,16 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "link-href",
+                "attribute": "button-target",
                 "reflect": false,
-                "defaultValue": "''"
+                "defaultValue": "'_blank'"
             },
-            "primaryContent": {
+            "buttonRel": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "'noreferrer' | 'noopener' | 'nofollow' | undefined",
+                    "resolved": "\"nofollow\" | \"noopener\" | \"noreferrer\"",
                     "references": {}
                 },
                 "required": false,
@@ -213,15 +204,14 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "primary-content",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "button-rel",
+                "reflect": false
             },
-            "secondaryContent": {
+            "containerHref": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
+                    "original": "string | undefined",
                     "resolved": "string",
                     "references": {}
                 },
@@ -231,16 +221,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "secondary-content",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "container-href",
+                "reflect": false
             },
-            "subtitleContent": {
+            "containerTarget": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "'_blank' | '_self' | '_top' | '_parent'",
+                    "resolved": "\"_blank\" | \"_parent\" | \"_self\" | \"_top\"",
                     "references": {}
                 },
                 "required": false,
@@ -249,16 +238,16 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "subtitle-content",
+                "attribute": "container-target",
                 "reflect": false,
-                "defaultValue": "''"
+                "defaultValue": "'_blank'"
             },
-            "tertiaryContent": {
+            "containerRel": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "string",
-                    "resolved": "string",
+                    "original": "'noreferrer' | 'noopener' | 'nofollow' | undefined",
+                    "resolved": "\"nofollow\" | \"noopener\" | \"noreferrer\"",
                     "references": {}
                 },
                 "required": false,
@@ -267,16 +256,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "tertiary-content",
-                "reflect": false,
-                "defaultValue": "''"
+                "attribute": "container-rel",
+                "reflect": false
             },
-            "themeMode": {
+            "imageSrc": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "'light' | 'dark'",
-                    "resolved": "\"dark\" | \"light\"",
+                    "original": "string | undefined",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -285,16 +273,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "theme-mode",
-                "reflect": false,
-                "defaultValue": "'light'"
+                "attribute": "image-src",
+                "reflect": false
             },
-            "placeImageRight": {
-                "type": "boolean",
+            "imageAlt": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
+                    "original": "string | undefined",
+                    "resolved": "string",
                     "references": {}
                 },
                 "required": false,
@@ -303,16 +290,15 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "place-image-right",
-                "reflect": false,
-                "defaultValue": "false"
+                "attribute": "image-alt",
+                "reflect": false
             },
-            "documentPosition": {
-                "type": "number",
+            "imagePlacement": {
+                "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "number",
-                    "resolved": "number",
+                    "original": "'left' | 'right'",
+                    "resolved": "\"left\" | \"right\"",
                     "references": {}
                 },
                 "required": false,
@@ -321,59 +307,45 @@ export class SearchcraftBaseSearchResult {
                     "tags": [],
                     "text": ""
                 },
-                "attribute": "document-position",
-                "reflect": false,
-                "defaultValue": "0"
-            }
-        };
-    }
-    static get events() {
-        return [{
-                "method": "buttonCallback",
-                "name": "buttonCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
+                "attribute": "image-placement",
+                "reflect": false
+            },
+            "customStyles": {
+                "type": "string",
+                "mutable": false,
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
+                    "original": "string | undefined",
+                    "resolved": "string",
                     "references": {}
-                }
-            }, {
-                "method": "keyDownCallback",
-                "name": "keyDownCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
+                },
+                "required": false,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
+                "attribute": "custom-styles",
+                "reflect": false
+            },
+            "documentPosition": {
+                "type": "number",
+                "mutable": false,
                 "complexType": {
-                    "original": "any",
-                    "resolved": "any",
+                    "original": "number",
+                    "resolved": "number",
                     "references": {}
-                }
-            }, {
-                "method": "resultCallback",
-                "name": "resultCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
+                },
+                "required": false,
+                "optional": false,
                 "docs": {
                     "tags": [],
                     "text": ""
                 },
-                "complexType": {
-                    "original": "any",
-                    "resolved": "any",
-                    "references": {}
-                }
-            }];
+                "attribute": "document-position",
+                "reflect": false,
+                "defaultValue": "0"
+            }
+        };
     }
 }
 //# sourceMappingURL=searchcraft-base-search-result.js.map

package/dist/collection/components/searchcraft-base-search-result/searchcraft-base-search-result.js.map

@@ -1 +1 @@
-{"version":3,"file":"searchcraft-base-search-result.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useSearchcraftStore } from '@provider/store';\nimport { Component, Event, Fragment, h, Prop } from '@stencil/core';\nimport classNames from 'classnames';\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  @Prop() buttonText = '';\n  @Prop() customStyles = '{}';\n  @Prop() titleContent = '';\n  @Prop() imageDescription = '';\n  @Prop() imageSource = '';\n  @Prop() isInteractive = false;\n  @Prop() linkHref = '';\n  @Prop() primaryContent = '';\n  @Prop() secondaryContent = '';\n  @Prop() subtitleContent = '';\n  @Prop() tertiaryContent = '';\n  @Prop() themeMode: 'light' | 'dark' = 'light';\n  @Prop() placeImageRight = false;\n  @Prop() documentPosition = 0;\n\n  @Event() buttonCallback: () => void = () => {};\n  @Event() keyDownCallback: () => void = () => {};\n  @Event() resultCallback: () => void = () => {};\n\n  private searchcraftStore = useSearchcraftStore.getState();\n\n  private handleButtonClick = () => {\n    this.buttonCallback();\n  };\n\n  private handleClick = () => {\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    try {\n      return JSON.parse(this.customStyles);\n    } catch (error) {\n      console.error('Error parsing custom styles:', error);\n      return {};\n    }\n  };\n\n  render() {\n    const isLightTheme = this.themeMode === 'light';\n    const styles = this.parseStyles();\n    const imageStyle = isLightTheme ? 'imageLight' : 'imageDark';\n    const imageContainer = this.imageSource && (\n      <div\n        class={classNames(\n          'imageContainer',\n          'searchcraft-base-search-result-image-container',\n        )}\n      >\n        <img\n          alt={this.imageDescription}\n          class={classNames(imageStyle, 'searchcraft-search-result-image')}\n          src={this.imageSource}\n          style={styles.image || {}}\n        />\n      </div>\n    );\n\n    const contentContainer = (\n      <div\n        class={classNames(\n          'contentContainer',\n          'searchcraft-base-search-result-content-container',\n        )}\n      >\n        <h2\n          class={classNames(\n            isLightTheme ? 'titleLight' : 'titleDark',\n            'searchcraft-base-search-result-title',\n          )}\n          style={styles.title || {}}\n        >\n          {this.titleContent}\n        </h2>\n        <h3\n          class={classNames(\n            isLightTheme ? 'subtitleContentLight' : 'subtitleContentDark',\n            'searchcraft-base-search-result-subtitle',\n          )}\n          style={styles.subtitle || {}}\n        >\n          {this.subtitleContent}\n        </h3>\n        <p\n          class={classNames(\n            isLightTheme ? 'primaryContentLight' : 'primaryContentDark',\n            'searchcraft-base-search-result-primary-content',\n          )}\n          style={styles.primaryContent || {}}\n        >\n          {this.primaryContent}\n        </p>\n        <div\n          class={classNames(\n            'secondaryContentContainer',\n            'searchcraft-base-search-result-secondary-content-container',\n          )}\n        >\n          <p\n            class={classNames(\n              isLightTheme ? 'secondaryContentLight' : 'secondaryContentDark',\n              'searchcraft-base-search-result-secondary-content',\n            )}\n            style={styles.secondaryContent || {}}\n          >\n            {this.secondaryContent}\n          </p>\n          <p\n            class={classNames(\n              `${isLightTheme ? 'tertiaryContentLight' : 'tertiaryContentDark'}${this.tertiaryContent ? ' hasContent' : ''}`,\n              'searchcraft-base-search-result-tertiary-content',\n            )}\n            style={styles.tertiaryContent || {}}\n          >\n            {this.tertiaryContent}\n          </p>\n        </div>\n        {this.buttonText && (\n          <button\n            onClick={this.handleButtonClick}\n            style={styles.button || {}}\n            type='button'\n          >\n            {this.buttonText}\n          </button>\n        )}\n      </div>\n    );\n\n    return (\n      <a\n        class={classNames(\n          this.isInteractive\n            ? isLightTheme\n              ? 'interactiveResultContainerLight'\n              : 'interactiveResultContainerDark'\n            : 'resultContainer',\n          'searchcraft-search-result-container',\n        )}\n        onKeyDown={this.keyDownCallback}\n        onClick={this.handleClick}\n        href={this.linkHref}\n        rel='noreferrer'\n        style={styles.container || {}}\n        tabindex='0'\n        target='_blank'\n      >\n        {this.placeImageRight ? (\n          <Fragment>\n            {contentContainer}\n            {imageContainer}\n          </Fragment>\n        ) : (\n          <Fragment>\n            {imageContainer}\n            {contentContainer}\n          </Fragment>\n        )}\n      </a>\n    );\n  }\n}\n"]}
+{"version":3,"file":"searchcraft-base-search-result.js","sourceRoot":"","sources":["../../../../src/components/searchcraft-base-search-result/searchcraft-base-search-result.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useSearchcraftStore } from '@provider/store';\nimport { Component, Fragment, h, Prop } from '@stencil/core';\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  @Prop() titleContent: string | undefined;\n  @Prop() subtitleContent: string | undefined;\n  @Prop() bodyContent: string | undefined;\n  @Prop() footerContent: string | undefined;\n  @Prop() buttonLabel: string | undefined;\n  @Prop() buttonHref: string | undefined;\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() containerHref: string | undefined;\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() imageSrc: string | undefined;\n  @Prop() imageAlt: string | undefined;\n  @Prop() imagePlacement: 'left' | 'right';\n  @Prop() customStyles: string | undefined;\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"]}