@searchstax-inc/searchstudio-ux-angular 1.2.29 → 1.2.44

package/fesm2022/searchstax-inc-searchstudio-ux-angular.mjs

@@ -24,6 +24,7 @@ class SearchstaxWrapper {
     constructor(storeServiceService) {
         this.storeServiceService = storeServiceService;
         this.language = 'en';
+        this.model = '';
         this.searchURL = '';
         this.suggesterURL = '';
         this.trackApiKey = '';
@@ -45,6 +46,7 @@ class SearchstaxWrapper {
         }
         this.storeServiceService.searchstax.initialize({
             language: this.language,
+            model: this.model,
             searchURL: this.searchURL,
             suggesterURL: this.suggesterURL,
             trackApiKey: this.trackApiKey,
@@ -61,7 +63,7 @@ class SearchstaxWrapper {
         this.initialized.emit(this.storeServiceService.searchstax);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstaxWrapper, deps: [{ token: StoreServiceService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchstaxWrapper, selector: "app-searchstax-wrapper", inputs: { language: "language", searchURL: "searchURL", suggesterURL: "suggesterURL", trackApiKey: "trackApiKey", searchAuth: "searchAuth", sessionId: "sessionId", analyticsBaseUrl: "analyticsBaseUrl", analyticsSrc: "analyticsSrc", questionURL: "questionURL", authType: "authType", autoCorrect: "autoCorrect", router: "router", beforeSearch: "beforeSearch", afterSearch: "afterSearch" }, outputs: { initialized: "initialized" }, ngImport: i0, template: `
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchstaxWrapper, selector: "app-searchstax-wrapper", inputs: { language: "language", model: "model", searchURL: "searchURL", suggesterURL: "suggesterURL", trackApiKey: "trackApiKey", searchAuth: "searchAuth", sessionId: "sessionId", analyticsBaseUrl: "analyticsBaseUrl", analyticsSrc: "analyticsSrc", questionURL: "questionURL", authType: "authType", autoCorrect: "autoCorrect", router: "router", beforeSearch: "beforeSearch", afterSearch: "afterSearch" }, outputs: { initialized: "initialized" }, ngImport: i0, template: `
   <div>
     <ng-content></ng-content>
   </div>
@@ -76,6 +78,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
   ` }]
         }], ctorParameters: () => [{ type: StoreServiceService }], propDecorators: { language: [{
                 type: Input
+            }], model: [{
+                type: Input
             }], searchURL: [{
                 type: Input
             }], suggesterURL: [{
@@ -106,42 +110,157 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Output
             }] } });
 
+class SearchstaxSearchLocationWidget {
+    constructor(storeServiceService) {
+        this.storeServiceService = storeServiceService;
+        this.locationData = null;
+        this.inputValue = "";
+        this.selectValue = "";
+        this.locationAdded = false;
+        this.locationError = false;
+        this.rand = Math.random();
+        this.context = this;
+    }
+    ngOnInit() {
+        if (this.storeServiceService.searchstax) {
+            this.attachObservables();
+            setTimeout(() => {
+                this.addWidget();
+            }, 100);
+        }
+        else {
+            throw Error("Searchstax instance needs to be passed via props");
+        }
+    }
+    locationBlur(context) {
+        context.storeServiceService.searchstax.searchLocationWidget?.triggerGeocoder(context.inputValue);
+    }
+    radiusChange(e, context) {
+        const target = e.target;
+        context.selectValue = target.value;
+        context.storeServiceService.searchstax.searchLocationWidget?.setRadiusValue(context.selectValue);
+    }
+    inputChange(e, context) {
+        const target = e.target;
+        context.inputValue = target.value;
+    }
+    getCurrentLocation(context) {
+        context.storeServiceService.searchstax.searchLocationWidget?.getCurrentLocation();
+    }
+    addWidget() {
+        if (!this.locationAdded &&
+            this.storeServiceService.searchstax.routerHelper) {
+            this.locationAdded = true;
+            this.storeServiceService.searchstax.addSearchLocationWidget("searchstax-location-container" + this.rand, {
+                hooks: {
+                    locationDecode: this.locationDecode,
+                },
+            });
+        }
+    }
+    attachObservables() {
+        this.storeServiceService.searchstax.dataLayer.$locationWidgetTemplateData.subscribe((sortingData) => {
+            this.locationData = sortingData;
+        });
+        this.storeServiceService.searchstax.dataLayer.$searchObject.subscribe((result) => {
+            this.inputValue = result.location.address ?? "";
+            this.selectValue = result.location.radius || "";
+        });
+        this.storeServiceService.searchstax.dataLayer.$locationError.subscribe((locationError) => {
+            this.locationError = locationError;
+        });
+        this.storeServiceService.searchstax.dataLayer.$searchLocationChange.subscribe((location) => {
+            this.inputValue = location;
+        });
+        this.storeServiceService.searchstax.dataLayer.$searchRadiusChange.subscribe((radius) => {
+            this.selectValue = radius;
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstaxSearchLocationWidget, deps: [{ token: StoreServiceService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchstaxSearchLocationWidget, selector: "app-searchstax-search-location", inputs: { templateOverride: "templateOverride", locationDecode: "locationDecode" }, ngImport: i0, template: "<div\n  [id]=\"'searchstax-location-container' + rand\"\n  class=\"searchstax-location-container\"\n>\n  <div\n    class=\"searchstax-location-input-container\"\n    data-test-id=\"searchstax-location-input-container\"\n    *ngIf=\"locationData && !templateOverride\"\n  >\n    <div class=\"searchstax-location-input-wrapper\">\n      <span class=\"searchstax-location-input-label\">NEAR</span>\n      <div class=\"searchstax-location-input-wrapper-inner\">\n        <input\n          type=\"text\"\n          id=\"searchstax-location-input\"\n          class=\"searchstax-location-input\"\n          [ngClass]=\"{\n            'searchstax-input-location-error': locationError\n          }\"\n          placeholder=\"Zip, Postal Code or City...\"\n          aria-label=\"Search Location Input\"\n          data-test-id=\"searchstax-location-input\"\n          [(ngModel)]=\"inputValue\"\n          (blur)=\"locationBlur(context)\"\n        />\n        <button\n          (click)=\"getCurrentLocation(context)\"\n          class=\"searchstax-get-current-location-button\"\n        >\n          Use my current location\n        </button>\n      </div>\n      <span\n        *ngIf=\"locationData.shouldShowLocationDistanceDropdown\"\n        class=\"searchstax-location-input-label\"\n        >WITHIN</span\n      >\n      <select\n        *ngIf=\"locationData.shouldShowLocationDistanceDropdown\"\n        id=\"searchstax-location-radius-select\"\n        class=\"searchstax-location-radius-select\"\n        aria-label=\"Search Location Radius Select\"\n        data-test-id=\"searchstax-location-radius-select\"\n        (change)=\"radiusChange($event, context)\"\n        [(ngModel)]=\"selectValue\"\n      >\n        <option\n          *ngFor=\"let value of locationData.locationSearchDistanceValues\"\n          [value]=\"value.value\"\n        >\n          {{ value.label }}\n        </option>\n      </select>\n    </div>\n  </div>\n\n  <div *ngIf=\"locationData && templateOverride\">\n    <ng-container\n      *ngTemplateOutlet=\"templateOverride; context: context\"\n    ></ng-container>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstaxSearchLocationWidget, decorators: [{
+            type: Component,
+            args: [{ selector: "app-searchstax-search-location", template: "<div\n  [id]=\"'searchstax-location-container' + rand\"\n  class=\"searchstax-location-container\"\n>\n  <div\n    class=\"searchstax-location-input-container\"\n    data-test-id=\"searchstax-location-input-container\"\n    *ngIf=\"locationData && !templateOverride\"\n  >\n    <div class=\"searchstax-location-input-wrapper\">\n      <span class=\"searchstax-location-input-label\">NEAR</span>\n      <div class=\"searchstax-location-input-wrapper-inner\">\n        <input\n          type=\"text\"\n          id=\"searchstax-location-input\"\n          class=\"searchstax-location-input\"\n          [ngClass]=\"{\n            'searchstax-input-location-error': locationError\n          }\"\n          placeholder=\"Zip, Postal Code or City...\"\n          aria-label=\"Search Location Input\"\n          data-test-id=\"searchstax-location-input\"\n          [(ngModel)]=\"inputValue\"\n          (blur)=\"locationBlur(context)\"\n        />\n        <button\n          (click)=\"getCurrentLocation(context)\"\n          class=\"searchstax-get-current-location-button\"\n        >\n          Use my current location\n        </button>\n      </div>\n      <span\n        *ngIf=\"locationData.shouldShowLocationDistanceDropdown\"\n        class=\"searchstax-location-input-label\"\n        >WITHIN</span\n      >\n      <select\n        *ngIf=\"locationData.shouldShowLocationDistanceDropdown\"\n        id=\"searchstax-location-radius-select\"\n        class=\"searchstax-location-radius-select\"\n        aria-label=\"Search Location Radius Select\"\n        data-test-id=\"searchstax-location-radius-select\"\n        (change)=\"radiusChange($event, context)\"\n        [(ngModel)]=\"selectValue\"\n      >\n        <option\n          *ngFor=\"let value of locationData.locationSearchDistanceValues\"\n          [value]=\"value.value\"\n        >\n          {{ value.label }}\n        </option>\n      </select>\n    </div>\n  </div>\n\n  <div *ngIf=\"locationData && templateOverride\">\n    <ng-container\n      *ngTemplateOutlet=\"templateOverride; context: context\"\n    ></ng-container>\n  </div>\n</div>\n" }]
+        }], ctorParameters: () => [{ type: StoreServiceService }], propDecorators: { templateOverride: [{
+                type: Input
+            }], locationDecode: [{
+                type: Input
+            }] } });
+
 class SearchstaxInputWidget {
     constructor(storeServiceService) {
         this.storeServiceService = storeServiceService;
-        this.searchInputId = '';
+        this.searchInputId = "";
         this.hooks = {};
         this.suggestions = [];
         this.context = this;
+        this.templateData = null;
     }
     ngOnInit() {
-        console.log('this.templateOverride', this.templateOverride);
         if (this.storeServiceService.searchstax) {
             this.attachObservables();
             // const hooks: { [key: string]: (prop: any) => any } = {}
             if (this.afterAutosuggest) {
-                this.hooks['afterAutosuggest'] = this.afterAutosuggest;
+                this.hooks["afterAutosuggest"] = this.afterAutosuggest;
             }
             if (this.beforeAutosuggest) {
-                this.hooks['beforeAutosuggest'] = this.beforeAutosuggest;
+                this.hooks["beforeAutosuggest"] = this.beforeAutosuggest;
             }
             setTimeout(() => {
-                this.storeServiceService.searchstax.addSearchInputWidget('searchstax-input-container', {
+                this.storeServiceService.searchstax.addSearchInputWidget("searchstax-input-container", {
                     suggestAfterMinChars: this.suggestAfterMinChars,
                     hooks: this.hooks,
                     templates: {
                         mainTemplate: {
                             template: ``,
-                            searchInputId: this.searchInputId ?? 'searchstax-search-input'
-                        }
-                    }
+                            searchInputId: this.searchInputId ?? "searchstax-search-input",
+                        },
+                    },
                 });
-            }, 0);
+                this.storeServiceService.searchstax.dataLayer.setInputTemplateRendered(true);
+            }, 100);
         }
         else {
-            throw Error('Searchstax instance needs to be passed via props');
+            throw Error("Searchstax instance needs to be passed via props");
         }
     }
+    locationDecode(term) {
+        return new Promise((resolve) => {
+            // make a request to google geocoding API to retrieve lat, lon and address
+            const geocodingAPIKey = "AIzaSyDK5wQQaz7kmP60_DViAto5rTQ301eVBFs";
+            const geocodingURL = `https://maps.googleapis.com/maps/api/geocode/json?address=${encodeURIComponent(term)}&key=${geocodingAPIKey}`;
+            fetch(geocodingURL)
+                .then((response) => response.json())
+                .then((data) => {
+                if (data.status === "OK" && data.results.length > 0) {
+                    const result = data.results[0];
+                    const location = {
+                        lat: result.geometry.location.lat,
+                        lon: result.geometry.location.lng,
+                        address: result.formatted_address,
+                    };
+                    resolve(location);
+                }
+                else {
+                    resolve({
+                        address: undefined,
+                        lat: undefined,
+                        lon: undefined,
+                        error: true,
+                    });
+                }
+            })
+                .catch(() => {
+                resolve({
+                    address: undefined,
+                    lat: undefined,
+                    lon: undefined,
+                    error: true,
+                });
+            });
+        });
+    }
     onMouseLeave(context) {
         context.storeServiceService.searchstax.searchInputWidget?.resetAutosuggestSelection();
         context.storeServiceService.searchstax.searchInputWidget?.markActiveAutosuggestItem();
@@ -157,13 +276,16 @@ class SearchstaxInputWidget {
         this.storeServiceService.searchstax.dataLayer.$autosuggestResults.subscribe((suggestions) => {
             this.suggestions = suggestions?.suggestions ?? [];
         });
+        this.storeServiceService.searchstax.dataLayer.$inputWidgetTemplateData.subscribe((data) => {
+            this.templateData = data;
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstaxInputWidget, deps: [{ token: StoreServiceService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchstaxInputWidget, selector: "app-searchstax-input", inputs: { afterAutosuggest: "afterAutosuggest", beforeAutosuggest: "beforeAutosuggest", searchInputId: "searchInputId", suggestAfterMinChars: "suggestAfterMinChars", templateOverride: "templateOverride" }, ngImport: i0, template: "<div id=\"searchstax-input-container\">\n  <div class=\"searchstax-search-input-container\">\n    <div *ngIf=\"!templateOverride\" class=\"searchstax-search-input-wrapper\">\n      <input\n        type=\"text\"\n        id=\"searchstax-search-input\"\n        class=\"searchstax-search-input\"\n        placeholder=\"SEARCH FOR...\"\n        aria-label=\"search\"\n      />\n      <div\n        class=\"searchstax-autosuggest-container\"\n        [ngClass]=\"{ hidden: suggestions.length === 0 }\"\n        (mouseleave)=\"(onMouseLeave)\"\n      >\n        <div\n          class=\"searchstax-autosuggest-item\"\n          *ngFor=\"let suggestion of suggestions\"\n        >\n          <div\n            class=\"searchstax-autosuggest-item-term-container\"\n            [innerHtml]=\"suggestion.term\"\n            (mouseover)=\"onMouseOver(suggestion, context)\"\n            tabindex=\"0\"\n            (click)=\"onMouseClick($event, context)\"\n          ></div>\n        </div>\n      </div>\n      <button\n        class=\"searchstax-spinner-icon\"\n        id=\"searchstax-search-input-action-button\"\n        aria-label=\"search\"\n      ></button>\n    </div>\n    <div *ngIf=\"templateOverride\">\n      <ng-container\n        *ngTemplateOutlet=\"templateOverride; context: context\"\n      ></ng-container>\n    </div>\n\n    <!-- <slot\n      name=\"input\"\n      :suggestions=\"suggestions\"\n      :onMouseClick=\"onMouseClick\"\n      :onMouseOver=\"onMouseOver\"\n      :onMouseLeave=\"onMouseLeave\"\n    ></slot> -->\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchstaxInputWidget, selector: "app-searchstax-input", inputs: { afterAutosuggest: "afterAutosuggest", beforeAutosuggest: "beforeAutosuggest", searchInputId: "searchInputId", suggestAfterMinChars: "suggestAfterMinChars", templateOverride: "templateOverride" }, ngImport: i0, template: "<div id=\"searchstax-input-container\">\n  <div class=\"searchstax-search-input-container searchstax-search-input-container-new\" [class]=\"{ 'searchstax-alternative-render': !!templateData?.locationEnabled }\">\n    <ng-container *ngIf=\"!templateOverride\">\n      <div class=\"searchstax-search-input-wrapper\">\n      <input\n        type=\"text\"\n        id=\"searchstax-search-input\"\n        class=\"searchstax-search-input\"\n        placeholder=\"SEARCH FOR...\"\n        aria-label=\"search\"\n      />\n      <div\n        class=\"searchstax-autosuggest-container\"\n        [ngClass]=\"{ hidden: suggestions.length === 0 }\"\n        (mouseleave)=\"(onMouseLeave)\"\n      >\n        <div\n          class=\"searchstax-autosuggest-item\"\n          *ngFor=\"let suggestion of suggestions\"\n        >\n          <div\n            class=\"searchstax-autosuggest-item-term-container\"\n            [innerHtml]=\"suggestion.term\"\n            (mouseover)=\"onMouseOver(suggestion, context)\"\n            tabindex=\"0\"\n            (click)=\"onMouseClick($event, context)\"\n          ></div>\n        </div>\n      </div>\n      </div>\n      <app-searchstax-search-location [locationDecode]=\"locationDecode\"></app-searchstax-search-location>\n      <button\n        class=\"searchstax-spinner-icon\"\n        id=\"searchstax-search-input-action-button\"\n        aria-label=\"search\"\n      ></button>\n    </ng-container>\n    <ng-container *ngIf=\"templateOverride\">\n      <ng-container\n        *ngTemplateOutlet=\"templateOverride; context: context\"\n      ></ng-container>\n    </ng-container>\n\n    <!-- <slot\n      name=\"input\"\n      :suggestions=\"suggestions\"\n      :onMouseClick=\"onMouseClick\"\n      :onMouseOver=\"onMouseOver\"\n      :onMouseLeave=\"onMouseLeave\"\n    ></slot> -->\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchstaxSearchLocationWidget, selector: "app-searchstax-search-location", inputs: ["templateOverride", "locationDecode"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstaxInputWidget, decorators: [{
             type: Component,
-            args: [{ selector: 'app-searchstax-input', template: "<div id=\"searchstax-input-container\">\n  <div class=\"searchstax-search-input-container\">\n    <div *ngIf=\"!templateOverride\" class=\"searchstax-search-input-wrapper\">\n      <input\n        type=\"text\"\n        id=\"searchstax-search-input\"\n        class=\"searchstax-search-input\"\n        placeholder=\"SEARCH FOR...\"\n        aria-label=\"search\"\n      />\n      <div\n        class=\"searchstax-autosuggest-container\"\n        [ngClass]=\"{ hidden: suggestions.length === 0 }\"\n        (mouseleave)=\"(onMouseLeave)\"\n      >\n        <div\n          class=\"searchstax-autosuggest-item\"\n          *ngFor=\"let suggestion of suggestions\"\n        >\n          <div\n            class=\"searchstax-autosuggest-item-term-container\"\n            [innerHtml]=\"suggestion.term\"\n            (mouseover)=\"onMouseOver(suggestion, context)\"\n            tabindex=\"0\"\n            (click)=\"onMouseClick($event, context)\"\n          ></div>\n        </div>\n      </div>\n      <button\n        class=\"searchstax-spinner-icon\"\n        id=\"searchstax-search-input-action-button\"\n        aria-label=\"search\"\n      ></button>\n    </div>\n    <div *ngIf=\"templateOverride\">\n      <ng-container\n        *ngTemplateOutlet=\"templateOverride; context: context\"\n      ></ng-container>\n    </div>\n\n    <!-- <slot\n      name=\"input\"\n      :suggestions=\"suggestions\"\n      :onMouseClick=\"onMouseClick\"\n      :onMouseOver=\"onMouseOver\"\n      :onMouseLeave=\"onMouseLeave\"\n    ></slot> -->\n  </div>\n</div>\n" }]
+            args: [{ selector: "app-searchstax-input", template: "<div id=\"searchstax-input-container\">\n  <div class=\"searchstax-search-input-container searchstax-search-input-container-new\" [class]=\"{ 'searchstax-alternative-render': !!templateData?.locationEnabled }\">\n    <ng-container *ngIf=\"!templateOverride\">\n      <div class=\"searchstax-search-input-wrapper\">\n      <input\n        type=\"text\"\n        id=\"searchstax-search-input\"\n        class=\"searchstax-search-input\"\n        placeholder=\"SEARCH FOR...\"\n        aria-label=\"search\"\n      />\n      <div\n        class=\"searchstax-autosuggest-container\"\n        [ngClass]=\"{ hidden: suggestions.length === 0 }\"\n        (mouseleave)=\"(onMouseLeave)\"\n      >\n        <div\n          class=\"searchstax-autosuggest-item\"\n          *ngFor=\"let suggestion of suggestions\"\n        >\n          <div\n            class=\"searchstax-autosuggest-item-term-container\"\n            [innerHtml]=\"suggestion.term\"\n            (mouseover)=\"onMouseOver(suggestion, context)\"\n            tabindex=\"0\"\n            (click)=\"onMouseClick($event, context)\"\n          ></div>\n        </div>\n      </div>\n      </div>\n      <app-searchstax-search-location [locationDecode]=\"locationDecode\"></app-searchstax-search-location>\n      <button\n        class=\"searchstax-spinner-icon\"\n        id=\"searchstax-search-input-action-button\"\n        aria-label=\"search\"\n      ></button>\n    </ng-container>\n    <ng-container *ngIf=\"templateOverride\">\n      <ng-container\n        *ngTemplateOutlet=\"templateOverride; context: context\"\n      ></ng-container>\n    </ng-container>\n\n    <!-- <slot\n      name=\"input\"\n      :suggestions=\"suggestions\"\n      :onMouseClick=\"onMouseClick\"\n      :onMouseOver=\"onMouseOver\"\n      :onMouseLeave=\"onMouseLeave\"\n    ></slot> -->\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: StoreServiceService }], propDecorators: { afterAutosuggest: [{
                 type: Input
             }], beforeAutosuggest: [{
@@ -628,7 +750,8 @@ class SearchstudioUxAngularModule {
             SearchstaxSearchSortingWidget,
             SearchstaxSearchRelatedSearchesWidget,
             SearchstaxSearchExternalPromotionsWidget,
-            SearchstaxSearchAnswerWidget], imports: [CommonModule, FormsModule], exports: [SearchstaxWrapper,
+            SearchstaxSearchAnswerWidget,
+            SearchstaxSearchLocationWidget], imports: [CommonModule, FormsModule], exports: [SearchstaxWrapper,
             SearchstaxInputWidget,
             SearchstaxResultsWidget,
             SearchstaxSearchFeedbackWidget,
@@ -637,7 +760,8 @@ class SearchstudioUxAngularModule {
             SearchstaxSearchSortingWidget,
             SearchstaxSearchRelatedSearchesWidget,
             SearchstaxSearchExternalPromotionsWidget,
-            SearchstaxSearchAnswerWidget] }); }
+            SearchstaxSearchAnswerWidget,
+            SearchstaxSearchLocationWidget] }); }
     static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstudioUxAngularModule, imports: [CommonModule, FormsModule] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchstudioUxAngularModule, decorators: [{
@@ -653,7 +777,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         SearchstaxSearchSortingWidget,
                         SearchstaxSearchRelatedSearchesWidget,
                         SearchstaxSearchExternalPromotionsWidget,
-                        SearchstaxSearchAnswerWidget
+                        SearchstaxSearchAnswerWidget,
+                        SearchstaxSearchLocationWidget
                     ],
                     imports: [CommonModule, FormsModule],
                     exports: [
@@ -666,7 +791,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                         SearchstaxSearchSortingWidget,
                         SearchstaxSearchRelatedSearchesWidget,
                         SearchstaxSearchExternalPromotionsWidget,
-                        SearchstaxSearchAnswerWidget
+                        SearchstaxSearchAnswerWidget,
+                        SearchstaxSearchLocationWidget
                     ],
                 }]
         }] });
@@ -679,5 +805,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { SearchstaxInputWidget, SearchstaxResultsWidget, SearchstaxSearchAnswerWidget, SearchstaxSearchExternalPromotionsWidget, SearchstaxSearchFacetsWidget, SearchstaxSearchFeedbackWidget, SearchstaxSearchPaginationWidget, SearchstaxSearchRelatedSearchesWidget, SearchstaxSearchSortingWidget, SearchstaxWrapper, SearchstudioUxAngularModule, StoreServiceService };
+export { SearchstaxInputWidget, SearchstaxResultsWidget, SearchstaxSearchAnswerWidget, SearchstaxSearchExternalPromotionsWidget, SearchstaxSearchFacetsWidget, SearchstaxSearchFeedbackWidget, SearchstaxSearchLocationWidget, SearchstaxSearchPaginationWidget, SearchstaxSearchRelatedSearchesWidget, SearchstaxSearchSortingWidget, SearchstaxWrapper, SearchstudioUxAngularModule, StoreServiceService };
 //# sourceMappingURL=searchstax-inc-searchstudio-ux-angular.mjs.map