Fixes 
- Removed Jumpiness on Search loading: VerticalResults no longer flashes while in the ‘search-loading’ state. Now, while a search is loading, the last search’s results will still display on the screen. This addresses the “jumpies” you may have seen when paginating through results.
- Middle Click Analytics: Added analytics on middle-click for links and CTAs.
- FilterBox configuration Options: Filterbox’s onChange, resetFilters, resetFiltersLabel, resetFilter, and resetFilterLabel config options were not working. These have been fixed. FilterBox will also now respect a child filter’s specific configuration over its own.
Updates to Existing Features/Components + New Features 
-
RTF Formatting and Click Analytics! You can now set the target for the html attribute via the ANSWERS.formatRichText(rtfFieldValue, eventOptionsFieldName, target), and tag clicks from your rich text field with analytics. (Previously, you could just format the text as it displayed on the page.) You can learn more about how to use rich text fields in the Rich Text Unit.
-
Direct Answer Formatting. It’s now easier to format direct answers, using a card component. It can be formatted based on field type, and is overridable by field name. If you’d like to override it, you can do so with the jambo direct answer card command. Learn more in the Formatting Direct Answer Unit.
-
Pagination can now be configured to show multiple pages at a time, and display the first and last page. Here are the details on teh configuration options
- You can now display multiple of pages via
maxVisiblePagesDesktopandmaxVisiblePagesMobileconfig options, which specify the maximum number of visible pages on both desktop and mobile. - Pagination’s
showFirstandshowLastconfig options have been deprecated in favor ofshowFirstAndLastButton. - Pagination now accepts an
onPaginate(newPageNumber, oldPageNumber, totalPages)callback, which is called when the page is changed. By default this scrolls the user to the top of the page. - Here’s an example of the new component with some of the additional configuration options toggled:
- You can configure these options under
PaginationincomponentSettingsin your json config file. All options are described here, and here’s an example of using the new updated component:
"componentSettings": {
"Pagination": {
"maxVisiblePagesMobile": 3, //display 3 pages on mobile breakpoints & below
"maxVisiblePagesDesktop": 10, //display 10 pages on mobile breakpoints & below
"pageLabel": "" , //hide the label for the page
"pinFirstAndLastPage": true, // "pin" the first and last page (page 1 and 35 in the above example)
"showFirstAndLastButton": false //hide the button that skips to the first and last page (represented as the double chevron).
}
}
- Applied Filters got lots of fun updates on both Universal and Vertical Search. In summary:
-
VerticalResultsnow displays static and facet applied filters, in addition to NLP filters, in the applied filters bar. - Filters can be hidden on a per fieldId basis using the new
appliedFilters.hiddenFieldsconfig option. By default,builtin.entityTypefilters are hidden (but this can be overridden). -
VerticalResultsnow accepts anappliedFilters.removableconfig option to true will render static and facet filters as removable tags, which when clicked will remove the filter and trigger a new search. - You can configure these options under the
VerticalResults, orUniversalResultsin your json config files. All applied filter configuration options are described in the VerticalResults and UniversalResults SDK documentation.
-
Facets are now searchable (either on a field basis, or for all facets)! You can also override specific configuration options per facet option (including
showMore,showCountandexpand) More information is included in the Facets SDK documentation. These options can be configured under theFacetscomponent in your json config files. Here’s an example of making an insurance accepted field searchable.
"componentSettings": {
"Facets": {
"fields": {
"insuranceAccepted": {
"label": "Insurances", // This will change the label of the facet. If not specified, defaults to display name of the field
"searchable": true,
"searchLabelText": "Search for insurance accepted",
"placeholderText": "Search"
}
}
}
}
-
Maps now accept onPinMouseOver(mapMarker) and onPinMouseOut(mapMarker) callbacks for map pins. These operate similarly to onPinClick(mapMarker). This is mainly for developers who want to add custom map interactions. See SDK Documentation.
-
Filter by Distance/Radius: You can now add a static filter for distance. You can do this using the existing
FilterBoxoptions in your json config file, but adding anoptionTypeforRADIUS_FILTER. Additional information is in the SDK documentation, and here’s an example:
"componentSettings": {
"FilterBox": {
"filters": [
{
"type": "FilterOptions",
"label": "DISTANCE",
"optionType": "RADIUS_FILTER", //needed for this to be a distance filter
"control": "singleoption", //required
"options": [{
"label": "5 miles",
"value": 8046.72, //value is in meters
},
{
"label": "10 miles",
"value": 16093.4, //NEW
},
{
"label": "25 miles",
"value": 40233.6, //NEW
},
{
"label": "50 miles",
"value": 80467.2,
},
{
"label": "200 miles",
"value": 321869,
},
{
"label": "400 miles",
"value": 643738
}]
},
],
"searchOnChange": true
}
}
- Overriding Location Users can now call a new method, ANSWERS.setGeolocation(lat, lng), to override any location biasing used in answers.
Breaking Changes in Component Configuration
In the applied filters, by default, builtin.entityType filter is hidden.
Previously, if you had a builtin.entityType filter, you’d see that entity filter displayed:
Now it will not be displayed by default:
This can be overridden if needed via verticalsToConfig – see #4 above.
Other Upgrading Call Outs
As with all upgrades, we recommend putting this on staging before moving to production. There were fairly significant styling changes with this version. A few items that will be affected by the changes listed above are below.
Custom Promotions
If you added special css to any of your universal results sections, you will need to target the new class view all class to hide it.
To address: In your answers.css, add “display: none;” to these class names
.yxt-Results--{VERTICAL_NAME} {
yxt-Results-viewAll {
display: none;
}
}
Pagination
This fix was implemented by default as of patch 1.4.1. If you’re reading this, we’d recommend using version 1.4.1 instead.
Now that pagination supports displaying multiple page numbers at one time, we needed an active-page state, to make it clear to the user what page s/he is on. You’ll therefore see a background said active state.
To address: If you’re only displaying one page at a time, you can remove this by adding this to you answers.scss
.yxt-Pagination #active-page {
background-color: inherit;
}
Default Icon Color on Universal
To spruce up universal a bit, the default icon color for the section header is now the default primary brand color.
To address: Many experiences are already overriding this color, but if you notice the icon color in the section headers and you are not a fan, add this to your answers.scss
.yxt-Results-titleIconWrapper {
color: inherit;
}
View All Link
Some older sites have added a chevron after the view all link by default. This is now built-in (!), so you might see it duplicated:
To address:
In your answers.scss, search for the following text and remove it:
&-viewAllLink
{
@include chevron-after('~assets/images/answers/smaller.svg');
}
Universal Results Applied Filters Bar
We’ve updated the Universal Results applied filters bar to use the same css classes as its Vertical Results counterpart. If you were previously targeting .yxt-Results-filters, you should now target .yxt-ResultsHeader.
To address: Update .yxt-Results-filters to .yxt-ResultsHeader in any custom css.
For example, previously hiding applied filters with this:
.yxt-Results--{VERTICAL_NAME} .yxt-Results-filters
{
display: none;
}
Update .yxt-Results-filters to .yxt-ResultsHeader:
.yxt-Results--{VERTICAL_NAME} .yxt-ResultsHeader
{
display: none;
}
Padding Changes on Applied Filters
We’ve reduced some of the default top and bottom padding on applied filters, in an attempt to reduce the amount of space that pushes the results set down.
Previous Versions:
-
.yxt-ResultsHeader-appliedFiltershad top and bottom .5rem padding -
.yxt-ResultsHeader had top and bottom .5rem padding
This version:
-
.yxt-ResultsHeader-appliedFiltershas no padding -
.yxt-ResultsHeaderhas top .25rem padding
To address: If you require the old padding,
.yxt-ResultsHeader-appliedFilters, .yxt-ResultsHeader
{
padding: .5rem 0;
}
Universal Results
We added margin-top to all sections of Universal Results, instead of all but the first section, for greater consistency. In the theme’s universal-standard.scss, this was patched with:
&-directAnswer
{
margin-bottom: var(--yxt-base-spacing);
}
If you dislike the spacing, you can set a different margin-bottom on the class above.
Facets/FilterBox/FilterOptions Have Prettier Checkboxes
Instead of the built-in browser checkbox, we now use ::before and ::after styling on the .yxt-FilterOptions-optionLabel class to make them a little bit prettier.
To address: If you require the old checkboxes
.yxt-FilterOptions-checkboxInput {
height: inherit;
width: inherit;
opacity: inherit;
margin: inherit;
}
.yxt-FilterOptions-optionLabel:before {
content: none;
}
.yxt-FilterOptions-optionLabel {
display: block;
margin-left: .3125rem;
}
.yxt-FilterOptions-option {
align-items: center;
}