@bridgeline-digital/hawksearch-handlebars-ui 4.0.3-beta.0 → 5.0.0-beta.1

package/changelog.md

@@ -1,7 +1,19 @@
-# 4.0.3
+# 5.0.0
 
-1. Modified RecommendationsService to transform response properties into arrays to be consistent with search results and autocomplete.
-2. Modified `attributes` property on `RecommendationsItem` to include only the properties from `customDict` on the API response. The other properties from the response are standard so repeating them under `attributes` does not make sense.
+## New Features
+
+1. Added VariantSelectorComponent
+2. Implemented VariantSelectorComponent in default templates for search results, featured items, recommendations, and autocomplete
+
+## Bug Fixes
+
+1. Updated the `attributes` collection on recommendation items to split single string values by `|^|` into string arrays
+2. Added logic to catch HTTP errors in service layer
+
+## Breaking Changes
+
+1. Modified JSON structure for field mapping configuration
+2. The `attributes` collection on recommendation items now consists of the data in `customDict` from the API response rather than preserving `customDict` as a nested property
 
 # 4.0.2
 

package/dist/components/content/content-types/base-content.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { BaseComponentConfig } from '@configuration';
 import { BaseComponentModel, ContentType } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * @category Content
  */

package/dist/components/content/content-types/featured-items-content-item/featured-items-content-item.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { FeaturedItemsContentItemComponentConfig, HawkSearchComponents } from '@configuration';
 import { FeaturedItemsContentItemComponentModel, SearchResultsItem } from '@models';
