@searchcraft/javascript-sdk 0.4.0 → 0.4.1

package/dist/components/{p-b1a59f07.js.map → p-415f7b11.js.map}

@@ -1 +1 @@
-{"file":"p-b1a59f07.js","mappings":"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","names":[],"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: 900px) {\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: 900px) {\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@Component({\n  tag: 'searchcraft-base-search-result',\n  styleUrl: 'searchcraft-base-search-result.module.scss',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResult {\n  @Prop() titleContent: string | undefined;\n  @Prop() subtitleContent: string | undefined;\n  @Prop() bodyContent: string | undefined;\n  @Prop() footerContent: string | undefined;\n  @Prop() buttonLabel: string | undefined;\n  @Prop() buttonHref: string | undefined;\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() containerHref: string | undefined;\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() imageSrc: string | undefined;\n  @Prop() imageAlt: string | undefined;\n  @Prop() imagePlacement: 'left' | 'right';\n  @Prop() customStyles: string | undefined;\n  @Prop() documentPosition = 0;\n\n  private searchcraftStore = useSearchcraftStore.getState();\n\n  private recordMeasureEvent = () => {\n    const searchcraft = this.searchcraftStore.getSearchcraftInstance();\n\n    if (searchcraft) {\n      const document_position = this.documentPosition;\n      const search_term = this.searchcraftStore.query;\n      const number_of_documents =\n        this.searchcraftStore.searchResults?.data?.hits?.length || 0;\n\n      searchcraft.sendMeasureEvent('document_clicked', {\n        document_position,\n        number_of_documents,\n        search_term,\n      });\n    }\n  };\n\n  private parseStyles = (): Record<string, { [key: string]: string }> => {\n    if (this.customStyles) {\n      try {\n        return JSON.parse(this.customStyles);\n      } catch (error) {\n        console.error('Error parsing custom styles:', error);\n        return {};\n      }\n    }\n    return {};\n  };\n\n  render() {\n    const styles = this.parseStyles();\n    const imageContainer = this.imageSrc && (\n      <img\n        alt={this.imageAlt}\n        class='searchcraft-search-result-image'\n        src={this.imageSrc}\n        style={styles.image || {}}\n      />\n    );\n\n    const contentContainer = (\n      <Fragment>\n        {this.imageSrc && this.imagePlacement === 'left' && imageContainer}\n        <div class='searchcraft-base-search-result-content-container'>\n          {this.titleContent && (\n            <h2\n              class='searchcraft-base-search-result-title'\n              style={styles.title || {}}\n            >\n              {this.titleContent}\n            </h2>\n          )}\n          {this.subtitleContent && (\n            <h3\n              class='searchcraft-base-search-result-subtitle'\n              style={styles.subtitle || {}}\n            >\n              {this.subtitleContent}\n            </h3>\n          )}\n          {this.bodyContent && (\n            <p\n              class='searchcraft-base-search-result-body-content'\n              style={styles.primaryContent || {}}\n            >\n              {this.bodyContent}\n            </p>\n          )}\n\n          {this.footerContent && (\n            <p\n              class='searchcraft-base-search-result-footer-content'\n              style={styles.secondaryContent || {}}\n            >\n              {this.footerContent}\n            </p>\n          )}\n          {this.buttonHref && !this.containerHref && this.buttonLabel && (\n            <a\n              class='searchcraft-search-result-button'\n              href={this.buttonHref}\n              style={styles.button || {}}\n              target={this.buttonTarget}\n              rel={this.buttonRel}\n            >\n              {this.buttonLabel}\n            </a>\n          )}\n        </div>\n        {this.imageSrc && this.imagePlacement === 'right' && imageContainer}\n      </Fragment>\n    );\n\n    /** Render as an anchor tag if the containerHref prop is present. */\n    if (this.containerHref) {\n      return (\n        <a\n          class='searchcraft-search-result-container'\n          onClick={this.recordMeasureEvent}\n          href={this.containerHref}\n          rel={this.containerRel}\n          style={styles.container || {}}\n          tabindex='0'\n          target={this.containerTarget}\n        >\n          {contentContainer}\n        </a>\n      );\n    }\n\n    /** Render as a div if no href prop. */\n    return (\n      <div\n        class='searchcraft-search-result-container'\n        style={styles.container || {}}\n      >\n        {contentContainer}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-415f7b11.js","mappings":"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","names":[],"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: 900px) {\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: 900px) {\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@Component({\n  tag: 'searchcraft-base-search-result',\n  styleUrl: 'searchcraft-base-search-result.module.scss',\n  shadow: false,\n})\nexport class SearchcraftBaseSearchResult {\n  @Prop() titleContent: string | undefined;\n  @Prop() subtitleContent: string | undefined;\n  @Prop() bodyContent: string | undefined;\n  @Prop() footerContent: string | undefined;\n  @Prop() buttonLabel: string | undefined;\n  @Prop() buttonHref: string | undefined;\n  @Prop() buttonTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() buttonRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() containerHref: string | undefined;\n  @Prop() containerTarget: '_blank' | '_self' | '_top' | '_parent' = '_blank';\n  @Prop() containerRel: 'noreferrer' | 'noopener' | 'nofollow' | undefined;\n  @Prop() imageSrc: string | undefined;\n  @Prop() imageAlt: string | undefined;\n  @Prop() imagePlacement: 'left' | 'right';\n  @Prop() customStyles: string | undefined;\n  @Prop() documentPosition = 0;\n\n  private searchcraftStore = useSearchcraftStore.getState();\n\n  private recordMeasureEvent = () => {\n    const searchcraft = this.searchcraftStore.getSearchcraftInstance();\n\n    if (searchcraft) {\n      const document_position = this.documentPosition;\n      const search_term = this.searchcraftStore.query;\n      const number_of_documents =\n        this.searchcraftStore.searchResults?.data?.hits?.length || 0;\n\n      searchcraft.sendMeasureEvent('document_clicked', {\n        document_position,\n        number_of_documents,\n        search_term,\n      });\n    }\n  };\n\n  private parseStyles = (): Record<string, { [key: string]: string }> => {\n    if (this.customStyles) {\n      try {\n        return JSON.parse(this.customStyles);\n      } catch (error) {\n        console.error('Error parsing custom styles:', error);\n        return {};\n      }\n    }\n    return {};\n  };\n\n  render() {\n    const styles = this.parseStyles();\n    const imageContainer = this.imageSrc && (\n      <img\n        alt={this.imageAlt}\n        class='searchcraft-search-result-image'\n        src={this.imageSrc}\n        style={styles.image || {}}\n      />\n    );\n\n    const contentContainer = (\n      <Fragment>\n        {this.imageSrc && this.imagePlacement === 'left' && imageContainer}\n        <div class='searchcraft-base-search-result-content-container'>\n          {this.titleContent && (\n            <h2\n              class='searchcraft-base-search-result-title'\n              style={styles.title || {}}\n            >\n              {this.titleContent}\n            </h2>\n          )}\n          {this.subtitleContent && (\n            <h3\n              class='searchcraft-base-search-result-subtitle'\n              style={styles.subtitle || {}}\n            >\n              {this.subtitleContent}\n            </h3>\n          )}\n          {this.bodyContent && (\n            <p\n              class='searchcraft-base-search-result-body-content'\n              style={styles.primaryContent || {}}\n            >\n              {this.bodyContent}\n            </p>\n          )}\n\n          {this.footerContent && (\n            <p\n              class='searchcraft-base-search-result-footer-content'\n              style={styles.secondaryContent || {}}\n            >\n              {this.footerContent}\n            </p>\n          )}\n          {this.buttonHref && !this.containerHref && this.buttonLabel && (\n            <a\n              class='searchcraft-search-result-button'\n              href={this.buttonHref}\n              style={styles.button || {}}\n              target={this.buttonTarget}\n              rel={this.buttonRel}\n            >\n              {this.buttonLabel}\n            </a>\n          )}\n        </div>\n        {this.imageSrc && this.imagePlacement === 'right' && imageContainer}\n      </Fragment>\n    );\n\n    /** Render as an anchor tag if the containerHref prop is present. */\n    if (this.containerHref) {\n      return (\n        <a\n          class='searchcraft-search-result-container'\n          onClick={this.recordMeasureEvent}\n          href={this.containerHref}\n          rel={this.containerRel}\n          style={styles.container || {}}\n          tabindex='0'\n          target={this.containerTarget}\n        >\n          {contentContainer}\n        </a>\n      );\n    }\n\n    /** Render as a div if no href prop. */\n    return (\n      <div\n        class='searchcraft-search-result-container'\n        style={styles.container || {}}\n      >\n        {contentContainer}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-68897c11.js → p-4353a2b8.js}

@@ -1,7 +1,7 @@
 import { p as proxyCustomElement, H, c as createEvent, h, F as Fragment } from './p-5639be85.js';
 import { c as classNames } from './p-5cdc6210.js';
-import { u as useSearchcraftStore } from './p-be63dcac.js';
-import { m as mergeFacetRoots, r as removeSubstringMatches } from './p-0deddac7.js';
+import { u as useSearchcraftStore } from './p-3c181808.js';
+import { m as mergeFacetRoots, r as removeSubstringMatches } from './p-9982883f.js';
 import { d as defineCustomElement$2 } from './p-04d13314.js';
 import { d as defineCustomElement$1 } from './p-de50441f.js';
 
@@ -26,37 +26,45 @@ const SearchcraftFiltersList = /*@__PURE__*/ proxyCustomElement(class Searchcraf
             return `${label.replace(/-/g, ' ').replace(/\b\w/g, (char) => char.toUpperCase())} (${count})`;
         };
         this.fieldName = undefined;
+        this.baseFacetRoot = undefined;
         this.facetRoot = undefined;
         this.selectedPaths = {};
         this.lastQuery = undefined;
+        this.lastTimeTaken = undefined;
+        this.hasNewSearchTerm = false;
         this.unsubscribe = undefined;
     }
