@getlupa/client 0.6.0-alpha-2 → 0.6.0-alpha-5

package/dist/es/index.min.js

@@ -24225,7 +24225,8 @@ var DEFAULT_OPTIONS_RESULTS = {
         top: false,
         bottom: true
       },
-      display: 5
+      display: 5,
+      displayMobile: 3
     }
   },
   sort: [],
@@ -25604,7 +25605,7 @@ var toggleHierarchyParam = function toggleHierarchyParam() {
   return getMostSpecificHierarchyTerms([param].concat(_toConsumableArray(params)));
 };
 
-var searchResult$g = namespace("searchResult");
+var searchResult$h = namespace("searchResult");
 var params$c = namespace("params");
 var options$8 = namespace("options");
 
@@ -25675,13 +25676,13 @@ __decorate([Prop({
   default: false
 })], CurrentFilters.prototype, "expandable", void 0);
 
-__decorate([searchResult$g.Getter("filters")], CurrentFilters.prototype, "currentFilters", void 0);
+__decorate([searchResult$h.Getter("filters")], CurrentFilters.prototype, "currentFilters", void 0);
 
-__decorate([searchResult$g.Getter("facets")], CurrentFilters.prototype, "facets", void 0);
+__decorate([searchResult$h.Getter("facets")], CurrentFilters.prototype, "facets", void 0);
 
-__decorate([searchResult$g.Getter("displayFilters")], CurrentFilters.prototype, "displayFilters", void 0);
+__decorate([searchResult$h.Getter("displayFilters")], CurrentFilters.prototype, "displayFilters", void 0);
 
-__decorate([searchResult$g.Getter("currentFilterCount")], CurrentFilters.prototype, "currentFilterCount", void 0);
+__decorate([searchResult$h.Getter("currentFilterCount")], CurrentFilters.prototype, "currentFilterCount", void 0);
 
 __decorate([options$8.Getter("initialFilters")], CurrentFilters.prototype, "initialFilters", void 0);
 
@@ -29680,7 +29681,7 @@ var scrollTo = function scrollTo(elementId) {
   });
 };
 
