npm - @searchcraft/javascript-sdk - Versions diffs - 0.6.0 → 0.7.1 - Mend

@searchcraft/javascript-sdk 0.6.0 → 0.7.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (271) hide show

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

@@ -2,59 +2,103 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b3b77ea2.js');
-const store = require('./store-d7ebcf7a.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);
-        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 {};
-        };
-        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;
-    }
+        }
+        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 || {} }));
@@ -67,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 CHANGED Viewed

	@@ -1 +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}
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.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 CHANGED Viewed

@@ -2,33 +2,68 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b3b77ea2.js');
-const store = require('./store-d7ebcf7a.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);
-        this.adInterval = 4;
-        this.customStylesForResults = undefined;
-        this.searchResultMappings = undefined;
-        this.placeAdAtEnd = false;
-        this.placeAdAtStart = true;
-        this.resultImagePlacement = 'right';
-        this.buttonLabel = undefined;
-        this.buttonTarget = '_blank';
-        this.buttonRel = undefined;
-        this.containerTarget = '_blank';
-        this.containerRel = undefined;
-        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) {
@@ -37,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();
@@ -53,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;
         });
@@ -96,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 CHANGED Viewed

	@@ -1 +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}
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.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}

package/dist/cjs/searchcraft-button_3.cjs.entry.js CHANGED Viewed

@@ -2,59 +2,69 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-b3b77ea2.js');
+const index = require('./index-a81df4f0.js');
 const index$1 = require('./index-5b0b9d4c.js');
-const searchcraftButtonModuleCss = ":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-button{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);border-radius:8px;display:flex;padding:12px 20px;position:relative;background-color:var(--sc-surface-brand-primary);border:1px solid var(--sc-border-primary);color:var(--sc-content-brand-on-primary)}.searchcraft-button:hover{cursor:pointer;background-color:var(--sc-surface-brand-primary-hover)}.searchcraft-button:focus{outline:2px solid var(--sc-surface-brand-primary)}.buttonLabel{position:relative}";
-const SearchcraftButtonStyle0 = searchcraftButtonModuleCss;
 const SearchcraftButton = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.buttonClick = index.createEvent(this, "buttonClick", 7);
-        this.handleClick = () => {
-            this.buttonClick.emit();
-        };
-        this.iconElement = undefined;
-        this.iconOnly = false;
-        this.iconPosition = 'left';
-        this.label = 'Search';
-        this.isRequesting = false;
     }
+    /**
+     * The icon element.
+     */
+    iconElement;
+    /**
+     * Should the button only display an icon.
+     */
+    iconOnly = false;
+    /**
+     * The position of the icon.
+     */
+    iconPosition = 'left';
+    /**
+     * The label for the button.
+     */
+    label = 'Search';
+    /**
+     * When the button is clicked.
+     */
+    buttonClick;
+    isRequesting = false;
+    handleClick = () => {
+        this.buttonClick.emit();
+    };
     render() {
-        return (index.h(index.Fragment, { key: '52b95f09f5da9f281b250285623e150c5d952dce' }, this.iconOnly ? (index.h("button", { class: index$1.classNames('searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.isRequesting ? (index.h("searchcraft-spinner-dark", null)) : (this.iconElement))) : (index.h("button", { class: index$1.classNames('searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.iconPosition === 'left' && this.iconElement, index.h("span", { class: index$1.classNames('buttonLabel', 'searchcraft-button-label') }, this.label)))));
+        return (index.h(index.Fragment, { key: 'af99927e7c05f06ec9a63123c7f740a0e96e734b' }, this.iconOnly ? (index.h("button", { class: index$1.classNames('searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.isRequesting ? (index.h("searchcraft-spinner-dark", null)) : (this.iconElement))) : (index.h("button", { class: index$1.classNames('searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.iconPosition === 'left' && this.iconElement, index.h("span", { class: index$1.classNames('buttonLabel', 'searchcraft-button-label') }, this.label)))));
     }
 };
-SearchcraftButton.style = SearchcraftButtonStyle0;
-const searchcraftErrorMessageModuleCss = ":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-error-message{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);color:var(--sc-content-danger);margin:0}";
-const SearchcraftErrorMessageStyle0 = searchcraftErrorMessageModuleCss;
 const SearchcraftErrorMessage = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.errorMessage = undefined;
     }
+    /**
+     * The error message.
+     */
+    errorMessage;
     render() {
-        return (index.h("p", { key: '5bdc428adf6f239d66a9b0f946ee6e582de41e86', class: 'searchcraft-error-message' }, this.errorMessage || 'Search term is required.'));
+        return (index.h("p", { key: '432bc13abc15f4d9c62ebc751e44e266b258b1f9', class: 'searchcraft-error-message' }, this.errorMessage || 'Search term is required.'));
     }
 };
-SearchcraftErrorMessage.style = SearchcraftErrorMessageStyle0;
-const searchcraftInputLabelModuleCss = ":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-input-label{font-family:var(--sc-font-family);-webkit-font-smoothing:antialiased;font-size:var(--sc-body-small-bold-font-size);font-weight:var(--sc-body-small-bold-font-weight);line-height:var(--sc-body-small-bold-line-height);color:var(--sc-content-neutral-primary);margin-top:4px;margin-bottom:4px}";
-const SearchcraftInputLabelStyle0 = searchcraftInputLabelModuleCss;
 const SearchcraftInputLabel = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.inputLabelClassName = '';
-        this.label = undefined;
     }