-    initFacetRootFromState(state) {
-        var _a;
+    handleStateUpdate(state) {
+        var _a, _b;
         const facetPrime = (_a = state.searchResults) === null || _a === void 0 ? void 0 : _a.data.facets;
-        if (facetPrime) {
-            const facetRoot = facetPrime.find((facet) => this.fieldName === Object.keys(facet)[0]);
-            if (this.facetRoot) {
-                this.facetRoot = mergeFacetRoots(this.fieldName, this.facetRoot, facetRoot);
-            }
-            else {
-                this.facetRoot = facetRoot;
+        const timeTaken = (_b = state.searchResults) === null || _b === void 0 ? void 0 : _b.data.time_taken;
+        /** Things to do when the state's search term has changed, but before the response received */
+        if (state.query !== this.lastQuery) {
+            this.selectedPaths = {};
+            this.hasNewSearchTerm = true;
+        }
+        /** Things to do when a new response with a new facet prime has been received */
+        if (timeTaken !== this.lastTimeTaken && facetPrime) {
+            this.facetRoot = undefined;
+            const incomingFacetRoot = facetPrime.find((facet) => this.fieldName === Object.keys(facet)[0]);
+            /** Data is from a new search term: completely override our facets */
+            if (this.hasNewSearchTerm) {
+                this.baseFacetRoot = incomingFacetRoot;
+                this.facetRoot = incomingFacetRoot;
+                this.hasNewSearchTerm = false;
             }
-            // Clear the selected paths if the query changed
-            if (state.query !== this.lastQuery) {
-                this.selectedPaths = {};
-                // Remove the facet root if the query is empty
-                if (state.query.trim().length === 0) {
-                    this.facetRoot = undefined;
-                }
+            else if (this.baseFacetRoot) {
+                /** Data is from an existing search term, merge the facets together */
+                this.facetRoot = mergeFacetRoots(this.fieldName, this.baseFacetRoot, incomingFacetRoot);
             }
         }
         this.lastQuery = state.query;
+        this.lastTimeTaken = timeTaken;
     }
     connectedCallback() {
-        this.initFacetRootFromState(this.searchStore);
+        this.handleStateUpdate(this.searchStore);
         this.unsubscribe = useSearchcraftStore.subscribe((state) => {
-            this.initFacetRootFromState(state);
+            this.handleStateUpdate(state);
         });
     }
     disconnectedCallback() {
@@ -64,7 +72,27 @@ const SearchcraftFiltersList = /*@__PURE__*/ proxyCustomElement(class Searchcraf
         (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
     }
     handleCheckboxChange(path) {
-        this.selectedPaths = Object.assign(Object.assign({}, this.selectedPaths), { [path]: !this.selectedPaths[path] });
+        const isCheckboxChecked = !this.selectedPaths[path];
+        if (isCheckboxChecked) {
+            /**
+             * Checkbox Checked: Add to the selectedPaths record
+             * Uses spread operator here so UI updates.
+             */
+            this.selectedPaths = Object.assign(Object.assign({}, this.selectedPaths), { [path]: true });
+        }
+        else {
+            /**
+             * Checkbox Uncheck: Remove any paths and sub-paths
+             */
+            const updatedPaths = Object.keys(this.selectedPaths).filter((testPath) => !testPath.includes(path));
+            this.selectedPaths = updatedPaths.reduce((acc, str) => {
+                acc[str] = true;
+                return acc;
+            }, {});
+        }
+        /**
+         * Emit the paths array, with parent paths removed.
+         */
         const paths = Object.keys(this.selectedPaths).filter((path) => this.selectedPaths[path]);
         const pathsWithParentPathsRemoved = removeSubstringMatches(paths);
         this.facetSelectionUpdated.emit({ paths: pathsWithParentPathsRemoved });
@@ -72,7 +100,7 @@ const SearchcraftFiltersList = /*@__PURE__*/ proxyCustomElement(class Searchcraf
     render() {
         var _a;
         const firstFacet = (_a = this.facetRoot) === null || _a === void 0 ? void 0 : _a[this.fieldName];
-        return (h("div", { key: '3f7daaa4d9efdd5cfef6c254bd56aad457eceb47', class: classNames('filtersListContainer', 'searchcraft-filters-list-container') }, !firstFacet && (h("p", { key: '3f9fc14961209475b88cd4726014035dfcf62a20', class: 'searchcraft-facet-message' }, "Enter a search to view facets.")), firstFacet === null || firstFacet === void 0 ? void 0 :
+        return (h("div", { key: '3dbfa6515c9628e8eea3cddcd108403a9d51f7c1', class: classNames('filtersListContainer', 'searchcraft-filters-list-container') }, !firstFacet && (h("p", { key: 'c7c519a6a4b6d27343a0ba953d428ec892dbdc93', class: 'searchcraft-facet-message' }, "Enter a search to view facets.")), firstFacet === null || firstFacet === void 0 ? void 0 :
             firstFacet.map((facetChild) => {
                 var _a;
                 const isChildSelected = facetChild.children
@@ -90,9 +118,12 @@ const SearchcraftFiltersList = /*@__PURE__*/ proxyCustomElement(class Searchcraf
     static get style() { return SearchcraftFacetListStyle0; }
 }, [0, "searchcraft-facet-list", {
         "fieldName": [1, "field-name"],
+        "baseFacetRoot": [32],
         "facetRoot": [32],
         "selectedPaths": [32],
         "lastQuery": [32],
+        "lastTimeTaken": [32],
+        "hasNewSearchTerm": [32],
         "unsubscribe": [32]
     }]);
 function defineCustomElement() {
@@ -121,4 +152,4 @@ function defineCustomElement() {
 
 export { SearchcraftFiltersList as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-68897c11.js.map
+//# sourceMappingURL=p-4353a2b8.js.map

package/dist/components/p-4353a2b8.js.map

@@ -0,0 +1 @@
+{"file":"p-4353a2b8.js","mappings":"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","names":[],"sources":["src/components/searchcraft-facet-list/searchcraft-facet-list.module.scss?tag=searchcraft-facet-list","src/components/searchcraft-facet-list/searchcraft-facet-list.tsx"],"sourcesContent":[".filtersListContainer {\n  width: 100%;\n}\n\n.filterCheckboxLabel {\n  align-items: center;\n  color: var(--sc-content-primary);\n  display: flex;\n  font-family: var(--sc-font-family);\n  font-size: 14px;\n  font-weight: 600;\n  gap: 14px;\n  position: relative;\n  -webkit-font-smoothing: antialiased;\n}\n\n.filterCheckboxLabel input[type=\"checkbox\"] {\n  align-items: center;\n  appearance: none;\n  background-color: var(--sc-surface-brand-secondary-hover);\n  border: 1px solid var(--sc-surface-disabled);\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  height: 24px;\n  justify-content: center;\n  width: 24px;\n}\n\n.filterCheckboxLabel input[type=\"checkbox\"]:focus {\n  outline: 2px solid var(--sc-surface-brand-primary);\n}\n\n.filterCheckboxLabel input[type=\"checkbox\"]:checked {\n  background-color: var(--sc-surface-brand-primary);\n  position: relative;\n}\n\n.filterCheckboxLabel input[type=\"checkbox\"]:checked + .checkContainer {\n  display: block;\n}\n\n.filterCheckboxLabel input[type=\"checkbox\"]:checked + .dashContainer {\n  display: block;\n}\n\n.childFilterCheckboxLabel {\n  align-items: center;\n  color: var(--sc-content-primary);\n  display: flex;\n  font-family: var(--sc-font-family);\n  font-size: 14px;\n  font-weight: 600;\n  gap: 12px;\n  margin-left: 24px;\n  position: relative;\n}\n\n.childFilterCheckboxLabel input[type=\"checkbox\"] {\n  align-items: center;\n  appearance: none;\n  background-color: var(--sc-surface-brand-secondary-hover);\n  border: 1px solid var(--sc-surface-disabled);\n  border-radius: 8px;\n  cursor: pointer;\n  display: flex;\n  height: 24px;\n  justify-content: center;\n  position: relative;\n  width: 24px;\n  -webkit-font-smoothing: antialiased;\n}\n\n.childFilterCheckboxLabel input[type=\"checkbox\"]:focus {\n  outline: 2px solid var(--sc-surface-brand-primary);\n}\n\n.childFilterCheckboxLabel input[type=\"checkbox\"]:checked {\n  background-color: var(--sc-surface-brand-primary);\n  position: relative;\n}\n\n.childFilterCheckboxLabel input[type=\"checkbox\"]:checked + .checkContainer {\n  display: block;\n}\n\n.childFilterCheckboxLabel input[type=\"checkbox\"]:checked + .dashContainer {\n  display: block;\n}\n\n.checkContainer {\n  display: none;\n  height: 16px;\n  width: 16px;\n  position: absolute;\n  top: 9px;\n  left: 8px;\n}\n\n.dashContainer {\n  display: none;\n  height: 3px;\n  width: 14px;\n  position: absolute;\n  top: 3px;\n  left: 9px;\n}\n\n.searchcraft-facet-message {\n  @include body-small();\n  color: var(--sc-content-disabled);\n  text-align: center;\n}","import {\n  Component,\n  h,\n  State,\n  Prop,\n  Event,\n  type EventEmitter,\n  Fragment,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport type { FacetChild, FacetRoot } from '@searchcraft/core';\n\nimport { useSearchcraftStore, type SearchcraftState } from '@provider/store';\nimport { mergeFacetRoots, removeSubstringMatches } from '@utils/utils';\n\n@Component({\n  tag: 'searchcraft-facet-list',\n  styleUrl: 'searchcraft-facet-list.module.scss',\n  shadow: false,\n})\nexport class SearchcraftFiltersList {\n  @Prop() fieldName: string;\n\n  @Event() facetSelectionUpdated: EventEmitter<{ paths: string[] }>;\n\n  @State() baseFacetRoot: FacetRoot | undefined;\n  @State() facetRoot: FacetRoot | undefined;\n  @State() selectedPaths: Record<string, boolean> = {};\n  @State() lastQuery: string | undefined;\n  @State() lastTimeTaken: number | undefined;\n  @State() hasNewSearchTerm = false;\n\n  @State() unsubscribe: (() => void) | undefined;\n\n  private searchStore = useSearchcraftStore.getState();\n\n  handleStateUpdate(state: SearchcraftState) {\n    const facetPrime = state.searchResults?.data.facets;\n    const timeTaken = state.searchResults?.data.time_taken;\n\n    /** Things to do when the state's search term has changed, but before the response received */\n    if (state.query !== this.lastQuery) {\n      this.selectedPaths = {};\n      this.hasNewSearchTerm = true;\n    }\n\n    /** Things to do when a new response with a new facet prime has been received */\n    if (timeTaken !== this.lastTimeTaken && facetPrime) {\n      this.facetRoot = undefined;\n      const incomingFacetRoot: FacetRoot = facetPrime.find(\n        (facet) => this.fieldName === Object.keys(facet)[0],\n      );\n\n      /** Data is from a new search term: completely override our facets */\n      if (this.hasNewSearchTerm) {\n        this.baseFacetRoot = incomingFacetRoot;\n        this.facetRoot = incomingFacetRoot;\n        this.hasNewSearchTerm = false;\n      } else if (this.baseFacetRoot) {\n        /** Data is from an existing search term, merge the facets together */\n        this.facetRoot = mergeFacetRoots(\n          this.fieldName,\n          this.baseFacetRoot,\n          incomingFacetRoot,\n        );\n      }\n    }\n\n    this.lastQuery = state.query;\n    this.lastTimeTaken = timeTaken;\n  }\n\n  connectedCallback() {\n    this.handleStateUpdate(this.searchStore);\n\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      this.handleStateUpdate(state);\n    });\n  }\n\n  disconnectedCallback() {\n    this.unsubscribe?.();\n  }\n\n  handleCheckboxChange(path: string) {\n    const isCheckboxChecked = !this.selectedPaths[path];\n\n    if (isCheckboxChecked) {\n      /**\n       * Checkbox Checked: Add to the selectedPaths record\n       * Uses spread operator here so UI updates.\n       */\n      this.selectedPaths = {\n        ...this.selectedPaths,\n        [path]: true,\n      };\n    } else {\n      /**\n       * Checkbox Uncheck: Remove any paths and sub-paths\n       */\n      const updatedPaths = Object.keys(this.selectedPaths).filter(\n        (testPath) => !testPath.includes(path),\n      );\n\n      this.selectedPaths = updatedPaths.reduce(\n        (acc, str) => {\n          acc[str] = true;\n          return acc;\n        },\n        {} as Record<string, boolean>,\n      );\n    }\n\n    /**\n     * Emit the paths array, with parent paths removed.\n     */\n    const paths = Object.keys(this.selectedPaths).filter(\n      (path) => this.selectedPaths[path],\n    );\n    const pathsWithParentPathsRemoved = removeSubstringMatches(paths);\n\n    this.facetSelectionUpdated.emit({ paths: pathsWithParentPathsRemoved });\n  }\n\n  formatLabel = (facetChild: FacetChild): string => {\n    const label = facetChild.path.replace(/^\\//, '');\n    const count = facetChild.count;\n    return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n  };\n\n  formatSubLabel = (\n    facetChild: FacetChild,\n    facetChildAncestor: FacetChild,\n  ): string => {\n    const facetChildPath = facetChild.path.substring(\n      facetChildAncestor.path.length,\n    );\n    const label = facetChildPath.replace(/^\\//, '');\n    const count = facetChild.count;\n    return `${label.replace(/-/g, ' ').replace(/\\b\\w/g, (char) => char.toUpperCase())} (${count})`;\n  };\n\n  render() {\n    const firstFacet = this.facetRoot?.[this.fieldName];\n\n    return (\n      <div\n        class={classNames(\n          'filtersListContainer',\n          'searchcraft-filters-list-container',\n        )}\n      >\n        {!firstFacet && (\n          <p class='searchcraft-facet-message'>\n            Enter a search to view facets.\n          </p>\n        )}\n        {firstFacet?.map((facetChild: FacetChild) => {\n          const isChildSelected = facetChild.children\n            ? facetChild.children?.some(\n                (child) => this.selectedPaths[child.path],\n              )\n            : false;\n\n          return (\n            <div\n              key={facetChild.path}\n              class={classNames('searchcraft-filters-list-item')}\n            >\n              <label\n                class={classNames(\n                  'filterCheckboxLabel',\n                  'searchcraft-filters-list-checkbox-label',\n                )}\n              >\n                <input\n                  checked={this.selectedPaths[facetChild.path]}\n                  onChange={(_event: Event) =>\n                    this.handleCheckboxChange(facetChild.path)\n                  }\n                  type='checkbox'\n                />\n                {isChildSelected ? (\n                  <div\n                    class={classNames(\n                      'dashContainer',\n                      'searchcraft-filter-list-dash-container',\n                    )}\n                  >\n                    <searchcraft-dash-icon />\n                  </div>\n                ) : (\n                  <div\n                    class={classNames(\n                      'checkContainer',\n                      'searchcraft-filter-list-check-container',\n                    )}\n                  >\n                    <searchcraft-check-icon />\n                  </div>\n                )}\n                {this.formatLabel(facetChild)}\n              </label>\n              {facetChild.children && facetChild.children.length > 0 && (\n                <Fragment>\n                  {facetChild.children.map((grandchild) => (\n                    <label\n                      key={grandchild.path}\n                      class={classNames(\n                        'childFilterCheckboxLabel',\n                        'searchcraft-child-filter-checkbox-label',\n                      )}\n                      style={{\n                        display: this.selectedPaths[facetChild.path]\n                          ? 'flex'\n                          : 'none',\n                      }}\n                    >\n                      <input\n                        checked={this.selectedPaths[grandchild.path]}\n                        onChange={(_event: Event) => {\n                          this.handleCheckboxChange(grandchild.path);\n                        }}\n                        type='checkbox'\n                      />\n                      <div\n                        class={classNames(\n                          'checkContainer',\n                          'searchcraft-filter-list-check-container',\n                        )}\n                      >\n                        <searchcraft-check-icon />\n                      </div>\n                      {this.formatSubLabel(grandchild, facetChild)}\n                    </label>\n                  ))}\n                </Fragment>\n              )}\n            </div>\n          );\n        })}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-69eed21e.js → p-4c89f065.js}

@@ -1,5 +1,5 @@
 const name = "@searchcraft/javascript-sdk";
-const version = "0.4.0";
+const version = "0.4.1";
 const description = "Searchcraft Javascript SDK";
 const author = "Searchcraft";
 const license = "Apache-2.0";
@@ -63,4 +63,4 @@ const packageJson = {
 
 export { packageJson as p };
 
-//# sourceMappingURL=p-69eed21e.js.map
+//# sourceMappingURL=p-4c89f065.js.map

package/dist/components/p-4c89f065.js.map

@@ -0,0 +1 @@
+{"file":"p-4c89f065.js","mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/{p-8062f0ea.js → p-4fad3388.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-5639be85.js';
 import { c as classNames } from './p-5cdc6210.js';
-import { p as parseCustomStyles } from './p-0deddac7.js';
+import { p as parseCustomStyles } from './p-9982883f.js';
 
 const searchcraftInputModuleCss = ":root{--sc-spinner-size:20px;--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px}: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}searchcraft-input{display:flex;flex:1}.searchcraft-input-wrapper{display:inline-block;position:relative;cursor:text}.searchcraft-input-wrapper-flex{display:flex;flex:1}.searchcraft-input-flex{flex:1}.searchcraft-input{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);background-color:var(--sc-surface-neutral-secondary);border:none;border-radius:var(--sc-input-border-radius);color:var(--sc-content-neutral-primary);outline:none;padding-left:var(--sc-input-padding-left);padding-right:var(--sc-input-padding-right);padding-top:12px;padding-bottom:12px}.searchcraft-input::placeholder{color:var(--sc-content-disabled)}.searchcraft-input:focus{outline:var(--sc-border-brand) solid 2px}.searchcraft-input:focus::placeholder{opacity:0}.searchcraft-input.error{color:var(--sc-content-danger);outline:var(--sc-border-danger) solid 2px}.searchcraft-input.error:focus{outline:var(--sc-border-danger) solid 2px}.searchcraft-input-search-icon-wrapper{align-items:center;justify-content:center;display:flex;position:absolute;pointer-events:none;bottom:0;left:0;top:0;width:var(--sc-input-padding-left)}.searchcraft-input-search-icon{pointer-events:none;width:var(--sc-input-search-icon-size);height:var(--sc-input-search-icon-size)}.searchcraft-input-clear-button{all:unset;align-items:center;justify-content:center;cursor:pointer;display:flex;position:absolute;border:none;outline:none;bottom:0;right:0;top:0;width:var(--sc-input-padding-right)}.searchcraft-input-clear-icon{width:var(--sc-input-clear-icon-size);height:var(--sc-input-clear-icon-size)}";
 const SearchcraftInputStyle0 = searchcraftInputModuleCss;
@@ -79,4 +79,4 @@ function defineCustomElement() {
 
 export { SearchcraftInput as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-8062f0ea.js.map
+//# sourceMappingURL=p-4fad3388.js.map

package/dist/components/{p-8062f0ea.js.map → p-4fad3388.js.map}

@@ -1 +1 @@
-{"file":"p-8062f0ea.js","mappings":";;;;AAAA,MAAM,yBAAyB,GAAG,sqJAAsqJ,CAAC;AACzsJ,+BAAe,yBAAyB;;MCqB3B,gBAAgB;;;;;;QAgB3B,kBAAa,GAAG,CAAC,KAAY;YAC3B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;YAC/C,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC;YAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SACpC,CAAC;QAEF,qBAAgB,GAAG;YACjB,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;YAErB,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;aACxB;YACD,IAAI,IAAI,CAAC,UAAU,KAAK,EAAE,EAAE;gBAC1B,OAAO;aACR;SACF,CAAC;4BA9BsD,EAAE;qBAC1C,KAAK;qCACW,EAAE;iCACN,EAAE;8BACL,EAAE;4BACJ,KAAK;gCACD,cAAc;qBACzB,EAAE;oBACH,IAAI;0BAKG,IAAI,CAAC,KAAK;;IAmBhC,MAAM;QACJ,MAAM,qBAAqB,GAAG,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAEnE,MAAM,sBAAsB,GAAG,UAAU,CAAC,2BAA2B,EAAE;YACrE,gCAAgC,EAAE,IAAI,CAAC,IAAI;SAC5C,CAAC,CAAC;QAEH,MAAM,eAAe,GAAG,UAAU,CAAC,mBAAmB,EAAE;YACtD,wBAAwB,EAAE,IAAI,CAAC,IAAI;YACnC,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;QAEH,MAAM,oBAAoB,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;QAExD,QACE,4DAAK,KAAK,EAAE,sBAAsB,IAChC,8DACE,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,eAAe,EACtB,OAAO,EAAE,CAAC,KAAK;gBACb,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;aAC3B,EACD,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,KAAK,EAAE,qBAAqB,EAC5B,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,UAAU,GACtB,EACF,4DAAK,KAAK,EAAC,uCAAuC,IAChD,4DACE,KAAK,EAAC,+BAA+B,EACrC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,8DAAO,EAAE,EAAC,mBAAmB,oCAAsC,EACnE,6DACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,CACF,EACL,oBAAoB,KACnB,+DACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,gCAAgC,EACtC,OAAO,EAAE,IAAI,CAAC,gBAAgB,IAE9B,4DACE,KAAK,EAAC,8BAA8B,EACpC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,8DAAO,EAAE,EAAC,YAAY,yCAA2C,EACjE,6DACE,CAAC,EAAC,uIAAuI,EACzI,MAAM,EAAC,OAAO,kBACD,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,CACC,CACV,CACG,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/searchcraft-input/searchcraft-input.module.scss?tag=searchcraft-input","src/components/searchcraft-input/searchcraft-input.tsx"],"sourcesContent":["searchcraft-input {\n  display: flex;\n  flex: 1;\n}\n\n.searchcraft-input-wrapper {\n  display: inline-block;\n  position: relative;\n  cursor: text;\n}\n\n.searchcraft-input-wrapper-flex {\n  display: flex;\n  flex: 1;\n}\n\n.searchcraft-input-flex {\n  flex: 1;\n}\n\n.searchcraft-input {\n  @include body();\n  background-color: var(--sc-surface-neutral-secondary);\n  border: none;\n  border-radius: var(--sc-input-border-radius);\n  color: var(--sc-content-neutral-primary);\n  outline: none;\n  padding-left: var(--sc-input-padding-left);\n  padding-right: var(--sc-input-padding-right);\n  padding-top: 12px;\n  padding-bottom: 12px;\n\n  &::placeholder {\n    color: var(--sc-content-disabled);\n  }\n\n  &:focus {\n    outline: var(--sc-border-brand) solid 2px;\n  }\n\n  &:focus::placeholder {\n    opacity: 0;\n  }\n}\n\n.searchcraft-input.error {\n  color: var(--sc-content-danger);\n  outline: var(--sc-border-danger) solid 2px;\n\n  &:focus {\n    outline: var(--sc-border-danger) solid 2px;\n  }\n}\n\n.searchcraft-input-search-icon-wrapper {\n  align-items: center;\n  justify-content: center;\n  display: flex;\n  position: absolute;\n  pointer-events: none;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: var(--sc-input-padding-left);\n}\n\n.searchcraft-input-search-icon {\n  pointer-events: none;\n  width: var(--sc-input-search-icon-size);\n  height: var(--sc-input-search-icon-size);\n}\n\n.searchcraft-input-clear-button {\n  all: unset;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  display: flex;\n  position: absolute;\n  border: none;\n  outline: none;\n  bottom: 0;\n  right: 0;\n  top: 0;\n  width: var(--sc-input-padding-right);\n}\n\n.searchcraft-input-clear-icon {\n  width: var(--sc-input-clear-icon-size);\n  height: var(--sc-input-clear-icon-size);\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Event,\n  type EventEmitter,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils/utils';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n  detail: T;\n  target: HTMLSearchcraftInputElement;\n}\n\n@Component({\n  tag: 'searchcraft-input',\n  styleUrl: 'searchcraft-input.module.scss',\n  shadow: false,\n})\nexport class SearchcraftInput {\n  @Prop() customStyles: string | Record<string, string> = {};\n  @Prop() error = false;\n  @Prop() inputCaptionClassName = '';\n  @Prop() inputCaptionValue = '';\n  @Prop() inputClassName = '';\n  @Prop() isRequesting = false;\n  @Prop() placeholderValue = 'Enter Search';\n  @Prop() query = '';\n  @Prop() flex = true;\n\n  @Event() clearInput: EventEmitter<void>;\n  @Event() inputChange: EventEmitter<string>;\n\n  @State() inputValue = this.query;\n\n  handleOnInput = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    this.inputValue = input.value;\n    this.inputChange.emit(input.value);\n  };\n\n  handleClearInput = () => {\n    this.inputValue = '';\n\n    if (this.clearInput) {\n      this.clearInput.emit();\n    }\n    if (this.inputValue === '') {\n      return;\n    }\n  };\n\n  render() {\n    const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n    const inputWrapperClassNames = classNames('searchcraft-input-wrapper', {\n      'searchcraft-input-wrapper-flex': this.flex,\n    });\n\n    const inputClassNames = classNames('searchcraft-input', {\n      'searchcraft-input-flex': this.flex,\n      error: this.error,\n    });\n\n    const isShowingClearButton = this.inputValue.length > 0;\n\n    return (\n      <div class={inputWrapperClassNames}>\n        <input\n          autoComplete='off'\n          class={inputClassNames}\n          onInput={(event) => {\n            this.handleOnInput(event);\n          }}\n          placeholder={this.placeholderValue}\n          style={validatedCustomStyles}\n          type='text'\n          value={this.inputValue}\n        />\n        <div class='searchcraft-input-search-icon-wrapper'>\n          <svg\n            class='searchcraft-input-search-icon'\n            viewBox='0 0 20 20'\n            fill='none'\n            xmlns='http://www.w3.org/2000/svg'\n            aria-labelledby='searchcraft-title'\n          >\n            <title id='searchcraft-title'>Searchcraft Search Icon Light</title>\n            <path\n              d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n              stroke='#404040'\n              stroke-width='1.5'\n              stroke-linecap='round'\n              stroke-linejoin='round'\n            />\n          </svg>\n        </div>\n        {isShowingClearButton && (\n          <button\n            type='button'\n            class='searchcraft-input-clear-button'\n            onClick={this.handleClearInput}\n          >\n            <svg\n              class='searchcraft-input-clear-icon'\n              viewBox='0 0 22 22'\n              fill='none'\n              xmlns='http://www.w3.org/2000/svg'\n              aria-labelledby='icon-title'\n            >\n              <title id='icon-title'>Searchcraft Clear Input Icon Light</title>\n              <path\n                d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n                stroke='black'\n                stroke-width='1.5'\n                stroke-linecap='round'\n                stroke-linejoin='round'\n              />\n            </svg>\n          </button>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"p-4fad3388.js","mappings":";;;;AAAA,MAAM,yBAAyB,GAAG,sqJAAsqJ,CAAC;AACzsJ,+BAAe,yBAAyB;;MCqB3B,gBAAgB;;;;;;QAgB3B,kBAAa,GAAG,CAAC,KAAY;YAC3B,MAAM,KAAK,GAAG,KAAK,CAAC,MAA0B,CAAC;YAC/C,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC;YAC9B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;SACpC,CAAC;QAEF,qBAAgB,GAAG;YACjB,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;YAErB,IAAI,IAAI,CAAC,UAAU,EAAE;gBACnB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;aACxB;YACD,IAAI,IAAI,CAAC,UAAU,KAAK,EAAE,EAAE;gBAC1B,OAAO;aACR;SACF,CAAC;4BA9BsD,EAAE;qBAC1C,KAAK;qCACW,EAAE;iCACN,EAAE;8BACL,EAAE;4BACJ,KAAK;gCACD,cAAc;qBACzB,EAAE;oBACH,IAAI;0BAKG,IAAI,CAAC,KAAK;;IAmBhC,MAAM;QACJ,MAAM,qBAAqB,GAAG,iBAAiB,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;QAEnE,MAAM,sBAAsB,GAAG,UAAU,CAAC,2BAA2B,EAAE;YACrE,gCAAgC,EAAE,IAAI,CAAC,IAAI;SAC5C,CAAC,CAAC;QAEH,MAAM,eAAe,GAAG,UAAU,CAAC,mBAAmB,EAAE;YACtD,wBAAwB,EAAE,IAAI,CAAC,IAAI;YACnC,KAAK,EAAE,IAAI,CAAC,KAAK;SAClB,CAAC,CAAC;QAEH,MAAM,oBAAoB,GAAG,IAAI,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;QAExD,QACE,4DAAK,KAAK,EAAE,sBAAsB,IAChC,8DACE,YAAY,EAAC,KAAK,EAClB,KAAK,EAAE,eAAe,EACtB,OAAO,EAAE,CAAC,KAAK;gBACb,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;aAC3B,EACD,WAAW,EAAE,IAAI,CAAC,gBAAgB,EAClC,KAAK,EAAE,qBAAqB,EAC5B,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,IAAI,CAAC,UAAU,GACtB,EACF,4DAAK,KAAK,EAAC,uCAAuC,IAChD,4DACE,KAAK,EAAC,+BAA+B,EACrC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,mBAAmB,IAEnC,8DAAO,EAAE,EAAC,mBAAmB,oCAAsC,EACnE,6DACE,CAAC,EAAC,mNAAmN,EACrN,MAAM,EAAC,SAAS,kBACH,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,CACF,EACL,oBAAoB,KACnB,+DACE,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,gCAAgC,EACtC,OAAO,EAAE,IAAI,CAAC,gBAAgB,IAE9B,4DACE,KAAK,EAAC,8BAA8B,EACpC,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,EACX,KAAK,EAAC,4BAA4B,qBAClB,YAAY,IAE5B,8DAAO,EAAE,EAAC,YAAY,yCAA2C,EACjE,6DACE,CAAC,EAAC,uIAAuI,EACzI,MAAM,EAAC,OAAO,kBACD,KAAK,oBACH,OAAO,qBACN,OAAO,GACvB,CACE,CACC,CACV,CACG,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/searchcraft-input/searchcraft-input.module.scss?tag=searchcraft-input","src/components/searchcraft-input/searchcraft-input.tsx"],"sourcesContent":["searchcraft-input {\n  display: flex;\n  flex: 1;\n}\n\n.searchcraft-input-wrapper {\n  display: inline-block;\n  position: relative;\n  cursor: text;\n}\n\n.searchcraft-input-wrapper-flex {\n  display: flex;\n  flex: 1;\n}\n\n.searchcraft-input-flex {\n  flex: 1;\n}\n\n.searchcraft-input {\n  @include body();\n  background-color: var(--sc-surface-neutral-secondary);\n  border: none;\n  border-radius: var(--sc-input-border-radius);\n  color: var(--sc-content-neutral-primary);\n  outline: none;\n  padding-left: var(--sc-input-padding-left);\n  padding-right: var(--sc-input-padding-right);\n  padding-top: 12px;\n  padding-bottom: 12px;\n\n  &::placeholder {\n    color: var(--sc-content-disabled);\n  }\n\n  &:focus {\n    outline: var(--sc-border-brand) solid 2px;\n  }\n\n  &:focus::placeholder {\n    opacity: 0;\n  }\n}\n\n.searchcraft-input.error {\n  color: var(--sc-content-danger);\n  outline: var(--sc-border-danger) solid 2px;\n\n  &:focus {\n    outline: var(--sc-border-danger) solid 2px;\n  }\n}\n\n.searchcraft-input-search-icon-wrapper {\n  align-items: center;\n  justify-content: center;\n  display: flex;\n  position: absolute;\n  pointer-events: none;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: var(--sc-input-padding-left);\n}\n\n.searchcraft-input-search-icon {\n  pointer-events: none;\n  width: var(--sc-input-search-icon-size);\n  height: var(--sc-input-search-icon-size);\n}\n\n.searchcraft-input-clear-button {\n  all: unset;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n  display: flex;\n  position: absolute;\n  border: none;\n  outline: none;\n  bottom: 0;\n  right: 0;\n  top: 0;\n  width: var(--sc-input-padding-right);\n}\n\n.searchcraft-input-clear-icon {\n  width: var(--sc-input-clear-icon-size);\n  height: var(--sc-input-clear-icon-size);\n}\n","import {\n  Component,\n  h,\n  Prop,\n  State,\n  Event,\n  type EventEmitter,\n} from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { parseCustomStyles } from '@utils/utils';\n\nexport interface ScInputCustomEvent<T> extends CustomEvent<T> {\n  detail: T;\n  target: HTMLSearchcraftInputElement;\n}\n\n@Component({\n  tag: 'searchcraft-input',\n  styleUrl: 'searchcraft-input.module.scss',\n  shadow: false,\n})\nexport class SearchcraftInput {\n  @Prop() customStyles: string | Record<string, string> = {};\n  @Prop() error = false;\n  @Prop() inputCaptionClassName = '';\n  @Prop() inputCaptionValue = '';\n  @Prop() inputClassName = '';\n  @Prop() isRequesting = false;\n  @Prop() placeholderValue = 'Enter Search';\n  @Prop() query = '';\n  @Prop() flex = true;\n\n  @Event() clearInput: EventEmitter<void>;\n  @Event() inputChange: EventEmitter<string>;\n\n  @State() inputValue = this.query;\n\n  handleOnInput = (event: Event) => {\n    const input = event.target as HTMLInputElement;\n    this.inputValue = input.value;\n    this.inputChange.emit(input.value);\n  };\n\n  handleClearInput = () => {\n    this.inputValue = '';\n\n    if (this.clearInput) {\n      this.clearInput.emit();\n    }\n    if (this.inputValue === '') {\n      return;\n    }\n  };\n\n  render() {\n    const validatedCustomStyles = parseCustomStyles(this.customStyles);\n\n    const inputWrapperClassNames = classNames('searchcraft-input-wrapper', {\n      'searchcraft-input-wrapper-flex': this.flex,\n    });\n\n    const inputClassNames = classNames('searchcraft-input', {\n      'searchcraft-input-flex': this.flex,\n      error: this.error,\n    });\n\n    const isShowingClearButton = this.inputValue.length > 0;\n\n    return (\n      <div class={inputWrapperClassNames}>\n        <input\n          autoComplete='off'\n          class={inputClassNames}\n          onInput={(event) => {\n            this.handleOnInput(event);\n          }}\n          placeholder={this.placeholderValue}\n          style={validatedCustomStyles}\n          type='text'\n          value={this.inputValue}\n        />\n        <div class='searchcraft-input-search-icon-wrapper'>\n          <svg\n            class='searchcraft-input-search-icon'\n            viewBox='0 0 20 20'\n            fill='none'\n            xmlns='http://www.w3.org/2000/svg'\n            aria-labelledby='searchcraft-title'\n          >\n            <title id='searchcraft-title'>Searchcraft Search Icon Light</title>\n            <path\n              d='M17.5 17.5L13.875 13.875M15.8333 9.16667C15.8333 12.8486 12.8486 15.8333 9.16667 15.8333C5.48477 15.8333 2.5 12.8486 2.5 9.16667C2.5 5.48477 5.48477 2.5 9.16667 2.5C12.8486 2.5 15.8333 5.48477 15.8333 9.16667Z'\n              stroke='#404040'\n              stroke-width='1.5'\n              stroke-linecap='round'\n              stroke-linejoin='round'\n            />\n          </svg>\n        </div>\n        {isShowingClearButton && (\n          <button\n            type='button'\n            class='searchcraft-input-clear-button'\n            onClick={this.handleClearInput}\n          >\n            <svg\n              class='searchcraft-input-clear-icon'\n              viewBox='0 0 22 22'\n              fill='none'\n              xmlns='http://www.w3.org/2000/svg'\n              aria-labelledby='icon-title'\n            >\n              <title id='icon-title'>Searchcraft Clear Input Icon Light</title>\n              <path\n                d='M14 8L8 14M8 8L14 14M21 11C21 16.5228 16.5228 21 11 21C5.47715 21 1 16.5228 1 11C1 5.47715 5.47715 1 11 1C16.5228 1 21 5.47715 21 11Z'\n                stroke='black'\n                stroke-width='1.5'\n                stroke-linecap='round'\n                stroke-linejoin='round'\n              />\n            </svg>\n          </button>\n        )}\n      </div>\n    );\n  }\n}\n"],"version":3}

package/dist/components/{p-0deddac7.js → p-9982883f.js}

@@ -108,18 +108,52 @@ function deepMergeWithSpread(obj1, obj2) {
     }
     return result;
 }
-function facetToObject(child) {
-    const transformed = {
-        count: child.count,
-        path: child.path,
+function facetToRecord(facet) {
+    const records = {};
+    const traverseAndAddToFragments = (facetChild) => {
+        var _a;
+        records[facetChild.path] = {
+            count: facetChild.count,
+            path: facetChild.path,
+        };
+        (_a = facetChild.children) === null || _a === void 0 ? void 0 : _a.forEach((child) => {
+            traverseAndAddToFragments(child);
+        });
+    };
+    traverseAndAddToFragments(facet);
+    return records;
+}
+function recordToObject(record) {
+    const root = {
+        count: 0,
+        path: '/',
         children: {},
     };
-    if (child.children) {
-        child.children.forEach((subChild) => {
-            transformed.children[subChild.path] = facetToObject(subChild);
+    Object.keys(record).forEach((key) => {
+        const fragment = record[key];
+        if (fragment.path === '/') {
+            return;
+        }
+        const pathParts = fragment.path.substring(1).split('/');
+        let currentRoot = root;
+        let currentPath = '';
+        pathParts.forEach((part, index) => {
+            const nextPath = `${currentPath}/${part}`;
+            if (!currentRoot.children[nextPath]) {
+                currentRoot.children[nextPath] = {
+                    count: 0,
+                    path: nextPath,
+                    children: {},
+                };
+            }
+            if (index === pathParts.length - 1) {
+                currentRoot.children[nextPath].count = fragment.count;
+            }
+            currentPath = nextPath;
+            currentRoot = currentRoot.children[nextPath];
         });
-    }
-    return transformed;
+    });
+    return root;
 }
 function objectToFacet(childObject) {
     const transformed = {
@@ -132,25 +166,48 @@ function objectToFacet(childObject) {
     }
     return transformed;
 }
-function mergeFacetRoots(fieldName, root1, root2) {
-    const array1 = root1[fieldName];
-    const array2 = root2[fieldName];
-    const rootFacetChild1 = {
+/**
+ * Filters records with the parent paths from record2 OUT of record1
+ */
+function filterRecordByParentPaths(record1, record2) {
+    // Extract all paths (keys) both records
+    const paths1 = Object.keys(record1);
+    const paths2 = Object.keys(record2);
+    // Find all parent paths in record2
+    const parentPaths = new Set(paths2
+        .filter((path) => path.split('/').length > 2) // Only consider paths with more than one level
+        .map((path) => path.substring(0, path.lastIndexOf('/'))));
+    // Filter out keys in record1 that share a parent path with any of the identified parent paths
+    const filteredRecord = Object.fromEntries(paths1
+        .filter((path) => !parentPaths.has(path.substring(0, path.lastIndexOf('/'))))
+        .map((path) => [path, record1[path]]));
+    return filteredRecord;
+}
+function mergeFacetRoots(fieldName, currentRoot, incomingRoot) {
+    const currentArray = currentRoot[fieldName];
+    const incomingArray = incomingRoot[fieldName];
+    const currentRootFacetChild = {
         count: 0,
         path: '/',
-        children: array1,
+        children: currentArray,
     };
-    const rootFacetChild2 = {
+    const incomingRootFacetChild = {
         count: 0,
         path: '/',
-        children: array2,
+        children: incomingArray,
     };
-    // Transform into objects
-    const facetObject1 = facetToObject(rootFacetChild1);
-    const facetObject2 = facetToObject(rootFacetChild2);
-    // Deep merge the objects
-    const mergedFacetObject = deepMergeWithSpread(facetObject1, facetObject2);
-    const mergedFacetChild = objectToFacet(mergedFacetObject);
+    // Flatten them into records
+    const currentRecord = facetToRecord(currentRootFacetChild);
+    const incomingRecord = facetToRecord(incomingRootFacetChild);
+    // Filter out the records from record1 (the current set of records)
+    // that share a parent path with record2 (the incoming records)
+    const filteredCurrentRecord = filterRecordByParentPaths(currentRecord, incomingRecord);
+    // Deep merge the records together
+    const mergedRecord = deepMergeWithSpread(filteredCurrentRecord, incomingRecord);
+    // Convert into a heirarchical object
+    const mergedObject = recordToObject(mergedRecord);
+    // Convert the heirarchical object back to the Facet child structure
+    const mergedFacetChild = objectToFacet(mergedObject);
     return {
         [fieldName]: mergedFacetChild.children,
     };
@@ -158,4 +215,4 @@ function mergeFacetRoots(fieldName, root1, root2) {
 
 export { getMillis as a, formatNumberWithCommas as f, getDocumentValueFromSearchResultMapping as g, mergeFacetRoots as m, parseCustomStyles as p, removeSubstringMatches as r, serializeStyles as s };
 
-//# sourceMappingURL=p-0deddac7.js.map
+//# sourceMappingURL=p-9982883f.js.map

package/dist/components/p-9982883f.js.map

@@ -0,0 +1 @@
+{"file":"p-9982883f.js","mappings":"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","names":[],"sources":["src/utils/utils.ts"],"sourcesContent":["import type {\n  FacetChild,\n  FacetChildObject,\n  FacetRoot,\n} from '@searchcraft/core';\nimport type { SearchResultMapping } from 'types';\n\nexport function parseCustomStyles(\n  styles: string | Record<string, string>,\n): Record<string, string> {\n  if (typeof styles === 'string') {\n    try {\n      return JSON.parse(styles);\n    } catch (error) {\n      console.error('Invalid customStyles format:', styles);\n      return {};\n    }\n  }\n  return styles || {};\n}\n\nexport function serializeStyles(\n  styles: Record<string, Record<string, string>>,\n): string {\n  try {\n    return JSON.stringify(styles);\n  } catch (error) {\n    console.error('Error serializing styles:', error);\n    return '{}';\n  }\n}\n\n/**\n * Given a timestamp value, returns a formatted time string for the time\n * since now.\n *\n * @param timestamp\n * @returns {string} Formatted string value\n */\nexport function getFormattedTimeFromNow(timestamp: string): string {\n  const now = new Date();\n  const inputTime = new Date(timestamp);\n  const diffInSeconds = Math.floor(\n    (now.getTime() - inputTime.getTime()) / 1000,\n  );\n\n  const minutes = Math.floor(diffInSeconds / 60);\n  const hours = Math.floor(minutes / 60);\n  const days = Math.floor(hours / 24);\n  const years = Math.floor(days / 365);\n\n  if (minutes < 60) {\n    return `${minutes}m ago`;\n  }\n  if (hours < 24) {\n    return `${hours}h ago`;\n  }\n  if (days < 365) {\n    return `${days}d ago`;\n  }\n  return `${years}y ago`;\n}\n\nexport function filterPaths(paths) {\n  return paths.filter((path) => {\n    const parts = path.split('/').filter(Boolean);\n\n    if (parts.length > 1) {\n      return true;\n    }\n\n    return !paths.some(\n      (otherPath) => otherPath.startsWith(`${path}/`) && otherPath !== path,\n    );\n  });\n}\n\nexport function formatNumberWithCommas(number) {\n  return number.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',');\n}\n\nexport function getMillis(unit: 'year' | 'month' | 'day' | 'hour'): number {\n  const millisInHour = 60 * 60 * 1000;\n  const millisInDay = 24 * millisInHour;\n  const millisInMonth = 30 * millisInDay;\n  const millisInYear = 365 * millisInDay;\n\n  switch (unit) {\n    case 'hour':\n      return millisInHour;\n    case 'day':\n      return millisInDay;\n    case 'month':\n      return millisInMonth;\n    case 'year':\n      return millisInYear;\n    default:\n      return 3600000;\n  }\n}\n/**\n * Given an array of facet paths, removes parent facet paths.\n */\nexport function removeSubstringMatches(arr: string[]): string[] {\n  return arr.filter(\n    (entry, index, array) =>\n      !array.some(\n        (otherEntry, otherIndex) =>\n          otherIndex !== index && otherEntry.includes(entry),\n      ),\n  );\n}\n\n/**\n * Given a document and a SearchResultMapping, return a mapped value from the document.\n *\n * @param document\n * @param {SearchResultMapping} mapping\n * @returns {string | undefined}\n */\nexport function getDocumentValueFromSearchResultMapping(\n  document: Record<string, unknown> | undefined,\n  mapping: SearchResultMapping | undefined,\n): string | undefined {\n  if (document && mapping) {\n    return mapping.fieldNames\n      .map((fieldNameDetails) => {\n        let valueFound = document[fieldNameDetails.fieldName];\n\n        if (valueFound && fieldNameDetails.dataType === 'date') {\n          valueFound = getFormattedTimeFromNow(valueFound as string);\n        }\n\n        return valueFound;\n      })\n      .filter((value) => !!value)\n      .join(mapping.delimeter || ' ');\n  }\n}\n\nfunction deepMergeWithSpread(obj1, obj2) {\n  const result = { ...obj1 };\n\n  for (const key in obj2) {\n    // biome-ignore lint/suspicious/noPrototypeBuiltins: <explanation>\n    if (obj2.hasOwnProperty(key)) {\n      if (obj2[key] instanceof Object && obj1[key] instanceof Object) {\n        result[key] = deepMergeWithSpread(obj1[key], obj2[key]);\n      } else {\n        result[key] = obj2[key];\n      }\n    }\n  }\n\n  return result;\n}\n\ntype FacetChildFragment = {\n  count: number;\n  path: string;\n};\n\nfunction facetToRecord(facet: FacetChild): Record<string, FacetChildFragment> {\n  const records: Record<string, FacetChildFragment> = {};\n\n  const traverseAndAddToFragments = (facetChild: FacetChild) => {\n    records[facetChild.path] = {\n      count: facetChild.count,\n      path: facetChild.path,\n    };\n\n    facetChild.children?.forEach((child) => {\n      traverseAndAddToFragments(child);\n    });\n  };\n\n  traverseAndAddToFragments(facet);\n\n  return records;\n}\n\nfunction recordToObject(\n  record: Record<string, FacetChildFragment>,\n): FacetChildObject {\n  const root: FacetChildObject = {\n    count: 0,\n    path: '/',\n    children: {},\n  };\n\n  Object.keys(record).forEach((key) => {\n    const fragment = record[key];\n    if (fragment.path === '/') {\n      return;\n    }\n    const pathParts = fragment.path.substring(1).split('/');\n    let currentRoot = root;\n    let currentPath = '';\n\n    pathParts.forEach((part, index) => {\n      const nextPath = `${currentPath}/${part}`;\n      if (!currentRoot.children[nextPath]) {\n        currentRoot.children[nextPath] = {\n          count: 0,\n          path: nextPath,\n          children: {},\n        };\n      }\n\n      if (index === pathParts.length - 1) {\n        currentRoot.children[nextPath].count = fragment.count;\n      }\n\n      currentPath = nextPath;\n      currentRoot = currentRoot.children[nextPath];\n    });\n  });\n\n  return root;\n}\n\nfunction objectToFacet(childObject: FacetChildObject): FacetChild {\n  const transformed: FacetChild = {\n    count: childObject.count,\n    path: childObject.path,\n    children: [],\n  };\n\n  if (Object.keys(childObject.children).length > 0) {\n    transformed.children = Object.values(childObject.children).map(\n      (subChildObject) => objectToFacet(subChildObject),\n    );\n  }\n\n  return transformed;\n}\n\n/**\n * Filters records with the parent paths from record2 OUT of record1\n */\nfunction filterRecordByParentPaths(\n  record1: Record<string, FacetChild>,\n  record2: Record<string, FacetChild>,\n): Record<string, FacetChild> {\n  // Extract all paths (keys) both records\n  const paths1 = Object.keys(record1);\n  const paths2 = Object.keys(record2);\n\n  // Find all parent paths in record2\n  const parentPaths = new Set(\n    paths2\n      .filter((path) => path.split('/').length > 2) // Only consider paths with more than one level\n      .map((path) => path.substring(0, path.lastIndexOf('/'))),\n  );\n\n  // Filter out keys in record1 that share a parent path with any of the identified parent paths\n  const filteredRecord = Object.fromEntries(\n    paths1\n      .filter(\n        (path) => !parentPaths.has(path.substring(0, path.lastIndexOf('/'))),\n      )\n      .map((path) => [path, record1[path]]), // Reconstruct the key-value pairs\n  );\n\n  return filteredRecord;\n}\n\nexport function mergeFacetRoots(\n  fieldName: string,\n  currentRoot: FacetRoot,\n  incomingRoot: FacetRoot,\n): FacetRoot {\n  const currentArray = currentRoot[fieldName];\n  const incomingArray = incomingRoot[fieldName];\n\n  const currentRootFacetChild: FacetChild = {\n    count: 0,\n    path: '/',\n    children: currentArray,\n  };\n\n  const incomingRootFacetChild: FacetChild = {\n    count: 0,\n    path: '/',\n    children: incomingArray,\n  };\n\n  // Flatten them into records\n  const currentRecord: Record<string, FacetChildFragment> = facetToRecord(\n    currentRootFacetChild,\n  );\n\n  const incomingRecord: Record<string, FacetChildFragment> = facetToRecord(\n    incomingRootFacetChild,\n  );\n\n  // Filter out the records from record1 (the current set of records)\n  // that share a parent path with record2 (the incoming records)\n  const filteredCurrentRecord = filterRecordByParentPaths(\n    currentRecord,\n    incomingRecord,\n  );\n\n  // Deep merge the records together\n  const mergedRecord: Record<string, FacetChildFragment> = deepMergeWithSpread(\n    filteredCurrentRecord,\n    incomingRecord,\n  );\n\n  // Convert into a heirarchical object\n  const mergedObject: FacetChildObject = recordToObject(mergedRecord);\n\n  // Convert the heirarchical object back to the Facet child structure\n  const mergedFacetChild = objectToFacet(mergedObject);\n\n  return {\n    [fieldName]: mergedFacetChild.children,\n  };\n}\n"],"version":3}

package/dist/components/{p-ebf021b5.js → p-9b9df0ca.js}

@@ -1,4 +1,5 @@
 import { p as proxyCustomElement, H, c as createEvent, h } from './p-5639be85.js';
+import { u as useSearchcraftStore } from './p-3c181808.js';
 import { c as classNames } from './p-5cdc6210.js';
 
 const searchcraftToggleButtonModuleCss = ":root{--sc-spinner-size:20px;--sc-input-border-radius:8px;--sc-input-search-icon-size:20px;--sc-input-clear-icon-size:20px;--sc-input-padding-left:44px;--sc-input-padding-right:44px;--sc-image-border-radius:8px}: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}.searchcraft-toggle-button-container{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.searchcraft-toggle-button-label{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-primary)}.searchcraft-toggle-button-sub-label{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-neutral-secondary)}.searchcraft-toggle-button-background{transition:background-color 0.2s;background:var(--sc-surface-disabled);border:none;border-radius:16px;cursor:pointer;height:26px;position:relative;width:44px;flex-shrink:0}.searchcraft-toggle-button-background.active{background:var(--sc-surface-brand-primary);box-shadow:0px 0px 0px 1px rgba(0, 0, 0, 0.05)}.searchcraft-toggle-button-handle{background:var(--sc-surface-neutral-light);border-radius:50%;height:18px;left:4px;position:absolute;top:calc(50% - 9px);transition:transform 0.3s ease;width:18px}.searchcraft-toggle-button-handle.active{transform:translateX(16px)}";
@@ -16,11 +17,26 @@ const SearchcraftToggleButton = /*@__PURE__*/ proxyCustomElement(class Searchcra
         this.label = 'Toggle';
         this.subLabel = undefined;
         this.isActive = false;
+        this.unsubscribe = undefined;
+        this.lastQuery = undefined;
+    }
+    connectedCallback() {
+        /** When the query changes, sets toggle button state back to inactive. */
+        this.unsubscribe = useSearchcraftStore.subscribe((state) => {
+            if (state.query !== this.lastQuery) {
+                this.isActive = false;
+                this.lastQuery = state.query;
+            }
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.unsubscribe) === null || _a === void 0 ? void 0 : _a.call(this);
     }
     render() {
-        return (h("div", { key: 'd22c50dcf65d66208bd0ee78c88f452ba94c96e1', class: 'searchcraft-toggle-button-container' }, h("div", { key: 'c7309a315b979c1bc68b140f4e3d250fdb208e37' }, h("p", { key: '2a22fc2b52f73a5fe79512c4e3ed105110a514cd', class: 'searchcraft-toggle-button-label' }, this.label), this.subLabel && (h("p", { key: '8c1670c628751c19576ff9f8cf4bad71b974fb4f', class: 'searchcraft-toggle-button-sub-label' }, this.subLabel))), h("button", { key: '10600dd271917d074bf4d1e8dea473b583c79031', class: classNames('searchcraft-toggle-button-background', {
+        return (h("div", { key: 'e6d23071452a4a01b95a45748860df7737735c83', class: 'searchcraft-toggle-button-container' }, h("div", { key: '3d87cd576368065c7fe8d3b50daef9c67c04253e' }, h("p", { key: '06d1f349c9132e6a9762d777e3f90c635852e4a1', class: 'searchcraft-toggle-button-label' }, this.label), this.subLabel && (h("p", { key: '9bf361bdb33977a089d9364822c9c11b846b59a5', class: 'searchcraft-toggle-button-sub-label' }, this.subLabel))), h("button", { key: 'bb8f27eecb9fe8d5dde237f81d04c3e79a7ec87b', class: classNames('searchcraft-toggle-button-background', {
                 active: this.isActive,
-            }), onClick: this.handleToggle, type: 'button' }, h("div", { key: '3cd18a77345001252c700d6b1ca3f34b9e7e849d', class: classNames('searchcraft-toggle-button-handle', {
+            }), onClick: this.handleToggle, type: 'button' }, h("div", { key: 'd4be7cc5fbadfc28e97c4dfada15236b7be2fda0', class: classNames('searchcraft-toggle-button-handle', {
                 active: this.isActive,
             }) }))));
     }
@@ -28,7 +44,9 @@ const SearchcraftToggleButton = /*@__PURE__*/ proxyCustomElement(class Searchcra
 }, [0, "searchcraft-toggle-button", {
         "label": [1],
         "subLabel": [1, "sub-label"],
-        "isActive": [32]
+        "isActive": [32],
+        "unsubscribe": [32],
+        "lastQuery": [32]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
@@ -46,4 +64,4 @@ function defineCustomElement() {
 
 export { SearchcraftToggleButton as S, defineCustomElement as d };
 
-//# sourceMappingURL=p-ebf021b5.js.map
+//# sourceMappingURL=p-9b9df0ca.js.map

package/dist/components/p-9b9df0ca.js.map

@@ -0,0 +1 @@
+{"file":"p-9b9df0ca.js","mappings":";;;;AAAA,MAAM,gCAAgC,GAAG,oxIAAoxI,CAAC;AAC9zI,sCAAe,gCAAgC;;MCclC,uBAAuB;;;;;QAe1B,iBAAY,GAAG;YACrB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;YAC/B,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACxC,CAAC;qBAZc,QAAQ;;wBAKJ,KAAK;;;;IASzB,iBAAiB;;QAEf,IAAI,CAAC,WAAW,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC,KAAK;YACrD,IAAI,KAAK,CAAC,KAAK,KAAK,IAAI,CAAC,SAAS,EAAE;gBAClC,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;gBACtB,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,KAAK,CAAC;aAC9B;SACF,CAAC,CAAC;KACJ;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,WAAW,oDAAI,CAAC;KACtB;IAED,MAAM;QACJ,QACE,4DAAK,KAAK,EAAC,qCAAqC,IAC9C,8DACE,0DAAG,KAAK,EAAC,iCAAiC,IAAE,IAAI,CAAC,KAAK,CAAK,EAC1D,IAAI,CAAC,QAAQ,KACZ,0DAAG,KAAK,EAAC,qCAAqC,IAAE,IAAI,CAAC,QAAQ,CAAK,CACnE,CACG,EACN,+DACE,KAAK,EAAE,UAAU,CAAC,sCAAsC,EAAE;gBACxD,MAAM,EAAE,IAAI,CAAC,QAAQ;aACtB,CAAC,EACF,OAAO,EAAE,IAAI,CAAC,YAAY,EAC1B,IAAI,EAAC,QAAQ,IAEb,4DACE,KAAK,EAAE,UAAU,CAAC,kCAAkC,EAAE;gBACpD,MAAM,EAAE,IAAI,CAAC,QAAQ;aACtB,CAAC,GACF,CACK,CACL,EACN;KACH;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/searchcraft-toggle-button/searchcraft-toggle-button.module.scss?tag=searchcraft-toggle-button","src/components/searchcraft-toggle-button/searchcraft-toggle-button.tsx"],"sourcesContent":[".searchcraft-toggle-button-container {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  gap: 10px;\n}\n\n.searchcraft-toggle-button-label {\n  @include body();\n  margin: 0;\n  color: var(--sc-content-neutral-primary);\n}\n\n.searchcraft-toggle-button-sub-label {\n  @include body-small();\n  margin: 0;\n  color: var(--sc-content-neutral-secondary);\n}\n\n.searchcraft-toggle-button-background {\n  transition: background-color 0.2s;\n  background: var(--sc-surface-disabled);\n  border: none;\n  border-radius: 16px;\n  cursor: pointer;\n  height: 26px;\n  position: relative;\n  width: 44px;\n  flex-shrink: 0;\n}\n\n.searchcraft-toggle-button-background.active {\n  background: var(--sc-surface-brand-primary);\n  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.05);\n}\n\n.searchcraft-toggle-button-handle {\n  background: var(--sc-surface-neutral-light);\n  border-radius: 50%;\n  height: 18px;\n  left: 4px;\n  position: absolute;\n  top: calc(50% - 18px/2);\n  transition: transform 0.3s ease;\n  width: 18px;\n}\n\n.searchcraft-toggle-button-handle.active {\n  transform: translateX(16px);\n}\n","import { useSearchcraftStore } from '@provider/store';\nimport {\n  Component,\n  Event,\n  h,\n  Prop,\n  State,\n  type EventEmitter,\n} from '@stencil/core';\nimport classNames from 'classnames';\n@Component({\n  tag: 'searchcraft-toggle-button',\n  styleUrl: 'searchcraft-toggle-button.module.scss',\n  shadow: false,\n})\nexport class SearchcraftToggleButton {\n  /**\n   * Type of the toggle - determines what it controls\n   * 'mode': toggles between 'fuzzy' and 'normal'\n   * 'sort': toggles between 'asc' and 'desc'\n   */\n  @Prop() label = 'Toggle';\n  @Prop() subLabel: string | undefined;\n\n  @Event() toggleUpdated: EventEmitter<boolean>;\n\n  @State() isActive = false;\n  @State() unsubscribe: (() => void) | undefined;\n  @State() lastQuery: string | undefined;\n\n  private handleToggle = async () => {\n    this.isActive = !this.isActive;\n    this.toggleUpdated.emit(this.isActive);\n  };\n\n  connectedCallback() {\n    /** When the query changes, sets toggle button state back to inactive. */\n    this.unsubscribe = useSearchcraftStore.subscribe((state) => {\n      if (state.query !== this.lastQuery) {\n        this.isActive = false;\n        this.lastQuery = state.query;\n      }\n    });\n  }\n\n  disconnectedCallback() {\n    this.unsubscribe?.();\n  }\n\n  render() {\n    return (\n      <div class='searchcraft-toggle-button-container'>\n        <div>\n          <p class='searchcraft-toggle-button-label'>{this.label}</p>\n          {this.subLabel && (\n            <p class='searchcraft-toggle-button-sub-label'>{this.subLabel}</p>\n          )}\n        </div>\n        <button\n          class={classNames('searchcraft-toggle-button-background', {\n            active: this.isActive,\n          })}\n          onClick={this.handleToggle}\n          type='button'\n        >\n          <div\n            class={classNames('searchcraft-toggle-button-handle', {\n              active: this.isActive,\n            })}\n          />\n        </button>\n      </div>\n    );\n  }\n}\n"],"version":3}