@searchcraft/javascript-sdk 0.1.2 → 0.1.3

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

@@ -1,210 +0,0 @@
-:root {
-  --font-stack: Helvetica, Arial, sans-serif;
-}
-
-.interactiveResultContainerLight {
-  background-color: #FAFAFA;
-  align-items: flex-start;
-  border-radius: 16px;
-  display: flex;
-  position: relative;
-  flex-direction: column;
-  gap: 16px;
-  padding: 8px;
-}
-@media (min-width: 600px) {
-  .interactiveResultContainerLight {
-    flex-direction: row;
-  }
-}
-
-.interactiveResultContainerDark {
-  background-color: #2E2E2E;
-  align-items: flex-start;
-  border-radius: 16px;
-  display: flex;
-  position: relative;
-  flex-direction: column;
-  gap: 16px;
-  padding: 8px;
-}
-@media (min-width: 600px) {
-  .interactiveResultContainerDark {
-    flex-direction: row;
-  }
-}
-
-.resultContainer {
-  align-items: flex-start;
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-@media (min-width: 600px) {
-  .resultContainer {
-    flex-direction: row;
-  }
-}
-
-.interactiveIconLarge {
-  display: inline-block;
-  position: absolute;
-  right: 5px;
-  top: 8px;
-}
-@media (max-width: 600px) {
-  .interactiveIconLarge {
-    display: none;
-  }
-}
-
-.interactiveIconSmall {
-  position: absolute;
-  right: 5px;
-  top: -2px;
-  display: inline-block;
-}
-@media (min-width: 600px) {
-  .interactiveIconSmall {
-    display: none;
-  }
-}
-
-.imageContainer {
-  max-height: 540px;
-  max-width: 100%;
-}
-@media (min-width: 600px) {
-  .imageContainer {
-    max-height: 100%;
-    max-width: 50%;
-  }
-}
-
-.contentContainer {
-  max-height: 100%;
-  max-width: 100%;
-}
-@media (min-width: 600px) {
-  .contentContainer {
-    max-width: 50%;
-  }
-}
-
-.imageLight {
-  aspect-ratio: 2/1;
-  border-radius: 8px;
-  max-height: 100%;
-  max-width: 100%;
-  border: 1px solid #D9D9D9;
-}
-
-.imageDark {
-  aspect-ratio: 2/1;
-  border-radius: 8px;
-  max-height: 100%;
-  max-width: 100%;
-  border: 1px solid #333;
-}
-
-.headingLight {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  position: relative;
-  color: #292929;
-}
-
-.headingDark {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  position: relative;
-  color: #FFF;
-}
-
-.subheadingLight {
-  font-family: var(--font-stack);
-  font-size: 12px;
-  font-weight: 400;
-  line-height: 16px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #737373;
-}
-
-.subheadingDark {
-  font-family: var(--font-stack);
-  font-size: 12px;
-  font-weight: 400;
-  line-height: 16px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #BFBFBF;
-}
-
-.primaryContentLight {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #404040;
-}
-
-.primaryContentDark {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #E6E6E6;
-}
-
-.secondaryContentLight {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #404040;
-}
-
-.secondaryContentDark {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #E6E6E6;
-}
-
-.tertiaryContentLight {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #404040;
-}
-
-.tertiaryContentDark {
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 400;
-  line-height: 20px;
-  margin-bottom: 4px;
-  margin-top: 0px;
-  color: #E6E6E6;
-}

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

@@ -1,123 +0,0 @@
-import { h } from "@stencil/core";
-import { useSearchcraftStore } from "../../provider/store";
-import { extractDynamicProperties, parseCustomStyles, parseSearchKeys, } from "../../utils/utils";
-export class SearchcraftBaseSearchResults {
-    constructor() {
-        this.query = '';
-        this.searchResults = null;
-        this.searchKeys = '';
-        this.customStylesForResults = {};
-    }
-    componentDidLoad() {
-        // Initialize searchKeys if not provided
-        if (!this.searchKeys || this.searchKeys.length === 0) {
-            console.warn('No searchKeys provided; using empty keys array.');
-            this.searchKeys = ''; // Ensure it's explicitly set as an empty array
-        }
-        // Subscribe to state changes
-        this.unsubscribe = useSearchcraftStore.subscribe((state) => {
-            this.searchResults = Object.assign({}, state.searchResults);
-            this.query = state.query;
-        });
-        // Fetch initial state
-        const { searchResults, query } = useSearchcraftStore.getState();
-        this.searchResults = searchResults;
-        this.query = query;
-    }
-    disconnectedCallback() {
-        if (this.unsubscribe) {
-            this.unsubscribe();
-        }
-    }
-    render() {
-        var _a, _b, _c, _d, _e, _f, _g;
-        if (!((_a = this.searchResults) === null || _a === void 0 ? void 0 : _a.data)) {
-            console.warn('No search results data available');
-            return h("div", null, "No results to display.");
-        }
-        const parsedSearchKeys = parseSearchKeys(this.searchKeys);
-        const parsedCustomStyles = parseCustomStyles(this.customStylesForResults);
-        return (h("div", { class: 'resultsContainer' }, (_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((document, index) => {
-                const { doc: result } = document;
-                const dynamicProperties = extractDynamicProperties(result, parsedSearchKeys);
-                // Render the custom element if present, otherwise fallback to default
-                const customElement = this.hostElement.querySelector('[slot="result-template"]');
-                if (customElement) {
-                    // Clone the custom element and pass data to it
-                    const customElementClone = customElement.cloneNode(true);
-                    customElementClone.removeAttribute('slot'); // Remove the slot attribute
-                    customElementClone.setAttribute('data-result', JSON.stringify(result));
-                    return (h("div", { key: `${dynamicProperties.id}-${index}` }, customElementClone.outerHTML));
-                }
-                // Fallback to the default element
-                return (h("searchcraft-base-search-result", { key: `${dynamicProperties.id}-${index}`, "button-callback": () => console.log('button callback'), "result-callback": () => console.log('interactive element'), "keydown-callback": () => console.log('keydown'), "is-interactive": true, "heading-text": dynamicProperties[parsedSearchKeys[0]], "subheading-text": dynamicProperties[parsedSearchKeys[1]], "primary-content": dynamicProperties[parsedSearchKeys[2]], "secondary-content": dynamicProperties[parsedSearchKeys[3]], "tertiary-content": dynamicProperties[parsedSearchKeys[4]], "image-source": dynamicProperties[parsedSearchKeys[parsedSearchKeys.length - 1]], customStyles: parsedCustomStyles }));
-            }), 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 && (h("searchcraft-error-message", { "error-message": `No search results found for "${this.query}" query` })), h("slot", { name: 'result-template' })));
-    }
-    static get is() { return "searchcraft-base-search-results"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["searchcraft-base-search-results.module.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["searchcraft-base-search-results.module.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "searchKeys": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Array of keys to dynamically extract properties from each document.\nMust be explicitly set by the parent component."
-                },
-                "attribute": "search-keys",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "customStylesForResults": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Record<string, string>",
-                    "resolved": "string | { [x: string]: string; }",
-                    "references": {
-                        "Record": {
-                            "location": "global",
-                            "id": "global::Record"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Custom styles to apply to search results.\nExpected format: JSON string, e.g., '{\"borderRadius\": \"10px\", \"padding\": \"16px\"}'"
-                },
-                "attribute": "custom-styles-for-results",
-                "reflect": false,
-                "defaultValue": "{}"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "query": {},
-            "searchResults": {}
-        };
-    }
-    static get elementRef() { return "hostElement"; }
-}
-//# sourceMappingURL=searchcraft-base-search-results.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-base-search-results.js","sourceRoot":"","sources":["../../../src/components/searchcraft-base-search-results/searchcraft-base-search-results.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, State, Element } from '@stencil/core';\nimport type { SearchcraftResponse } from '@searchcraft/core';\n\nimport { useSearchcraftStore } from '@provider/store';\nimport {\n  extractDynamicProperties,\n  parseCustomStyles,\n  parseSearchKeys,\n} from '@utils/utils';\n\n@Component({\n  tag: 'searchcraft-base-search-results',\n  styleUrl: 'searchcraft-base-search-results.module.scss',\n  shadow: true,\n})\nexport class SearchcraftBaseSearchResults {\n  @State() query = '';\n  @State() searchResults: SearchcraftResponse | null = null;\n\n  /**\n   * Array of keys to dynamically extract properties from each document.\n   * Must be explicitly set by the parent component.\n   */\n  @Prop() searchKeys = '';\n\n  /**\n   * Custom styles to apply to search results.\n   * Expected format: JSON string, e.g., '{\"borderRadius\": \"10px\", \"padding\": \"16px\"}'\n   */\n  @Prop() customStylesForResults: string | Record<string, string> = {};\n\n  @Element() hostElement: HTMLElement; // Reference to the host element\n\n  private unsubscribe: () => void;\n\n  componentDidLoad() {\n    // Initialize searchKeys if not provided\n    if (!this.searchKeys || this.searchKeys.length === 0) {\n      console.warn('No searchKeys provided; using empty keys array.');\n      this.searchKeys = ''; // Ensure it's explicitly set as an empty array\n    }\n\n    // Subscribe to state changes\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      this.searchResults = { ...state.searchResults };\n      this.query = state.query;\n    });\n\n    // Fetch initial state\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  render() {\n    if (!this.searchResults?.data) {\n      console.warn('No search results data available');\n      return <div>No results to display.</div>;\n    }\n\n    const parsedSearchKeys = parseSearchKeys(this.searchKeys);\n    const parsedCustomStyles = parseCustomStyles(this.customStylesForResults);\n    return (\n      <div class='resultsContainer'>\n        {this.searchResults?.data?.hits?.map((document, index) => {\n          const { doc: result } = document;\n          const dynamicProperties = extractDynamicProperties(\n            result,\n            parsedSearchKeys,\n          );\n\n          // Render the custom element if present, otherwise fallback to default\n          const customElement = this.hostElement.querySelector(\n            '[slot=\"result-template\"]',\n          );\n          if (customElement) {\n            // Clone the custom element and pass data to it\n            const customElementClone = customElement.cloneNode(\n              true,\n            ) as HTMLElement;\n            customElementClone.removeAttribute('slot'); // Remove the slot attribute\n            customElementClone.setAttribute(\n              'data-result',\n              JSON.stringify(result),\n            );\n            return (\n              <div key={`${dynamicProperties.id}-${index}`}>\n                {customElementClone.outerHTML}\n              </div>\n            );\n          }\n          // Fallback to the default element\n          return (\n            <searchcraft-base-search-result\n              key={`${dynamicProperties.id}-${index}`}\n              button-callback={() => console.log('button callback')}\n              result-callback={() => console.log('interactive element')}\n              keydown-callback={() => console.log('keydown')}\n              is-interactive={true}\n              heading-text={dynamicProperties[parsedSearchKeys[0]]}\n              subheading-text={dynamicProperties[parsedSearchKeys[1]]}\n              primary-content={dynamicProperties[parsedSearchKeys[2]]}\n              secondary-content={dynamicProperties[parsedSearchKeys[3]]}\n              tertiary-content={dynamicProperties[parsedSearchKeys[4]]}\n              image-source={\n                dynamicProperties[parsedSearchKeys[parsedSearchKeys.length - 1]]\n              }\n              customStyles={parsedCustomStyles}\n            />\n          );\n        })}\n\n        {this.query.length > 0 &&\n          this.searchResults?.data?.hits?.length === 0 && (\n            <searchcraft-error-message\n              error-message={`No search results found for \"${this.query}\" query`}\n            />\n          )}\n\n        {/* Slot for custom element */}\n        <slot name='result-template' />\n      </div>\n    );\n  }\n}\n"]}

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

@@ -1,20 +0,0 @@
-:root {
-  --font-stack: Helvetica, Arial, sans-serif;
-}
-
-.resultsContainer {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  margin: 100px 20px;
-}
-.resultsContainer > p {
-  align-self: center;
-}
-.resultsContainer > div {
-  margin-bottom: 20px;
-}
-.resultsContainer > div img {
-  height: 300px;
-  width: 200px;
-}

package/dist/collection/components/searchcraft-button/searchcraft-button.js

@@ -1,137 +0,0 @@
-import { h, Fragment, } from "@stencil/core";
-import classNames from "classnames";
-export class SearchcraftButton {
-    constructor() {
-        this.handleClick = () => {
-            this.buttonClick.emit(); // Emit the event instead of calling a function
-        };
-        this.iconElement = undefined;
-        this.iconOnly = false;
-        this.iconPosition = 'left';
-        this.label = 'Search';
-        this.isRequesting = false;
-        this.theme = 'light';
-    }
-    getButtonStyle() {
-        return this.theme === 'light' ? 'buttonLight' : 'buttonDark';
-    }
-    render() {
-        const buttonStyle = this.getButtonStyle();
-        return (h(Fragment, { key: 'd95f39680caa437650f45f089c25273ddf24e076' }, this.iconOnly ? (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.isRequesting ? (h("searchcraft-spinner-dark", null)) : (this.iconElement))) : (h("button", { class: classNames(buttonStyle, 'searchcraft-button'), onClick: this.handleClick, type: 'submit' }, this.iconPosition === 'left' && this.isRequesting ? (h("div", { class: 'spinner-margin-right' }, h("searchcraft-spinner-dark", null))) : (this.iconElement), h("span", { class: classNames(this.isRequesting && 'button-label', 'searchcraft-button-label') }, this.label)))));
-    }
-    static get is() { return "searchcraft-button"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["searchcraft-button.module.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["searchcraft-button.module.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "iconElement": {
-                "type": "unknown",
-                "mutable": false,
-                "complexType": {
-                    "original": "Element",
-                    "resolved": "Element",
-                    "references": {
-                        "Element": {
-                            "location": "global",
-                            "id": "global::Element"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                }
-            },
-            "iconOnly": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "icon-only",
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "iconPosition": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "icon-position",
-                "reflect": false,
-                "defaultValue": "'left'"
-            },
-            "label": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "attribute": "label",
-                "reflect": false,
-                "defaultValue": "'Search'"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "isRequesting": {},
-            "theme": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "buttonClick",
-                "name": "buttonClick",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }];
-    }
-}
-//# sourceMappingURL=searchcraft-button.js.map

package/dist/collection/components/searchcraft-button/searchcraft-button.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"searchcraft-button.js","sourceRoot":"","sources":["../../../src/components/searchcraft-button/searchcraft-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EAEL,IAAI,EACJ,CAAC,EACD,KAAK,EACL,QAAQ,GACT,MAAM,eAAe,CAAC;AACvB,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,MAAM,OAAO,iBAAiB;;QAepB,gBAAW,GAAG,GAAG,EAAE;YACzB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC,+CAA+C;QAC1E,CAAC,CAAC;;wBAfiB,KAAK;4BACD,MAAM;qBACb,QAAQ;4BAIA,KAAK;qBACZ,OAAO;;IAEhB,cAAc;QACpB,OAAO,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC;IAC/D,CAAC;IAMD,MAAM;QACJ,MAAM,WAAW,GAAG,IAAI,CAAC,cAAc,EAAE,CAAC;QAE1C,OAAO,CACL,EAAC,QAAQ,uDACN,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,cACE,KAAK,EAAE,UAAU,CAAC,WAAW,EAAE,oBAAoB,CAAC,EACpD,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ,IAEZ,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnB,mCAA4B,CAC7B,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,WAAW,CACjB,CACM,CACV,CAAC,CAAC,CAAC,CACF,cACE,KAAK,EAAE,UAAU,CAAC,WAAW,EAAE,oBAAoB,CAAC,EACpD,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,IAAI,EAAC,QAAQ;YAEZ,IAAI,CAAC,YAAY,KAAK,MAAM,IAAI,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CACnD,WAAK,KAAK,EAAC,sBAAsB;gBAC/B,mCAA4B,CACxB,CACP,CAAC,CAAC,CAAC,CACF,IAAI,CAAC,WAAW,CACjB;YACD,YACE,KAAK,EAAE,UAAU,CACf,IAAI,CAAC,YAAY,IAAI,cAAc,EACnC,0BAA0B,CAC3B,IAEA,IAAI,CAAC,KAAK,CACN,CACA,CACV,CACQ,CACZ,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","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@Component({\n  tag: 'searchcraft-button',\n  styleUrl: 'searchcraft-button.module.scss',\n  shadow: true,\n})\nexport class SearchcraftButton {\n  @Prop() iconElement?: Element;\n  @Prop() iconOnly = false;\n  @Prop() iconPosition = 'left';\n  @Prop() label = 'Search';\n\n  @Event() buttonClick!: EventEmitter<void>;\n\n  @State() isRequesting = false;\n  @State() theme = 'light';\n\n  private getButtonStyle() {\n    return this.theme === 'light' ? 'buttonLight' : 'buttonDark';\n  }\n\n  private handleClick = () => {\n    this.buttonClick.emit(); // Emit the event instead of calling a function\n  };\n\n  render() {\n    const buttonStyle = this.getButtonStyle();\n\n    return (\n      <Fragment>\n        {this.iconOnly ? (\n          <button\n            class={classNames(buttonStyle, '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(buttonStyle, 'searchcraft-button')}\n            onClick={this.handleClick}\n            type='submit'\n          >\n            {this.iconPosition === 'left' && this.isRequesting ? (\n              <div class='spinner-margin-right'>\n                <searchcraft-spinner-dark />\n              </div>\n            ) : (\n              this.iconElement\n            )}\n            <span\n              class={classNames(\n                this.isRequesting && 'button-label',\n                'searchcraft-button-label',\n              )}\n            >\n              {this.label}\n            </span>\n          </button>\n        )}\n      </Fragment>\n    );\n  }\n}\n"]}