+    /**
+     * The classname applied to the label element.
+     */
+    inputLabelClassName = '';
+    label = '';
     render() {
-        return (index.h("label", { key: '4f913c1d9027ff781725a01e71e241cb5767eadb', class: index$1.classNames('searchcraft-input-label', this.inputLabelClassName), htmlFor: 'searchcraft-input-id' }, this.label));
+        return (index.h("label", { key: '9c71dc7429d7289ed59e7effacb91e040a9ac6a1', class: index$1.classNames('searchcraft-input-label', this.inputLabelClassName), htmlFor: 'searchcraft-input-id' }, this.label));
     }
 };
-SearchcraftInputLabel.style = SearchcraftInputLabelStyle0;
 exports.searchcraft_button = SearchcraftButton;
 exports.searchcraft_error_message = SearchcraftErrorMessage;

package/dist/cjs/searchcraft-button_3.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"searchcraft-button.searchcraft-error-message.searchcraft-input-label.entry.cjs.js","mappings":";;;;;;;~~AAAA~~,MAAM,~~0BAA0B~~,GAAG,~~46HAA46H~~,CAAC;~~AACh9H~~,~~gCAAe~~,~~0BAA0B;;MCoB5B~~,~~iBAAiB;;;;QAyBpB~~,~~gBAAW~~,GAAG;~~YACpB~~,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;~~SACzB~~,CAAC~~;;wBAnBiB,KAAK~~;~~4BAID~~,MAAM;~~qBAIb,QAAQ;4BAOA,KAAK;;IAM7B,MAAM;~~QACJ,QACEA,QAACC,cAAQ,uDACN,IAAI,CAAC,QAAQ,IACZD,oBACE,KAAK,EAAEE,kBAAU,CAAC,oBAAoB,CAAC,EACvC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,IAChBF,yCAA4B,KAE5B,IAAI,CAAC,WAAW,CACjB,CACM,KAETA,oBACE,KAAK,EAAEE,kBAAU,CAAC,oBAAoB,CAAC,EACvC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,KAAK,MAAM,IAAI,IAAI,CAAC,WAAW,EACjDF,kBAAM,KAAK,EAAEE,kBAAU,CAAC,aAAa,EAAE,0BAA0B,CAAC,IAC/D,IAAI,CAAC,KAAK,CACN,CACA,CACV,CACQ,EACX;KACH~~;;;;AC~~/EH,~~MAAM~~,~~gCAAgC~~,~~GAAG,4kHAA4kH,CAAC~~;~~AACtnH~~,~~sCAAe,gCAAgC;;MCelC,uBAAuB;;;;;IAMlC,~~MAAM;QACJ,QACEF,gEAAG,KAAK,EAAC,2BAA2B,IACjC,IAAI,CAAC,YAAY,IAAI,0BAA0B,CAC9C,EACJ;KACH~~;;;;AC5BH~~,~~MAAM~~,~~8BAA8B~~,~~GAAG~~,~~0nHAA0nH~~,CAAC;~~AAClqH~~,~~oCAAe~~,~~8BAA8B;;MCgBhC~~,~~qBAAqB;;;mCAID,~~EAAE~~;;;IAGjC~~,MAAM;QACJ,QACEA,oEACE,KAAK,EAAEE,kBAAU,CAAC,yBAAyB,EAAE,IAAI,CAAC,mBAAmB,CAAC,EACtE,OAAO,EAAC,sBAAsB,IAE7B,IAAI,CAAC,KAAK,CACL,EACR;KACH~~;;;;;;;;~~","names":["h","Fragment","classNames"],"sources":["src/components/searchcraft-button/searchcraft-button.~~module.scss?tag=searchcraft-button","src/components/searchcraft-button/searchcraft-button.~~tsx","src/components/searchcraft-error-message/searchcraft-error-message.~~module.scss?tag=searchcraft-error-message","src/components/searchcraft-error-message/searchcraft-error-message.~~tsx","src/components/searchcraft-input-label/searchcraft-input-label.~~module.scss?tag=searchcraft-input-label","src/components/searchcraft-input-label/searchcraft-input-label.~~tsx"],"sourcesContent":[".searchcraft-button {\n @include body-bold;\n\n border-radius: 8px;\n display: flex;\n padding: 12px 20px;\n position: relative;\n\n background-color: var(--sc-surface-brand-primary);\n border: 1px solid var(--sc-border-primary);\n color: var(--sc-content-brand-on-primary);\n\n &:hover {\n cursor: pointer;\n background-color: var(--sc-surface-brand-primary-hover);\n }\n\n &:focus {\n outline: 2px solid var(--sc-surface-brand-primary);\n }\n}\n\n.buttonLabel {\n position: relative;\n}","import {\n Component,\n Event,\n type EventEmitter,\n Prop,\n h,\n State,\n Fragment,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\n/*\n This web component represents a button to be consumed within the `search-input-form` component.\n * It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.\n * It is consumed within the `searchcraft-input-form` component.\n /\n@Component({\n tag: 'searchcraft-button',\n ~~styleUrl: 'searchcraft-button.module.scss',\n~~ shadow: false,\n})\nexport class SearchcraftButton {\n /\n The icon element.\n /\n @Prop() iconElement?: Element;\n /\n Should the button only display an icon.\n /\n @Prop() iconOnly = false;\n /\n The position of the icon.\n /\n @Prop() iconPosition = 'left';\n /\n The label for the button.\n /\n @Prop() label = 'Search';\n\n /\n When the button is clicked.\n /\n @Event() buttonClick!: EventEmitter<void>;\n\n @State() isRequesting = false;\n\n private handleClick = () => {\n this.buttonClick.emit();\n };\n\n render() {\n return (\n <Fragment>\n {this.iconOnly ? (\n <button\n class={classNames('searchcraft-button')}\n onClick={this.handleClick}\n type='submit'\n >\n {this.isRequesting ? (\n <searchcraft-spinner-dark />\n ) : (\n this.iconElement\n )}\n </button>\n ) : (\n <button\n class={classNames('searchcraft-button')}\n onClick={this.handleClick}\n type='submit'\n >\n {this.iconPosition === 'left' && this.iconElement}\n <span class={classNames('buttonLabel', 'searchcraft-button-label')}>\n {this.label}\n </span>\n </button>\n )}\n </Fragment>\n );\n }\n}\n","~~.searchcraft-error-message {\n @include body-small();\n color: var(--sc-content-danger);\n margin: 0;\n}\n","~~import { Component, Prop, h } from '@stencil/core';\n\n/\n This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-error-message error-message=\"No search results found for query\" />\n * ```\n /\n@Component({\n tag: 'searchcraft-error-message',\n ~~styleUrl: 'searchcraft-error-message.module.scss',\n~~ shadow: false,\n})\nexport class SearchcraftErrorMessage {\n /\n The error message.\n /\n @Prop() errorMessage?: string;\n\n render() {\n return (\n <p class='searchcraft-error-message'>\n {this.errorMessage \|\| 'Search term is required.'}\n </p>\n );\n }\n}\n","~~.searchcraft-input-label {\n @include body-small-bold();\n color: var(--sc-content-neutral-primary);\n margin-top: 4px;\n margin-bottom: 4px;\n}\n","~~import { Component, Prop, h } from '@stencil/core';\nimport classNames from 'classnames';\n\n/\n This web component serves as the input label for the searchcraft-input-form component.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-input-label label=\"Search\" />\n * ```\n /\n@Component({\n tag: 'searchcraft-input-label',\n ~~styleUrl: 'searchcraft-input-label.module.scss',\n~~ shadow: false,\n})\nexport class SearchcraftInputLabel {\n /\n The classname applied to the label element.\n */\n @Prop() inputLabelClassName? = '';\n @Prop() label: ~~string~~;\n\n render() {\n return (\n <label\n class={classNames('searchcraft-input-label', this.inputLabelClassName)}\n htmlFor='searchcraft-input-id'\n >\n {this.label}\n </label>\n );\n }\n}\n"],"version":3}
1	+ {"file":"searchcraft-button.searchcraft-error-message.searchcraft-input-label.entry.cjs.js","mappings":";;;;;;;MAoBa,iBAAiB;;;;;;;;IAIpB,WAAW,CAAW;;;;IAItB,QAAQ,GAAG,KAAK,CAAC;;;;IAIjB,YAAY,GAAG,MAAM,CAAC;;;;IAItB,KAAK,GAAG,QAAQ,CAAC;;;;IAKhB,WAAW,CAAsB;IAEjC,YAAY,GAAG,KAAK,CAAC;IAEtB,WAAW,GAAG;QACpB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;KACzB,CAAC;IAEF,MAAM;QACJ,QACEA,QAACC,cAAQ,uDACN,IAAI,CAAC,QAAQ,IACZD,oBACE,KAAK,EAAEE,kBAAU,CAAC,oBAAoB,CAAC,EACvC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,IAChBF,yCAA4B,KAE5B,IAAI,CAAC,WAAW,CACjB,CACM,KAETA,oBACE,KAAK,EAAEE,kBAAU,CAAC,oBAAoB,CAAC,EACvC,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,KAAK,MAAM,IAAI,IAAI,CAAC,WAAW,EACjDF,kBAAM,KAAK,EAAEE,kBAAU,CAAC,aAAa,EAAE,0BAA0B,CAAC,IAC/D,IAAI,CAAC,KAAK,CACN,CACA,CACV,CACQ,EACX;KACH;;;MC/DU,uBAAuB;;;;;;;IAI1B,YAAY,CAAU;IAE9B,MAAM;QACJ,QACEF,gEAAG,KAAK,EAAC,2BAA2B,IACjC,IAAI,CAAC,YAAY,IAAI,0BAA0B,CAC9C,EACJ;KACH;;;MCXU,qBAAqB;;;;;;;IAIxB,mBAAmB,GAAI,EAAE,CAAC;IAC1B,KAAK,GAAG,EAAE,CAAC;IAEnB,MAAM;QACJ,QACEA,oEACE,KAAK,EAAEE,kBAAU,CAAC,yBAAyB,EAAE,IAAI,CAAC,mBAAmB,CAAC,EACtE,OAAO,EAAC,sBAAsB,IAE7B,IAAI,CAAC,KAAK,CACL,EACR;KACH;;;;;;;","names":["h","Fragment","classNames"],"sources":["src/components/searchcraft-button/searchcraft-button.tsx","src/components/searchcraft-error-message/searchcraft-error-message.tsx","src/components/searchcraft-input-label/searchcraft-input-label.tsx"],"sourcesContent":["import {\n Component,\n Event,\n type EventEmitter,\n Prop,\n h,\n State,\n Fragment,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\n/*\n This web component represents a button to be consumed within the `search-input-form` component.\n * It provides a clear, interactive way for users to submit search queries or trigger actions in a search interface.\n * It is consumed within the `searchcraft-input-form` component.\n /\n@Component({\n tag: 'searchcraft-button',\n shadow: false,\n})\nexport class SearchcraftButton {\n /\n The icon element.\n /\n @Prop() iconElement?: Element;\n /\n Should the button only display an icon.\n /\n @Prop() iconOnly = false;\n /\n The position of the icon.\n /\n @Prop() iconPosition = 'left';\n /\n The label for the button.\n /\n @Prop() label = 'Search';\n\n /\n When the button is clicked.\n /\n @Event() buttonClick!: EventEmitter<void>;\n\n @State() isRequesting = false;\n\n private handleClick = () => {\n this.buttonClick.emit();\n };\n\n render() {\n return (\n <Fragment>\n {this.iconOnly ? (\n <button\n class={classNames('searchcraft-button')}\n onClick={this.handleClick}\n type='submit'\n >\n {this.isRequesting ? (\n <searchcraft-spinner-dark />\n ) : (\n this.iconElement\n )}\n </button>\n ) : (\n <button\n class={classNames('searchcraft-button')}\n onClick={this.handleClick}\n type='submit'\n >\n {this.iconPosition === 'left' && this.iconElement}\n <span class={classNames('buttonLabel', 'searchcraft-button-label')}>\n {this.label}\n </span>\n </button>\n )}\n </Fragment>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\n\n/\n This web component is designed to display a user-friendly error message when a search query fails, providing clear feedback to users and enhancing their experience when an issue arises during the search process.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-error-message error-message=\"No search results found for query\" />\n * ```\n /\n@Component({\n tag: 'searchcraft-error-message',\n shadow: false,\n})\nexport class SearchcraftErrorMessage {\n /\n The error message.\n /\n @Prop() errorMessage?: string;\n\n render() {\n return (\n <p class='searchcraft-error-message'>\n {this.errorMessage \|\| 'Search term is required.'}\n </p>\n );\n }\n}\n","import { Component, Prop, h } from '@stencil/core';\nimport classNames from 'classnames';\n\n/\n This web component serves as the input label for the searchcraft-input-form component.\n \n ## Usage\n * ```html\n * <!-- index.html -->\n * <searchcraft-input-label label=\"Search\" />\n * ```\n /\n@Component({\n tag: 'searchcraft-input-label',\n shadow: false,\n})\nexport class SearchcraftInputLabel {\n /\n The classname applied to the label element.\n */\n @Prop() inputLabelClassName? = '';\n @Prop() label = '';\n\n render() {\n return (\n <label\n class={classNames('searchcraft-input-label', this.inputLabelClassName)}\n htmlFor='searchcraft-input-id'\n >\n {this.label}\n </label>\n );\n }\n}\n"],"version":3}