...

• Pass a template HTML string containing a Handlebars template as described in Installation.

• Pass the ID of a template element containing a Handlebars template as described in Installation.

• Define the new Handlebars template s as the child content of a control

...

Hawksearch.handlebars.registerHelper('concat', function (...values: Array<any>): string {
    if (values.length < 2) {
        return '';
    }

    return values.slice(0, -1).join(''); // Omit last argument as that is the Handlebars options function
});

...

currency

This function returns whether two values are equivalentformats a value as currency:

Hawksearch.handlebars.registerHelper('eqcurrency', function (value1: any, value2: any): boolean {
    return value1 === value2;
});

exclude

This function is used to prevent Handlebars from attempting to bind a data model to a nested control containing a custom template:

Hawksearch.handlebars.registerHelper('eq', function (value1: any, value2: any): boolean {
    return value1 === value2;
});

To better illustrate, see the following example:

<hawksearch-results>
    {{{{exclude}}}} (value: number | Array<number> | undefined, decimals: number, defaultValue?: number): string | undefined => {
    if (typeof defaultValue === 'object') {
        defaultValue = undefined;
    }

    if (value instanceof <hawksearch-pagination>Array) {
        value =  {{#if displayFirstLink}}value[0];
    }

    return formatCurrency(value ?? defaultValue ?? 0,   <a hawksearch-page="1">First</a>
            {{/if}}decimals);
});

eq

This function returns whether two values are equivalent:

Hawksearch.handlebars.registerHelper('eq', function (value1: any, value2: any): boolean {
    return value1 === value2;
});

exclude

This function is used to prevent Handlebars from attempting to bind a data model to a nested control containing a custom template:

Hawksearch.handlebars.registerHelper('eq', function (value1:  {{#if displayLastLink}}
 any, value2: any): boolean {
    return value1 === value2;
});

To better illustrate, see the following example:

<hawksearch-results>
     <a hawksearch-page="{{{{totalPages}}">Last</a>exclude}}}}
        <hawksearch-pagination>
            {{/if#if displayFirstLink}}
                <a </hawksearch-pagination>page="1">First</a>
            {{{{/excludeif}}}}
</hawksearch-results>

html

This function is used to render a provided string as HTML rather than escape special characters:

Hawksearch.handlebars.registerHelper('html', function (html: string): Handlebars.SafeString {
            return new Hawksearch.handlebars.SafeString(html);
});

if-else

This function is used to render different content inline depending on whether a condition resolves to true or false:

Hawksearch.handlebars.registerHelper('if-else', function (condition: any, trueValue: any, falseValue: any): any {
    return condition ? trueValue : falseValue;
});

lt

...

{{#if displayLastLink}}
                <a hawksearch-page="{{totalPages}}">Last</a>
            {{/if}}
        </hawksearch-pagination>
    {{{{/exclude}}}}
</hawksearch-results>

html

This function is used to render a provided string as HTML rather than escape special characters:

Hawksearch.handlebars.registerHelper('lthtml', function (value1html: any, value2: anystring): booleanHandlebars.SafeString {
    return value1 < value2new Hawksearch.handlebars.SafeString(html);
});

lte

...

if-else

This function is used to render different content inline depending on whether a condition resolves to true or false:

Hawksearch.handlebars.registerHelper('lteif-else', function (value1condition: any, trueValue: any, value2falseValue: any): booleanany {
    return condition value1 <= value2? trueValue : falseValue;
});

...

lt

This function returns whether the first provided value is greater less than the second provided value:

Hawksearch.handlebars.registerHelper('gtlt', function (value1: any, value2: any): boolean {
    return value1 >< value2;
});

...

lte

This function returns whether the first provided value is greater less than or equal to the second provided value:

Hawksearch.handlebars.registerHelper('gtelte', function (value1: any, value2: any): boolean {
    return value1 ><= value2;
});

...

gt

This function returns whether either the first provided value is greater than the second provided value resolves to true:

Hawksearch.handlebars.registerHelper('orgt', function (...values: Array<any>): value1: any, value2: any): boolean {
    return values.slice(0, -1).some((v) => !!v); // Omit last argument as that is the Handlebars options functionvalue1 > value2;
});

...

gte

This function returns the difference of two valueswhether the first provided value is greater than or equal to the second provided value:

Hawksearch.handlebars.registerHelper('subtractgte', function (value1: numberany, value2: numberany): numberboolean {
    return value1 ->= value2;
});

Custom Templates

The Handlebars instance is exposed via Hawksearch.handlebars. You can use this reference to define your own helper functions as needed.

Events

hawksearch:initialized

This event fires after the Hawksearch Handlebars UI has been loaded. Developers can hook into this event to define custom Handlebars partials.

addEventListener('hawksearch:initialized', (event) => {
    Hawksearch.handlebars.registerPartial('custom-partial', 'HTML here');
});

hawksearch:search-completed

This event fired after every search operation (query, applied facet, etc.).

addEventListener('hawksearch:search-completed', (event) => {
    const searchResponse = event.detail;

    console.log(searchResponse);
});

number

This function formats a number:

Hawksearch.handlebars.registerHelper('number', (value: number | Array<number> | undefined, decimals: number, defaultValue?: number): string | undefined => {
    if (typeof defaultValue === 'object') {
        defaultValue = undefined;
    }

    if (value instanceof Array) {
        value = value[0];
    }

    return formatNumber(value ?? defaultValue ?? 0, decimals);
});

or

This function returns whether either provided value resolves to true:

Hawksearch.handlebars.registerHelper('or', function (...values: Array<any>): boolean {
    return values.slice(0, -1).some((v) => !!v); // Omit last argument as that is the Handlebars options function
});

string

This function displays a specified string with an optional default value:

Hawksearch.handlebars.registerHelper('string', (value: string | Array<string> | undefined, defaultValue?: string): string | undefined => {
    if (typeof defaultValue === 'object') {
        defaultValue = undefined;
    }

    if (value instanceof Array) {
        value = value[0];
    }

    return value ?? defaultValue;
});

subtract

This function returns the difference of two values:

Hawksearch.handlebars.registerHelper('subtract', function (value1: number, value2: number): number {
    return value1 - value2;
});

Custom Templates

The Handlebars instance is exposed via Hawksearch.handlebars. You can use this reference to define your own helper functions as needed.