-import { BaseComponent } from '../../../base.component';
 /**
  * The Featured Items Content Item component displays information for an individual product or page.
  *

package/dist/components/content/content-zone/content-zone.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { ContentZoneComponentConfig, HawkSearchComponents } from '@configuration';
 import { ContentZoneComponentModel, SearchResponse } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Content Zone component renders a list of content items or Spotlight products as defined in the Merchandising section of HawkSearch.
  *

package/dist/components/general/date-picker/date-picker.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { DatePickerComponentConfig, HawkSearchComponents } from '@configuration';
 import { DatePickerComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Date Picker component provides an intuitive interface that allows the user to select a range in ISO format. This component is currently only used within the {@link Components.DateRangeFacetComponent | Date Range Facet Component}.
  *

package/dist/components/general/icon/icon.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, IconComponentConfig } from '@configuration';
 import { IconComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Icon component renders an SVG image inline with text content.
  *

package/dist/components/general/range-slider/range-slider.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, RangeSliderComponentConfig } from '@configuration';
 import { RangeSliderComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Range Slider component provides a draggable interface that allows the user to select a range between 0-100. This component is currently only used within the {@link Components.RangeSliderFacetComponent | Range Slider Facet Component}.
  *

package/dist/components/general/rating/rating.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, RatingComponentConfig } from '@configuration';
 import { RatingComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Rating component is used to display a visual representation of ratings for a particular product.
  *

package/dist/components/general/tooltip/tooltip.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, TooltipComponentConfig } from '@configuration';
 import { TooltipComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Tooltip component is used to display a brief explanation or contextual information when the user hovers over an element.
  *

package/dist/components/index.d.ts

@@ -226,3 +226,4 @@ export * from './general';
 export * from './landing-pages';
 export * from './recommendations';
 export * from './search';
+export * from './variants';

package/dist/components/landing-pages/landing-page/landing-page.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, LandingPageComponentConfig } from '@configuration';
 import { LandingPageComponentModel, SearchResponse } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Landing page component displays either a search results interface to display a subset of products, or a custom layout to display content items.
  *

package/dist/components/recommendations/recommendations/recommendations.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, RecommendationsComponentConfig } from '@configuration';
 import { RecommendationsComponentModel, RecommendationsWidget } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Recommendations component displays a list of products determined by the rules configured in the HawkSearch admin.
  *

package/dist/components/recommendations/recommendations-item/recommendations-item.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, RecommendationsItemComponentConfig } from '@configuration';
 import { RecommendationsItem, RecommendationsItemComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Recommendations Item component displays information for an individual product or page.
  *

package/dist/components/search/autocomplete/autocomplete.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { AutocompleteComponentConfig, HawkSearchComponents } from '@configuration';
 import { AutocompleteComponentModel, AutocompleteResponse } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Autocomplete component displays a preview of search results after a user begins to type a query in the {@link Components.SearchFieldComponent}.
  *

package/dist/components/search/facet-types/base-facet.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { BaseComponentConfig } from '@configuration';
 import { BaseComponentModel, Facet, FacetState } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Base Facet component is inherited by all facet type copmonents.
  *

package/dist/components/search/facet-wrapper/facet-wrapper.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { FacetWrapperComponentConfig, HawkSearchComponents } from '@configuration';
 import { Facet, FacetState, FacetWrapperComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Facet Wrapper component adds functionality common to all facet types such as expand/collapse, tooltip, and value search.
  *

package/dist/components/search/facets-list/facets-list.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { FacetsListComponentConfig, HawkSearchComponents } from '@configuration';
 import { Facet, FacetsListComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Facets List component displays a list of available facets with a toggle to expand/collapse on mobile devices.
  *

package/dist/components/search/modified-query/modified-query.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, ModifiedQueryComponentConfig } from '@configuration';
 import { ModifiedQueryComponentModel, ModifiedQueryData } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Modified Query component is rendered when the spellchecker detects a spelling error and searches for the correctly-spelled query instead.
  *

package/dist/components/search/page-size/page-size.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, PageSizeComponentConfig } from '@configuration';
 import { PageSizeComponentModel, PaginationOption } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Page Size component is used to modify the number of search results displayed on each page.
  *

package/dist/components/search/pagination/pagination.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, PaginationComponentConfig } from '@configuration';
 import { Pagination, PaginationComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Pagination component is used to navigate between different pages of a search results set.
  *

package/dist/components/search/query-suggestions/query-suggestions.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, QuerySuggestionsComponentConfig } from '@configuration';
 import { QuerySuggestionsComponentModel, QuerySuggestionsData } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Query Suggestions component displays a list of possible queries that the search engine detects the user may be looking for.
  *

package/dist/components/search/search-field/search-field.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SearchFieldComponentConfig } from '@configuration';
 import { SearchFieldComponentModel, SearchResponse } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Search component contains a text input element which triggers the {@link Components.AutocompleteComponent | Autocomplete component} as the user types and executes a new search when the user hits the `enter` key.
  *

package/dist/components/search/search-results/search-results.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SearchResultsComponentConfig } from '@configuration';
 import { SearchResponse, SearchResultsComponentModel, SearchResultsMode } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Search Results component encapsulates all components relating to search-results.
  *

package/dist/components/search/search-results-item/search-results-item.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SearchResultsItemComponentConfig } from '@configuration';
 import { SearchResultsItem, SearchResultsItemComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Search Results Item component displays information for an individual product or page.
  *

package/dist/components/search/search-results-list/search-results-list.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SearchResultsListComponentConfig } from '@configuration';
 import { SearchResultsItem, SearchResultsListComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Search Results List component is a wrapper around a group of {@link Components.SearchResultsItemComponent | Search Results Item} components.
  *

package/dist/components/search/selected-facets/selected-facets.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SelectedFacetsComponentConfig } from '@configuration';
 import { SelectedFacet, SelectedFacetsComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Selected Facets component displays a list of facets that have been selected by the user.
  *

package/dist/components/search/sorting/sorting.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, SortingComponentConfig } from '@configuration';
 import { Sorting, SortingComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Sorting component is used to select the logic for ordering search results.
  *

package/dist/components/search/tabs/tabs.component.d.ts

@@ -1,6 +1,6 @@
+import { BaseComponent } from '@components';
 import { HawkSearchComponents, TabsComponentConfig } from '@configuration';
 import { Facet, TabsComponentModel } from '@models';
-import { BaseComponent } from '../../base.component';
 /**
  * The Tabs component is used to segment search results by item type, often products and content.
  *

package/dist/components/variants/index.d.ts

@@ -0,0 +1 @@
+export * from './variant-selector/variant-selector.component';

package/dist/components/variants/variant-selector/variant-selector.component.d.ts

@@ -0,0 +1,23 @@
+import { BaseComponent } from '@components';
+import { HawkSearchComponents, VariantSelectorComponentConfig } from '@configuration';
+import { VariantSelectorComponentModel, Variants } from '@models';
+/**
+ * The Variant Selector component is used to select a single variant within an item.
+ *
+ * ## Tag
+ * The tag for this component is `<hawksearch-variant-selector>`.
+ *
+ * ## Default Template
+ * The following is the default Handlebars template for this component. To create a custom template, it is recommended to use this as a starting point.
+ * {@embed ./variant-selector.component.hbs}
+ *
+ * @category Variants
+ */
+export declare class VariantSelectorComponent extends BaseComponent<VariantSelectorComponentConfig, Variants, VariantSelectorComponentModel> {
+    protected componentName: keyof HawkSearchComponents;
+    protected defaultHtml: any;
+    protected bindFromEvent: boolean;
+    protected renderContent(): boolean;
+    protected getContentModel(): VariantSelectorComponentModel;
+    protected onRender(): void;
+}

