JavaScript search framework component equivalences

This is for:

Developer

This table illustrates how out-of-the-box components in the Coveo Atomic and Headless libraries match the functionality of various JavaScript Search Framework components. If there’s no direct mapping to a Headless/Atomic component, a link to the relevant documentation to address the use case will be provided when possible. If a component is available in Headless but not in Atomic, you can still achieve the functionality by accessing Headless through Atomic.

In the Atomic and Headless libraries, certain components offer the same functionality as two or more JavaScript Search Framework components. For example, the Headless QuerySummary provides the same features as the JavaScript Search Framework QueryDuration and QuerySummary components.

Tip
Disclaimer

The JavaScript Search Framework and Atomic both operate as UI libraries. In contrast, Headless provides controllers and actions with which you can create your own, custom components, even when using Atomic. So, if no obvious Headless controller or Atomic component matches the functionality you want to replicate from a JavaScript Search Framework component, you can often implement your own.

JavaScript Search Framework Headless Atomic

AdvancedSearch

AdvancedSearchQuery

None

Aggregate

None

None

Analytics

Usage Analytics

Usage Analytics

AnalyticsSuggestions

None

None

AuthenticationProvider

@coveo/auth

@coveo/auth

Backdrop

None

None

Badge

None

atomic-result-badge

Breadcrumb

BreadcrumbManager

atomic-breadbox

CardActionBar

None

None

CardOverlay

None

None

CategoryFacet

CategoryFacet

atomic-category-facet

CommerceQuery

SearchBox

atomic-search-box

DidYouMean

DidYouMean

atomic-did-you-mean

DistanceResources

None

None

DynamicFacet

Facet

atomic-facet

DynamicFacetManager

FacetManager

atomic-facet-manager

DynamicFacetRange

NumericFacet

atomic-numeric-range

DynamicHierarchicalFacet

CategoryFacet

atomic-category-facet

ErrorReport

QueryError

atomic-component-error

Excerpt

ResultTemplates

atomic-result-section-excerpt

ExportToExcel

None

None

Facet

Facet

atomic-facet

FacetRange

NumericFacet

atomic-numeric-facet

FacetSlider

None

None

FacetsMobileMode

None

atomic-refine-toggle

FacetValueSuggestions

None

None

FieldSuggestions

FieldSuggestions

None

FieldTable

None

None

FieldValue

None

None

Folding

Folding

atomic-folded-result-list

FollowItem

None

None

HiddenQuery

None

None

HierarchicalFacet

CategoryFacet

atomic-category-facet

Icon

None

atomic-icon

ImageFieldValue

None

atomic-result-image

Logo

None

None

Matrix

None

None

MissingTerms

None

None

Omnibox

SearchBox

atomic-search-box

OmniboxResultList

InstantResults

atomic-search-box-instant-results

Pager

Pager

atomic-pager

PipelineContext

Context

None

PreferencesPanel

None

None

PrintableUri

None

atomic-result-printable-uri

PromotedResultsBadge

None

atomic-result-badge

Querybox

SearchBox

atomic-search-box

QueryDuration

QuerySummary

atomic-query-summary

QuerySuggestPreview

InstantResults

atomic-search-box-instant-results

QuerySummary

QuerySummary

atomic-query-summary

Quickview

Quickview

atomic-quickview

QuickviewDocument

Quickview

atomic-quickview

Recommendation

RecommendationList

atomic-recs-list

ResultActionsMenu

None

atomic-result-section-actions

ResultAttachments

None

None

ResultFolding

FoldedResultList

atomic-folded-result-list

ResultLayoutSelector

None

None

ResultLink

InteractiveResult

atomic-result-link

ResultList

ResultList

atomic-result-list

ResultRating

None

atomic-result-rating

ResultsFiltersPreferences

None

None

ResultsPerPage

ResultsPerPage

atomic-results-per-page

ResultsPreferences

None

None

SearchAlerts

None

None

SearchAlertsMessage

None

None

Searchbox

SearchBox

atomic-search-box

SearchButton

None

atomic-search-box

SearchInterface

SearchBox

atomic-search-interface

Settings

None

None

ShareQuery

None

None

SimpleFilter

None

atomic-popover

SmartSnippet

SmartSnippet

atomic-smart-snippet

SmartSnippetSuggestions

SmartSnippetQuestionsList

atomic-smart-snippet-suggestions

Sort

Sort

atomic-sort-expression

SortDropdown

None

atomic-sort-dropdown

StarRating

None

atomic-result-rating

Tab

Tab

None

TemplateLoader

None

None

Text

None

atomic-text

Thumbnail

None

atomic-result-image

TimespanFacet

DateFacet

atomic-timeframe-facet

Triggers

Trigger Methods

Trigger Methods

YouTubeThumbnail

None

atomic-result-image