-var searchResult$f = namespace("searchResult");
+var searchResult$g = namespace("searchResult");
 var params$b = namespace("params");
 
 var Facets = /*#__PURE__*/function (_Vue) {
@@ -29764,7 +29765,7 @@ __decorate([Prop({
 
 __decorate([params$b.Getter("filters")], Facets.prototype, "currentFilters", void 0);
 
-__decorate([searchResult$f.Getter("facets")], Facets.prototype, "facets", void 0);
+__decorate([searchResult$g.Getter("facets")], Facets.prototype, "facets", void 0);
 
 __decorate([params$b.Action("removeParams")], Facets.prototype, "removeParams", void 0);
 
@@ -30257,7 +30258,7 @@ var __vue_component__$D = /*#__PURE__*/normalizeComponent({
   staticRenderFns: __vue_staticRenderFns__$D
 }, __vue_inject_styles__$D, __vue_script__$D, __vue_scope_id__$D, __vue_is_functional_template__$D, __vue_module_identifier__$D, false, undefined, undefined, undefined);
 
-var searchResult$e = namespace("searchResult");
+var searchResult$f = namespace("searchResult");
 
 var MobileFilterSidebar = /*#__PURE__*/function (_Vue) {
   _inherits(MobileFilterSidebar, _Vue);
@@ -30305,13 +30306,13 @@ var MobileFilterSidebar = /*#__PURE__*/function (_Vue) {
 
 __decorate([Prop()], MobileFilterSidebar.prototype, "options", void 0);
 
-__decorate([searchResult$e.Mutation("setSidebarVisibility")], MobileFilterSidebar.prototype, "setSidebarVisibility", void 0);
+__decorate([searchResult$f.Mutation("setSidebarVisibility")], MobileFilterSidebar.prototype, "setSidebarVisibility", void 0);
 
-__decorate([searchResult$e.State(function (state) {
+__decorate([searchResult$f.State(function (state) {
   return state.isMobileSidebarVisible;
 })], MobileFilterSidebar.prototype, "isMobileSidebarVisible", void 0);
 
-__decorate([searchResult$e.Getter("currentFilterCount")], MobileFilterSidebar.prototype, "currentFilterCount", void 0);
+__decorate([searchResult$f.Getter("currentFilterCount")], MobileFilterSidebar.prototype, "currentFilterCount", void 0);
 
 MobileFilterSidebar = __decorate([Component({
   name: "mobileFilerSidebar",
@@ -30380,7 +30381,7 @@ var __vue_component__$C = /*#__PURE__*/normalizeComponent({
   staticRenderFns: __vue_staticRenderFns__$C
 }, __vue_inject_styles__$C, __vue_script__$C, __vue_scope_id__$C, __vue_is_functional_template__$C, __vue_module_identifier__$C, false, undefined, undefined, undefined);
 
-var searchResult$d = namespace("searchResult");
+var searchResult$e = namespace("searchResult");
 var params$a = namespace("params");
 
 var SearchResultsDidYouMean = /*#__PURE__*/function (_Vue) {
@@ -30433,7 +30434,7 @@ __decorate([Prop({
   default: ""
 })], SearchResultsDidYouMean.prototype, "labels", void 0);
 
-__decorate([searchResult$d.State(function (state) {
+__decorate([searchResult$e.State(function (state) {
   return state.searchResult;
 })], SearchResultsDidYouMean.prototype, "searchResult", void 0);
 
@@ -31583,7 +31584,7 @@ var __vue_component__$r = /*#__PURE__*/normalizeComponent({
   staticRenderFns: __vue_staticRenderFns__$r
 }, __vue_inject_styles__$r, __vue_script__$r, __vue_scope_id__$r, __vue_is_functional_template__$r, __vue_module_identifier__$r, false, undefined, undefined, undefined);
 
-var searchResult$c = namespace("searchResult");
+var searchResult$d = namespace("searchResult");
 
 var SearchResultsProductAddToCart = /*#__PURE__*/function (_Vue) {
   _inherits(SearchResultsProductAddToCart, _Vue);
@@ -31644,7 +31645,7 @@ __decorate([Prop({
   default: true
 })], SearchResultsProductAddToCart.prototype, "inStock", void 0);
 
-__decorate([searchResult$c.State(function (state) {
+__decorate([searchResult$d.State(function (state) {
   return state.addToCartAmount;
 })], SearchResultsProductAddToCart.prototype, "addToCartAmount", void 0);
 
@@ -32021,7 +32022,7 @@ var __vue_component__$n = /*#__PURE__*/normalizeComponent({
 
 var tracking$3 = namespace("tracking");
 var params$9 = namespace("params");
-var searchResult$b = namespace("searchResult");
+var searchResult$c = namespace("searchResult");
 var options$4 = namespace("options");
 
 var SearchResultsProductCard = /*#__PURE__*/function (_Vue) {
@@ -32189,7 +32190,7 @@ __decorate([Prop({
   default: false
 })], SearchResultsProductCard.prototype, "isAdditionalPanel", void 0);
 
-__decorate([searchResult$b.State(function (state) {
+__decorate([searchResult$c.State(function (state) {
   return state.layout;
 })], SearchResultsProductCard.prototype, "layout", void 0);
 
@@ -32897,6 +32898,7 @@ var __vue_component__$j = /*#__PURE__*/normalizeComponent({
 }, __vue_inject_styles__$j, __vue_script__$j, __vue_scope_id__$j, __vue_is_functional_template__$j, __vue_module_identifier__$j, false, undefined, undefined, undefined);
 
 var params$6 = namespace("params");
+var searchResult$b = namespace("searchResult");
 
 var SearchResultsPageSelect = /*#__PURE__*/function (_Vue) {
   _inherits(SearchResultsPageSelect, _Vue);
@@ -32910,12 +32912,17 @@ var SearchResultsPageSelect = /*#__PURE__*/function (_Vue) {
   }
 
   _createClass(SearchResultsPageSelect, [{
+    key: "pageOptionsCount",
+    get: function get() {
+      return this.isMobileWidth ? this.options.displayMobile : this.options.display;
+    }
+  }, {
     key: "pages",
     get: function get() {
       var currentPage = Math.min(this.options.count, this.options.selectedPage);
-      var delta = Math.floor(this.options.display / 2),
+      var delta = Math.floor(this.pageOptionsCount / 2),
           left = currentPage - delta,
-          right = currentPage + (this.options.display - delta);
+          right = currentPage + (this.pageOptionsCount - delta);
       return Array.from({
         length: this.options.count
       }, function (v, k) {
@@ -32988,6 +32995,8 @@ __decorate([Prop({
   default: {}
 })], SearchResultsPageSelect.prototype, "options", void 0);
 
+__decorate([searchResult$b.Getter("isMobileWidth")], SearchResultsPageSelect.prototype, "isMobileWidth", void 0);
+
 __decorate([params$6.Action("appendParams")], SearchResultsPageSelect.prototype, "appendParams", void 0);
 
 SearchResultsPageSelect = __decorate([Component({
@@ -33634,7 +33643,8 @@ var SearchResultsToolbar = /*#__PURE__*/function (_Vue) {
         pageSelect: {
           count: getPageCount(this.searchResult.total, this.limit),
           selectedPage: this.page,
-          display: pageSelect.display
+          display: pageSelect.display,
+          displayMobile: pageSelect.displayMobile
         },
         labels: this.options.labels
       };
@@ -34843,17 +34853,24 @@ var SearchResults = /*#__PURE__*/function (_Vue) {
     value: function handleResults(_ref) {
       var queryKey = _ref.queryKey,
           results = _ref.results;
-
-      var _a;
-
       this.trackResults({
         queryKey: queryKey,
         results: results
       });
-      this.handleNoResultsFlag({
-        resultCount: (_a = results === null || results === void 0 ? void 0 : results.total) !== null && _a !== void 0 ? _a : 0,
-        noResultsParam: this.options.noResultsQueryFlag
-      });
+      this.handleNoResults(results);
+    }
+  }, {
+    key: "handleNoResults",
+    value: function handleNoResults(results) {
+      var _a, _b, _c;
+
+      var hasResults = Boolean(results.total > 0 || ((_a = results.similarQueries) === null || _a === void 0 ? void 0 : _a.length) || ((_b = results.didYouMean) === null || _b === void 0 ? void 0 : _b.options));
+
+      if (hasResults) {
+        return;
+      }
+
+      (_c = this.options.callbacks) === null || _c === void 0 ? void 0 : _c.noResults();
     }
   }, {
     key: "handleResize",
@@ -34864,6 +34881,9 @@ var SearchResults = /*#__PURE__*/function (_Vue) {
         width: window.innerWidth,
         grid: this.options.grid
       });
+      this.setScreenWidth({
+        width: window.innerWidth
+      });
     }
   }]);
 
@@ -34896,8 +34916,6 @@ __decorate([params$1.State("searchString")], SearchResults.prototype, "searchStr
 
 __decorate([params$1.Action("setDefaultLimit")], SearchResults.prototype, "setDefaultLimit", void 0);
 
-__decorate([params$1.Action("handleNoResultsFlag")], SearchResults.prototype, "handleNoResultsFlag", void 0);
-
 __decorate([params$1.Action("add")], SearchResults.prototype, "addParams", void 0);
 
 __decorate([params$1.Action("removeParams")], SearchResults.prototype, "removeParams", void 0);
@@ -34916,6 +34934,8 @@ __decorate([searchResult$1.Action("setLoading")], SearchResults.prototype, "setL
 
 __decorate([options$1.Getter("defaultSearchResultPageSize")], SearchResults.prototype, "defaultSearchResultPageSize", void 0);
 
+__decorate([searchResult$1.Mutation("setScreenWidth")], SearchResults.prototype, "setScreenWidth", void 0);
+
 __decorate([searchResult$1.Action("setColumnCount")], SearchResults.prototype, "setColumnCount", void 0);
 
 SearchResults = __decorate([Component({
@@ -36372,6 +36392,8 @@ var setDocumentTitle = function setDocumentTitle(template) {
   document.title = addParamsToLabel(template, textToInsert);
 };
 
+var MOBILE_WIDTH = 767;
+
 var SearchResultModule = /*#__PURE__*/function (_VuexModule) {
   _inherits(SearchResultModule, _VuexModule);
 
@@ -36389,6 +36411,7 @@ var SearchResultModule = /*#__PURE__*/function (_VuexModule) {
     _this.layout = ResultsLayoutEnum.GRID;
     _this.loading = false;
     _this.isMobileSidebarVisible = false;
+    _this.screenWidth = 1000;
     return _this;
   }
 
@@ -36464,6 +36487,11 @@ var SearchResultModule = /*#__PURE__*/function (_VuexModule) {
       var offset = (_b = this.searchResult.offset) !== null && _b !== void 0 ? _b : 0;
       return [offset + 1, Math.min(offset + limit, this.totalItems)];
     }
+  }, {
+    key: "isMobileWidth",
+    get: function get() {
+      return this.screenWidth < MOBILE_WIDTH;
+    }
   }, {
     key: "setSidebarVisibility",
     value: function setSidebarVisibility(_ref) {
@@ -36487,6 +36515,12 @@ var SearchResultModule = /*#__PURE__*/function (_VuexModule) {
     value: function load(loading) {
       this.loading = loading || false;
     }
+  }, {
+    key: "setScreenWidth",
+    value: function setScreenWidth(_ref3) {
+      var width = _ref3.width;
+      this.screenWidth = width;
+    }
   }, {
     key: "add",
     value: function add(searchResult) {
@@ -36505,9 +36539,9 @@ var SearchResultModule = /*#__PURE__*/function (_VuexModule) {
     }
   }, {
     key: "setColumnCount",
-    value: function setColumnCount(_ref3) {
-      var width = _ref3.width,
-          grid = _ref3.grid;
+    value: function setColumnCount(_ref4) {
+      var width = _ref4.width,
+          grid = _ref4.grid;
 
       if (!width || !grid) {
         return {
@@ -36579,6 +36613,8 @@ __decorate([Mutation], SearchResultModule.prototype, "save", null);
 
 __decorate([Mutation], SearchResultModule.prototype, "load", null);
 
+__decorate([Mutation], SearchResultModule.prototype, "setScreenWidth", null);
+
 __decorate([Action({
   commit: "save"
 })], SearchResultModule.prototype, "add", null);

package/dist/es/store/modules/searchResult.d.ts

@@ -10,6 +10,7 @@ export default class SearchResultModule extends VuexModule {
     layout: ResultsLayout;
     loading: boolean;
     isMobileSidebarVisible: boolean;
+    screenWidth: number;
     get facets(): FacetResult[] | undefined;
     get currentFilters(): FilterGroup | undefined;
     get filters(): FilterGroup;
@@ -21,6 +22,7 @@ export default class SearchResultModule extends VuexModule {
     get currentFilterCount(): number;
     get hasAnyFilter(): boolean;
     get itemRange(): number[];
+    get isMobileWidth(): boolean;
     setSidebarVisibility({ visible }: {
         visible: boolean;
     }): void;
@@ -31,6 +33,9 @@ export default class SearchResultModule extends VuexModule {
         layout?: ResultsLayout;
     }): void;
     load(loading: boolean): void;
+    setScreenWidth({ width }: {
+        width: number;
+    }): void;
     add(searchResult: SearchQueryResult): {
         searchResult: SearchQueryResult;
         pageSize: number;

package/dist/es/types/search-results/PaginationOptions.d.ts

@@ -12,6 +12,7 @@ export declare type PaginationPageSelect = {
     count: number;
     selectedPage: number;
     display: number;
+    displayMobile: number;
 };
 export declare type PaginationDisplay = {
     pageSize: boolean;

package/dist/es/types/search-results/SearchResultsOptions.d.ts

@@ -7,8 +7,8 @@ export declare type SearchResultsOptions = SearchResultsProductOptions & SearchR
     containerSelector: string;
     breadcrumbs: SearchResultsBreadcrumb[];
     classMap?: Record<string, string>;
-    noResultsQueryFlag?: string;
     disallowEmptyQuery?: boolean;
+    callbacks?: SearchResultEventCallbacks;
 };
 export declare type SearchTitlePosition = "page-top" | "search-results-top";
 export declare type SearchResultsDidYouMeanLabels = {
@@ -19,6 +19,9 @@ export declare type SearchResultsSimilarQueriesLabels = {
     similarQuery: string;
     similarQueries: string;
 };
+export declare type SearchResultEventCallbacks = {
+    noResults: () => void;
+};
 export declare type SearchResultsOptionLabels = SearchResultsPaginationLabels & SearchResultsDidYouMeanLabels & SearchResultsSimilarQueriesLabels & {
     sortBy: string;
     currency: string;
@@ -68,6 +71,7 @@ export declare type SearchResultsPagination = {
     pageSelection: {
         position: SearchResultsPaginationPosition;
         display: number;
+        displayMobile: number;
     };
 };
 export declare type SearchResultsPaginationPosition = {

package/dist/iife/components/search-results/SearchResults.vue.d.ts

@@ -25,10 +25,6 @@ export default class SearchResults extends Vue {
     setDefaultLimit: (defaultLimit: number) => {
         defaultLimit: number;
     };
-    handleNoResultsFlag: ({ resultCount, noResultsParam, }: {
-        resultCount: number;
-        noResultsParam?: string;
-    }) => void;
     addParams: (params: QueryParams) => {
         params: QueryParams;
     };
@@ -64,6 +60,10 @@ export default class SearchResults extends Vue {
         queryKey: string;
         results: SearchQueryResult;
     }): void;
+    handleNoResults(results: SearchQueryResult): void;
+    setScreenWidth: ({ width, }: {
+        width: number;
+    }) => void;
     setColumnCount: ({ width, grid, }: {
         width: number;
         grid: ProductGrid;

package/dist/iife/components/search-results/products/pagination/SearchResultsPageSelect.vue.d.ts

@@ -5,6 +5,8 @@ export default class SearchResultsPageSelect extends Vue {
     lastPageLabel: string;
     firstPageLabel: string;
     options: PaginationPageSelect;
+    isMobileWidth: boolean;
+    get pageOptionsCount(): number;
     get pages(): number[];
     get showBack(): boolean;
     get lastPage(): number | undefined;

package/dist/iife/constants/searchResults.const.d.ts

@@ -46,6 +46,7 @@ export declare const DEFAULT_OPTIONS_RESULTS: {
                 bottom: boolean;
             };
             display: number;
+            displayMobile: number;
         };
     };
     sort: never[];

package/dist/iife/index.d.ts

@@ -1,5 +1,5 @@
 import { SearchBoxOptions } from "./types/search-box/SearchBoxOptions";
-import { FacetStyle, SearchResultsOptions } from "./types/search-results/SearchResultsOptions";
+import { FacetStyle, SearchResultEventCallbacks, SearchResultsOptions } from "./types/search-results/SearchResultsOptions";
 import { SdkOptions, TrackingOptions, Environment, SortDirection } from "./types/General";
 import { ProductListOptions } from "./types/product-list/ProductListOptions";
 import { AddToCartElement, CustomDocumentElement, CustomHtmlElement, DescriptionDocumentElement, DocumentElement, DocumentElementType, ImageDocumentElement, PriceElement, RatingElement, RegularPriceDocumentElement, TitleDocumentElement } from "./types/DocumentElement";
@@ -7,6 +7,7 @@ import { SearchBoxPanelType } from "./types/search-box/SearchBoxPanel";
 import { RoutingBehavior } from "./types/search-results/RoutingBehavior";
 import { AnchorPosition } from "./types/search-results/SearchResultsProductCardOptions";
 import { BadgeType } from "./types/search-results/BadgeOptions";
+import { SearchResultsSortOptions, SortOptions } from "./types/search-results/SearchResultsSort";
 declare const lupaSearch: {
     searchBox: (options: SearchBoxOptions) => void;
     searchResults: (options: SearchResultsOptions) => void;
@@ -16,5 +17,5 @@ declare const lupaSearch: {
     clearSearchResults: () => void;
     clearProductList: () => void;
 };
-export { TrackingOptions, SearchBoxOptions, SearchResultsOptions, ProductListOptions, SdkOptions, DocumentElementType, SearchBoxPanelType, FacetStyle, Environment, RoutingBehavior, AnchorPosition, BadgeType, SortDirection, DocumentElement, ImageDocumentElement, TitleDocumentElement, DescriptionDocumentElement, CustomDocumentElement, PriceElement, RegularPriceDocumentElement, RatingElement, AddToCartElement, CustomHtmlElement, };
+export { TrackingOptions, SearchBoxOptions, SearchResultsOptions, ProductListOptions, SdkOptions, DocumentElementType, SearchBoxPanelType, FacetStyle, Environment, RoutingBehavior, AnchorPosition, BadgeType, SortDirection, DocumentElement, ImageDocumentElement, TitleDocumentElement, DescriptionDocumentElement, CustomDocumentElement, PriceElement, RegularPriceDocumentElement, RatingElement, AddToCartElement, CustomHtmlElement, SortOptions, SearchResultsSortOptions, SearchResultEventCallbacks, };
 export default lupaSearch;