package/dist/configuration/configuration.models.d.ts

@@ -1,5 +1,5 @@
 import * as Handlebars from 'handlebars';
-import { SearchRequest, SearchResponse, SearchResultsItemType } from '@models';
+import { ItemType, RecommendationsResponse, SearchRequest, SearchResponse } from '@models';
 import { AutocompleteService, RecommendationsService, SearchService, TrackingService } from '../services';
 export interface BaseComponentConfig {
     /**
@@ -194,6 +194,8 @@ export interface TabsComponentConfig extends BaseComponentConfig {
 }
 export interface TooltipComponentConfig extends BaseComponentConfig {
 }
+export interface VariantSelectorComponentConfig extends BaseComponentConfig {
+}
 export interface HawkSearchComponents {
     'autocomplete'?: AutocompleteComponentConfig;
     'checkbox-list-facet'?: CheckboxListFacetComponentConfig;
@@ -233,10 +235,82 @@ export interface HawkSearchComponents {
     'sorting'?: SortingComponentConfig;
     'tabs'?: TabsComponentConfig;
     'tooltip'?: TooltipComponentConfig;
+    'variant-selector'?: VariantSelectorComponentConfig;
 }
 export type DisplayType = 'mobile' | 'tablet' | 'desktop';
 export interface Breakpoints<TValue> extends Record<DisplayType, TValue> {
 }
+export interface FieldMappings {
+    /**
+     * #### Default Value
+     * `['description', 'longdescription']`
+     */
+    description?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `['imageurl', 'image']`
+     */
+    imageUrl?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `'price'`
+     */
+    price?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `'rating'`
+     */
+    rating?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `['saleprice']`
+     */
+    salePrice?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `['sku']`
+     */
+    sku?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `['title', 'name', 'itemname']`
+     */
+    title?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `'type'`
+     */
+    type?: string | Array<string>;
+    /**
+     * #### Default Value
+     * `'url'`
+     */
+    url?: string;
+}
+export interface VariantFieldMappings extends FieldMappings {
+    /**
+     * #### Default Value
+     * `['id']`
+     */
+    id?: string | Array<string>;
+    color?: {
+        /**
+         * #### Default Value
+         * `['colorname', 'color']`
+         */
+        name?: string | Array<string>;
+        /**
+         * #### Default Value
+         * `['colorhex', 'colorvalue']`
+         */
+        hex?: string | Array<string>;
+        /**
+         * #### Default Value
+         * `['colorimageurl', 'colorimage']`
+         */
+        imageUrl?: string | Array<string>;
+    };
+}
 export interface HawkSearchConfig {
     /**
      * The unique ID for your installation found in the HawkSearch admin
@@ -246,6 +320,10 @@ export interface HawkSearchConfig {
      * Specify an index to query rather than the default
      */
     index?: string;
+    /**
+     * Map item attributes to common object properties
+     */
+    fieldMappings?: FieldMappings;
     autocomplete?: {
         /**
          * The API used to retrieve search results
@@ -261,26 +339,6 @@ export interface HawkSearchConfig {
          * `false`
          */
         recommendationsEnabled?: boolean;
-        /**
-         * Map item attributes to common object properties
-         */
-        fieldMappings?: {
-            /**
-             * #### Default Value
-             * `'price'`
-             */
-            price?: string;
-            /**
-             * #### Default Value
-             * `'rating'`
-             */
-            rating?: string;
-            /**
-             * #### Default Value
-             * `'saleprice'`
-             */
-            salePrice?: string;
-        };
     };
     search?: {
         /**
@@ -304,51 +362,6 @@ export interface HawkSearchConfig {
          * `'-'`
          */
         facetExclusionPrefix?: string;
-        /**
-         * Map item attributes to common object properties
-         */
-        fieldMappings?: {
-            /**
-             * #### Default Value
-             * `'longdescription'`
-             */
-            description?: string;
-            /**
-             * #### Default Value
-             * `'image'`
-             */
-            imageUrl?: string;
-            /**
-             * #### Default Value
-             * `'price'`
-             */
-            price?: string;
-            /**
-             * #### Default Value
-             * `'rating'`
-             */
-            rating?: string;
-            /**
-             * #### Default Value
-             * `'saleprice'`
-             */
-            salePrice?: string;
-            /**
-             * #### Default Value
-             * `'itemname'`
-             */
-            title?: string;
-            /**
-             * #### Default Value
-             * `'type'`
-             */
-            type?: string;
-            /**
-             * #### Default Value
-             * `'url'`
-             */
-            url?: string;
-        };
         /**
          * Specifies how search results should be classified
          */
@@ -359,7 +372,7 @@ export interface HawkSearchConfig {
              * #### Default Value
              * `'content'`
              */
-            default: SearchResultsItemType;
+            default: ItemType;
             /**
              * List of values that will be considered a `product` result.
              *
@@ -412,46 +425,6 @@ export interface HawkSearchConfig {
          * `'https://recs-dev.hawksearch.net'`
          */
         endpointUrl?: string;
-        /**
-         * Map item attributes to common object properties
-         */
-        fieldMappings?: {
-            /**
-             * #### Default Value
-             * `'longdescription'`
-             */
-            description?: string;
-            /**
-             * #### Default Value
-             * `'image'`
-             */
-            imageUrl?: string;
-            /**
-             * #### Default Value
-             * `'price'`
-             */
-            price?: string;
-            /**
-             * #### Default Value
-             * `'rating'`
-             */
-            rating?: string;
-            /**
-             * #### Default Value
-             * `'saleprice'`
-             */
-            salePrice?: string;
-            /**
-             * #### Default Value
-             * `'itemname'`
-             */
-            title?: string;
-            /**
-             * #### Default Value
-             * `'url'`
-             */
-            url?: string;
-        };
     };
     tracking?: {
         /**
@@ -470,6 +443,24 @@ export interface HawkSearchConfig {
          */
         endpointUrl?: string;
     };
+    variants?: {
+        /**
+         * Specifies whether variant logic should be used if data is available
+         *
+         * #### Default Value
+         *
+         * `true`
+         */
+        enabled?: boolean;
+        /**
+         * When specified, this prefix is removed from the `attributes` collection on variant items. For example, if a value of `'child_'` is used and HawkSearch returns a field named `'child_color'`, it will be transformed to `'color'`.
+         */
+        fieldPrefix?: string;
+        /**
+         * Map item attributes to common object properties
+         */
+        fieldMappings?: VariantFieldMappings;
+    };
     /**
      * Specifies the minimum window widths that correspond to each breakpoint. This is used determine when certain content items are displayed.
      *
@@ -549,6 +540,9 @@ export interface HawkSearchConfig {
 export interface HawkSearchGlobal {
     config: HawkSearchConfig;
     handlebars: typeof Handlebars;
+    recommendationsResponses?: {
+        [widgetId: string]: RecommendationsResponse;
+    };
     searchRequest?: SearchRequest;
     searchResponse?: SearchResponse;
     services?: {

package/dist/helpers/helpers.d.ts

@@ -102,6 +102,24 @@ export declare function html(html: string): Handlebars.SafeString;
  * @returns Formatted currency string
  */
 export declare function currency(value: number | string | Array<number> | Array<string> | undefined, decimals: number | undefined, defaultValue?: number): string | undefined;
+/**
+ * This function filters an array of objects based on whether a specified property value matches an optional condition, or, if omitted, has a truthy value
+ *
+ * @param values Array of objects to be filtered
+ * @param path Name of property or nested path to evaluate each object
+ * @param condition Optional condition
+ * @returns Formatted currency string
+ */
+export declare function arrayFilterObjects(values: Array<any | undefined>, path: string, condition?: any): Array<any> | undefined;
+/**
+ * This function returns whether any object in an array has a specified property value which matches an optional condition, or, if omitted, has a truthy value
+ *
+ * @param values Array of objects to be filtered
+ * @param path Name of property or nested path to evaluate each object
+ * @param condition Optional condition
+ * @returns Formatted currency string
+ */
+export declare function arrayHasObjectsWithValue(values: Array<any | undefined>, path: string, condition?: any): boolean;
 /**
  * This function returns whether the first provided value is greater than the second provided value.
  *