JavaScript Search Framework component equivalences

This is for:

Developer

This table illustrates how out-of-the-box components in the Coveo Atomic, Headless and Quantic libraries match the functionality of various JavaScript Search Framework components. If there’s no direct mapping to a Headless, Atomic, or Quantic 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. If a component is available in Headless but not in Quantic, you can still achieve the functionality by accessing Headless through Quantic.

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 Quantic

AdvancedSearch

AdvancedSearchQuery

None

None

Aggregate

None

None

None

Analytics

Usage Analytics

Usage Analytics

None

AnalyticsSuggestions

None

None

None

AuthenticationProvider

@coveo/auth

@coveo/auth

@coveo/auth

Backdrop

None

None

None

Badge

None

atomic-result-badge

c-quantic-colored-result-badge

Breadcrumb

BreadcrumbManager

atomic-breadbox

c-quantic-breadcrumb-manager

CardActionBar

None

None

None

CardOverlay

None

None

None

CategoryFacet

CategoryFacet

atomic-category-facet

c-quantic-category-facet

CommerceQuery

SearchBox

atomic-search-box

c-quantic-search-box

DidYouMean

DidYouMean

atomic-did-you-mean

c-quantic-did-you-mean

DistanceResources

None

None

None

DynamicFacet

Facet

atomic-facet

c-quantic-facet

DynamicFacetManager

FacetManager

atomic-facet-manager

c-quantic-facet-manager

DynamicFacetRange

NumericFacet

atomic-numeric-range

c-quantic-numeric-facet

DynamicHierarchicalFacet

CategoryFacet

atomic-category-facet

c-quantic-category-facet

ErrorReport

QueryError

atomic-component-error

c-quantic-query-error

Excerpt

ResultTemplates

atomic-result-section-excerpt

c-quantic-result-highlighted-text-field

ExportToExcel

None

None

None

Facet

Facet

atomic-facet

c-quantic-facet

FacetRange

NumericFacet

atomic-numeric-facet

c-quantic-numeric-facet

FacetSlider

None

None

None

FacetsMobileMode

None

atomic-refine-toggle

c-quantic-refine-toggle

FacetValueSuggestions

None

None

None

FieldSuggestions

FieldSuggestions

None

None

FieldTable

None

None

None

FieldValue

None

None

None

Folding

Folding

atomic-folded-result-list

c-quantic-folded-result-list

FollowItem

None

None

None

HiddenQuery

None

None

None

HierarchicalFacet

CategoryFacet

atomic-category-facet

c-quantic-category-facet

Icon

None

atomic-icon

None

ImageFieldValue

None

atomic-result-image

None

Logo

None

None

None

Matrix

None

None

None

MissingTerms

None

None

None

Omnibox

SearchBox

atomic-search-box

c-quantic-search-box-suggestions-list

OmniboxResultList

InstantResults

atomic-search-box-instant-results

None

Pager

Pager

atomic-pager

c-quantic-pager

PipelineContext

Context

None

None

PreferencesPanel

None

None

None

PrintableUri

None

atomic-result-printable-uri

c-quantic-result-printable-uri

PromotedResultsBadge

None

atomic-result-badge

c-quantic-colored-result-badge

Querybox

SearchBox

atomic-search-box

c-quantic-search-box

QueryDuration

QuerySummary

atomic-query-summary

c-quantic-summary

QuerySuggestPreview

InstantResults

atomic-search-box-instant-results

None

QuerySummary

QuerySummary

atomic-query-summary

c-quantic-summary

Quickview

Quickview

atomic-quickview

c-quantic-result-quickview

QuickviewDocument

Quickview

atomic-quickview

None

Recommendation

RecommendationList

atomic-recs-list

c-quantic-recommendation-list

ResultActionsMenu

None

atomic-result-section-actions

c-quantic-result-action

ResultAttachments

None

None

None

ResultFolding

FoldedResultList

atomic-folded-result-list

c-quantic-folded-result-list

ResultLayoutSelector

None

None

None

ResultLink

InteractiveResult

atomic-result-link

c-quantic-result-link

ResultList

ResultList

atomic-result-list

c-quantic-recommendation-list

ResultRating

None

atomic-result-rating

None

ResultsFiltersPreferences

None

None

None

ResultsPerPage

ResultsPerPage

atomic-results-per-page

c-quantic-results-per-page

ResultsPreferences

None

None

None

SearchAlerts

None

None

None

SearchAlertsMessage

None

None

None

Searchbox

SearchBox

atomic-search-box

c-quantic-search-box

SearchButton

None

atomic-search-box

c-quantic-search-box

SearchInterface

SearchBox

atomic-search-interface

c-quantic-search-interface

Settings

None

None

None

ShareQuery

None

None

None

SimpleFilter

None

atomic-popover

c-quantic-sort

SmartSnippet

SmartSnippet

atomic-smart-snippet

c-quantic-smart-snippet

SmartSnippetSuggestions

SmartSnippetQuestionsList

atomic-smart-snippet-suggestions

c-quantic-smart-snippet-suggestions

Sort

Sort

atomic-sort-expression

c-quantic-sort-option

SortDropdown

None

atomic-sort-dropdown

c-quantic-sort

StarRating

None

atomic-result-rating

None

Tab

Tab

atomic-tab

c-quantic-tab

TemplateLoader

None

None

None

Text

None

atomic-text

None

Thumbnail

None

atomic-result-image

None

TimespanFacet

DateFacet

atomic-timeframe-facet

c-quantic-timeframe-facet

Triggers

Trigger Methods

Trigger Methods

Trigger Methods

YouTubeThumbnail

None

atomic-result-image

None