package/dist/collection/components/searchcraft-button/searchcraft-button.module.css

@@ -1,82 +0,0 @@
-:root {
-  --font-stack: Helvetica, Arial, sans-serif;
-}
-
-.buttonLight {
-  border-radius: 8px;
-  display: flex;
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 20px;
-  padding: 11px 20px;
-  position: relative;
-  background-color: #000;
-  border: 1px solid #E6E6E6;
-  color: #FFF;
-}
-.buttonLight:hover {
-  cursor: pointer;
-}
-.buttonLight:hover {
-  background-color: #2E2E2E;
-}
-.buttonLight:focus {
-  outline: 2px solid #000000;
-}
-
-.buttonDark {
-  border-radius: 8px;
-  display: flex;
-  font-family: var(--font-stack);
-  font-size: 16px;
-  font-weight: 700;
-  line-height: 20px;
-  padding: 11px 20px;
-  position: relative;
-  background-color: #FFF;
-  border: 1px solid #404040;
-  color: #292929;
-}
-.buttonDark:hover {
-  cursor: pointer;
-}
-.buttonDark:hover {
-  background-color: #FAFAFA;
-}
-.buttonDark:focus {
-  outline: 2px solid #404040;
-}
-
-.spinnerMarginRight {
-  left: 4px;
-  margin-right: 4px;
-  position: absolute;
-}
-
-.spinnerMarginLeft {
-  left: 4px;
-  margin-left: 4px;
-  position: absolute;
-}
-
-.buttonLabel {
-  animation: right-and-back 0.2s;
-  margin-left: 4px;
-  position: relative;
-}
-
-@keyframes right-and-back {
-  0% {
-    right: -6px;
-  }
-  50% {
-    right: -12px;
-  }
-  75% {
-    right: -6px;
-  }
-  100% {
-    right: 0px;
-  }
-}