coveo-search-ui

<!doctype html> <html class="default no-js"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>SearchInterface | Coveo JavaScript Search Framework - Reference Documentation</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://use.typekit.net/bqa0xml.css"></link> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/all.min.css" /> <link rel="stylesheet" href="../assets/css/main.css"> <link rel="stylesheet" href="../assets/css/overrides.css"> <link rel="stylesheet" href="../assets/css/coveo-connect-header.css"> <link rel="stylesheet" href="https://static.cloud.coveo.com/searchui/v2.10122/css/CoveoFullSearch.min.css" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script type="text/javascript" src="https://static.cloud.coveo.com/coveo.analytics.js/coveoua.js"></script> <script src="../assets/js/modernizr.js"></script> <script class="coveo-script" src="https://static.cloud.coveo.com/searchui/v2.10122/js/CoveoJsSearch.min.js"></script> <script src="../assets/js/coveo-connect-header.js"></script> <script src="../assets/gen/js/playground.js"></script> <script src="../assets/js/searchUIrefDoc.js"></script> <link href="../assets/favicon.ico" rel="shortcut icon" type="image/x-icon"> </head> <body> <header class="no-sticky"> <div class="content"> <div class="main-header"> <div class="logo"> <a class="logo-img-wrap" href="https://coveo.com"> <div class="logo-imgbg"> <svg width="124" height="32" viewBox="0 0 409 104" fill="none" xmlns="http://www.w3.org/2000/svg"> <g clip-path="url(#clip0)"> <path d="M164.7 36.2L159.8 41.4C156.4 38.1 152.8 36.2 147.9 36.2C139.4 36.2 133 42.9 133 52.3C133 61.7 139.4 68.4 147.9 68.4C152.5 68.4 156.9 66.5 160.1 63.2L164.7 68.4C160.7 73 155 75.4 148.3 75.4C134.3 75.4 125.2 65.4 125.2 52.3C125.2 38.9 134.3 28.9 148.3 28.9C154.6 28.8 160.6 31.5 164.7 36.2Z" fill="white"/> <path d="M219.4 52.3C219.4 65.4 209.4 75.4 196 75.4C182.3 75.4 172.3 65.4 172.3 52.3C172.3 38.9 182.3 28.9 196 28.9C209.4 28.9 219.4 38.9 219.4 52.3ZM180.2 52.3C180.2 61.7 186.9 68.4 196 68.4C204.8 68.4 211.5 61.7 211.5 52.3C211.5 42.9 204.8 36.2 196 36.2C186.9 36.2 180.2 42.9 180.2 52.3Z" fill="white"/> <path d="M252.3 74.5H243.1L224.3 30.1H232.8L247.7 66.9L262.6 30.1H270.8L252.3 74.5Z" fill="white"/> <path d="M318.8 52V55H283.8C284.7 64.1 291.1 68.7 298.7 68.7C303.8 68.8 308.8 66.9 312.7 63.5L316.7 68.7C311.2 73.9 305.1 75.5 298.4 75.5C285 75.5 275.6 66.4 275.6 52.4C275.6 38.7 285 29 297.8 29C310 28.9 318.8 38.6 318.8 52ZM283.9 48.6H311.3C310.4 41 305.2 35.8 297.9 35.8C290 35.9 285.1 41 283.9 48.6Z" fill="white"/> <path d="M376 52.3C376 65.4 366 75.4 352.6 75.4C338.9 75.4 328.9 65.4 328.9 52.3C328.9 38.9 338.9 28.9 352.6 28.9C365.9 28.9 376 38.9 376 52.3ZM336.8 52.3C336.8 61.7 343.5 68.4 352.6 68.4C361.4 68.4 368.1 61.7 368.1 52.3C368.1 42.9 361.4 36.2 352.6 36.2C343.4 36.2 336.8 42.9 336.8 52.3Z" fill="white"/> <path d="M88.1 14.9C79.5 6.4 68.3 1.2 56.2 0C55.3 0 54.6 0.8 54.6 1.8C54.6 2.2 54.7 2.5 55 2.8L73.8 21.3C73.8 21.6 73.8 21.6 73.5 21.6C68.3 17.8 62.2 15.5 55.9 14.9C55.3 14.8 54.8 15.2 54.7 15.8C54.7 16.1 54.8 16.4 55 16.7L67.8 29.5C67.8 29.5 67.8 29.8 67.5 29.5C64 27.3 60.1 25.9 55.9 25.5C55.3 25.5 55 26.1 55.3 26.7L76.9 48.3C77.5 48.9 78.4 48.3 78.1 47.7C77.8 43.6 76.4 39.6 74.1 36.1C73.8 36.1 74.1 35.8 74.1 36.1L86.6 48.3C87.2 48.9 88.4 48.3 88.4 47.4C87.7 41 85.4 34.8 81.7 29.5C81.4 29.5 81.7 29.2 81.7 29.5L100.6 48C101.1 48.6 101.9 48.7 102.5 48.3C103 48 103.2 47.4 103 46.8C101.9 34.7 96.6 23.4 88.1 14.9Z" fill="#00ADFF"/> <path d="M14.9 14.9C23.6 6.5 34.8 1.2 46.8 0C47.7 0 48.4 0.6 48.5 1.5C48.5 1.9 48.4 2.4 48 2.7L29.5 21.3C29.2 21.6 29.5 21.6 29.5 21.6C34.8 17.8 41 15.5 47.4 14.9C48.3 14.9 48.9 16.1 48.3 16.7L35.6 29.5C35.3 29.5 35.6 29.8 35.6 29.5C39.1 27.3 43 26 47.2 25.5C47.8 25.5 48.4 26.1 47.8 26.7L26.1 48.3C25.5 48.9 24.9 48.3 24.9 47.7C25.3 43.6 26.8 39.6 29.2 36.1C29.2 36.1 28.9 35.8 28.9 36.1L16.7 48.3C15.8 48.9 14.6 48.3 14.9 47.4C15.5 40.9 17.8 34.7 21.6 29.5C21.6 29.5 21.3 29.2 21.3 29.5L2.7 48C1.5 49.2 0 48.3 0 46.8C1.2 34.8 6.5 23.6 14.9 14.9Z" fill="#F05245"/> <path d="M14.9 88.8C23.4 97.4 34.7 102.7 46.8 103.7C47.6 103.8 48.3 103.3 48.4 102.5C48.5 102 48.3 101.6 48 101.2L29.5 82.4C29.2 82.4 29.5 82.1 29.5 82.4C34.8 86.2 41 88.5 47.4 89C48.3 89 48.9 87.8 48.3 87.2L35.6 74.5C35.3 74.2 35.6 74.2 35.6 74.2C39 76.5 43 78 47.1 78.4C47.7 78.4 48.3 77.5 47.7 77.2L26.1 55.6C25.5 55 24.9 55.3 24.9 56.2C25.3 60.3 26.8 64.3 29.2 67.8C29.2 67.8 28.9 68.1 28.9 67.8L16.7 55.6C15.8 55 14.6 55.3 14.9 56.5C15.5 62.9 17.8 69 21.6 74.1C21.6 74.3 21.5 74.4 21.3 74.4L2.7 55.6C2 55 0.9 55.2 0.4 55.9C0.2 56.2 0.1 56.5 0 56.9C1.1 68.9 6.4 80.2 14.9 88.8Z" fill="#1CEBCF"/> <path d="M88.1 88.8C79.6 97.5 68.3 102.8 56.2 103.7C55 104 54.1 102.2 55 101.3L73.8 82.5C73.8 82.5 73.8 82.2 73.5 82.5C68.3 86.3 62.2 88.6 55.9 89.2C55.3 89.3 54.8 88.8 54.7 88.2C54.7 87.9 54.8 87.6 55 87.3L67.8 74.5C67.8 74.2 67.8 74.2 67.5 74.2C64.1 76.6 60.1 78.1 56 78.4C55.5 78.3 55.2 77.9 55.3 77.5C55.3 77.4 55.3 77.3 55.4 77.2L77 55.6C77.6 55 78.5 55.3 78.2 56.2C77.9 60.3 76.5 64.3 74.2 67.8C73.9 67.8 74.2 68.1 74.2 67.8L86.7 55.6C87.1 55.2 87.8 55.2 88.2 55.6C88.4 55.8 88.5 56.2 88.5 56.5C87.8 62.8 85.5 68.9 81.8 74.1C81.5 74.4 81.8 74.4 81.8 74.4L100.6 55.6C101.5 54.7 103.3 55.6 103 56.8C102 68.9 96.7 80.2 88.1 88.8Z" fill="#FFE300"/> <path opacity="0.87" d="M390.8 31.9V43H388.9V31.9H385.4V30.1H394.4V31.9H390.8Z" fill="white"/> <path opacity="0.87" d="M407.7 43V34.4L404.7 40.5999H403.3L400.3 34.4V43H398.3V30.2H400.3L404 38.2L407.7 30.2H409.6V43H407.7Z" fill="white"/> </g> <defs> <clipPath id="clip0"> <rect width="409" height="104" fill="white"/> </clipPath> </defs> </svg> </div> </a> <a class="logo-text" href="https://docs.coveo.com"> <span class="logo-text-bar">|</span> <span class="logo-text-custom">docs</span> </a> </div> <div class="search"> <div id="coveoConnectHeaderStandaloneSearchbox" class="searchbox"> <div class="CoveoSearchbox" style="display: flex;" type="text" data-auto-focus="false" data-enable-omnibox="true" data-inline="false" data-enable-wildcards="true" data-enable-search-as-you-type="false" data-enable-reveal-query-suggest-addon="true" data-enable-query-syntax="true" data-enable-field-addon="true" data-placeholder="Search"></div> <div class="CoveoAnalytics"></div> </div> </div> <nav class="subnav"> <ul> <li><a href="https://connect.coveo.com/" target="_blank">Community</a></li> <li><a href="https://docs.google.com/forms/d/e/1FAIpQLSeyNL18g4JWIDR5xEyIMY48JIjyjwXRmlCveecjXBNSLh4Ygg/viewform?usp=sf_link" target="_blank">Feedback</a></li> <li><a href="https://docs.coveo.com/en/3378/">News</a></li> </ul> </nav> </div> </div> </header> <subHeader class="no-sticky"> <div class="content"> <nav class="navBar"> <ul> <li><button class="dropdownButton">Guides<i class="fas fa-chevron-down"></i> <ul class="dropdown"> <li><a href="https://docs.coveo.com/en/1724/">Searching With Coveo</a></li> <li><a href="https://docs.coveo.com/en/2648/">Project Guide</a></li> <li><a href="https://docs.coveo.com/en/1351/">Services</a></li> </li> </ul> </button> </li> <li> <button class="dropdownButton">API Reference<i class="fas fa-chevron-down"></i> <ul class="dropdown"> <li><a href="https://coveo.github.io/search-ui/" target="_blank">JavaScript Search Framework</a></li>  <li><a href="https://docs.coveo.com/en/headless/latest/reference/">Headless</a></li> <li><a href="https://docs.coveo.com/en/12/">Push API</a></li> <li><a href="https://docs.coveo.com/en/8/">Field API</a></li> <li><a href="https://docs.coveo.com/en/13/">Search API</a></li> <li><a href="https://docs.coveo.com/en/18/">Usage Analytics API</a></li> <li><a href="https://docs.coveo.com/en/4/">Other APIs</a></li> </ul> </button> </li> <li> <button class="dropdownButton">Extensions<i class="fas fa-chevron-down"></i> <ul class="dropdown"> <li><a href="https://docs.coveo.com/en/1499/">Coveo for Commerce</a></li> <li><a href="https://docs.coveo.com/en/1243/">Coveo for Salesforce</a></li> <li><a href="https://docs.coveo.com/en/1479/">Coveo for ServiceNow</a></li> <li><a href="https://docs.coveo.com/en/2709/">Coveo for Sitecore</a></li> </ul> </button> </li> </ul> </nav> </div> </subHeader> <div class="container container-main"> <div class="row"> <div id="toc-column" class="col-1 col-menu menu-sticky-wrap menu-highlight"> <div id="filter-box-container"> <div id="filter-box-header">Filter</div> <div id="filter-box-body"> <div class="container"> <div class="table-wrap"> <div class="table-cell" id="tsd-widgets"> <div id="tsd-filter"> <div class="ctr-box-filter"> <input type="checkbox" id="tsd-filter-inherited" checked /> <label class="tsd-widget" for="tsd-filter-inherited" title="Display inherited methods and properties"> Inherited</label><br> </div> </div> </div> </div> </div> </div> <div id="filter-box-footer"></div> </div> <nav class="tsd-navigation secondary menu-sticky"> <ul class="before-current"> <a id="globals-toc-link" href=../globals.html><b>Globals</b></a> </ul> <ul class="current"> <li class="current tsd-kind-coveo-component"> <a href="searchinterface.html" class="tsd-kind-icon">Search<wbr>Interface</a> <ul> <li class=" tsd-kind-method tsd-parent-kind-coveo-component"> <a href="searchinterface.html#attachcomponent" class="tsd-kind-icon">attach<wbr>Component</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a href="searchinterface.html#debuginfo" class="tsd-kind-icon">debug<wbr>Info</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component"> <a href="searchinterface.html#detachcomponent" class="tsd-kind-icon">detach<wbr>Component</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component"> <a href="searchinterface.html#detachcomponentsinside" class="tsd-kind-icon">detach<wbr>Components<wbr>Inside</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a href="searchinterface.html#disable" class="tsd-kind-icon">disable</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a href="searchinterface.html#enable" class="tsd-kind-icon">enable</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component"> <a href="searchinterface.html#getbindings" class="tsd-kind-icon">get<wbr>Bindings</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-has-type-parameter"> <a href="searchinterface.html#getcomponents" class="tsd-kind-icon">get<wbr>Components</a> </li> <li class=" tsd-kind-method tsd-parent-kind-coveo-component"> <a href="searchinterface.html#getquerycontext" class="tsd-kind-icon">get<wbr>Query<wbr>Context</a> </li> <li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"> <a href="searchinterface.html#disabled" class="tsd-kind-icon">disabled</a> </li> <li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"> <a href="searchinterface.html#logger" class="tsd-kind-icon">logger</a> </li> <li class=" tsd-kind-property tsd-parent-kind-coveo-component"> <a href="searchinterface.html#responsivecomponents" class="tsd-kind-icon">responsive<wbr>Components</a> </li> <li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static"> <a href="searchinterface.html#id" class="tsd-kind-icon">ID</a> </li> <li class=" tsd-kind-object-literal tsd-parent-kind-coveo-component tsd-is-static"> <a href="searchinterface.html#options" class="tsd-kind-icon">options</a> </li> <li class=" tsd-kind-constructor tsd-parent-kind-coveo-component"> <a href="searchinterface.html#constructor" class="tsd-kind-icon">constructor</a> </li> </ul> </li> </ul> <ul class="after-current"> </ul> </nav> </div> <div id="separator"></div> <div class="col-2 col-content"> <div class="tsd-page-title"> <div class="container"> <ul class="tsd-breadcrumb"> <a id="home-menu-link" class="aui-nav-link" title="Go to the home page" href=..> <i class="fa fa-home" aria-hidden="true"></i> </a> <li> <a href="../globals.html">Globals</a> </li> <li> <a href="searchinterface.html">SearchInterface</a> </li> </ul> <h1>Coveo SearchInterface Component (CoveoSearchInterface)</h1> </div> </div> <section class="tsd-panel tsd-comment"> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>The SearchInterface component is the root and main component of your Coveo search interface. You should place all other Coveo components inside the SearchInterface component.</p> </div> <p>It is also on the HTMLElement of the SearchInterface component that you call the <a href="../globals.html#init">init</a> function.</p> <p>It is advisable to specify a unique HTML <code>id</code> attribute for the SearchInterface component in order to be able to reference it easily.</p> <p><strong>Example:</strong></p> <pre><code class="lang-html"><span class="hljs-tag"><<span class="hljs-name">head</span>></span> [ ... ] <span class="hljs-tag"><<span class="hljs-name">script</span>></span><span class="javascript"> <span class="hljs-built_in">document</span>.addEventListener(<span class="hljs-string">'DOMContentLoaded'</span>, <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params"></span>) </span>{ [ ... ] <span class="hljs-comment">// The init function is called on the SearchInterface element, in this case, the body of the page.</span> Coveo.init(<span class="hljs-built_in">document</span>.body); [ ... ] }); </span><span class="hljs-tag"></<span class="hljs-name">script</span>></span> [ ... ] <span class="hljs-tag"></<span class="hljs-name">head</span>></span> <span class="hljs-comment"></span> <span class="hljs-tag"><<span class="hljs-name">body</span> <span class="hljs-attr">id</span>=<span class="hljs-string">'search'</span> <span class="hljs-attr">class</span>=<span class="hljs-string">'CoveoSearchInterface'</span> [ <span class="hljs-attr">...</span> <span class="hljs-attr">other</span> <span class="hljs-attr">options</span> <span class="hljs-attr">...</span> ]></span> [ ... ] <span class="hljs-comment"></span> [ ... ] <span class="hljs-tag"></<span class="hljs-name">body</span>></span> </code></pre> </div> </section> <div class="preview-container tsd-panel"> <div class="overlay"></div> </div> <section class="tsd-panel-group tsd-index-group"> <h2>Index</h2> <section class="tsd-panel tsd-index-panel"> <div class="tsd-index-content"> <section class="tsd-index-section "> <h3>Methods</h3> <ul class="tsd-index-list"> <li class="tsd-kind-method tsd-parent-kind-coveo-component"><a href="searchinterface.html#attachcomponent" class="tsd-kind-icon">attach<wbr>Component</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="searchinterface.html#debuginfo" class="tsd-kind-icon">debug<wbr>Info</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component"><a href="searchinterface.html#detachcomponent" class="tsd-kind-icon">detach<wbr>Component</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component"><a href="searchinterface.html#detachcomponentsinside" class="tsd-kind-icon">detach<wbr>Components<wbr>Inside</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="searchinterface.html#disable" class="tsd-kind-icon">disable</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="searchinterface.html#enable" class="tsd-kind-icon">enable</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component"><a href="searchinterface.html#getbindings" class="tsd-kind-icon">get<wbr>Bindings</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-has-type-parameter"><a href="searchinterface.html#getcomponents" class="tsd-kind-icon">get<wbr>Components</a></li> <li class="tsd-kind-method tsd-parent-kind-coveo-component"><a href="searchinterface.html#getquerycontext" class="tsd-kind-icon">get<wbr>Query<wbr>Context</a></li> </ul> </section> <section class="tsd-index-section "> <h3>Properties</h3> <ul class="tsd-index-list"> <li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="searchinterface.html#disabled" class="tsd-kind-icon">disabled</a></li> <li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="searchinterface.html#logger" class="tsd-kind-icon">logger</a></li> <li class="tsd-kind-property tsd-parent-kind-coveo-component"><a href="searchinterface.html#responsivecomponents" class="tsd-kind-icon">responsive<wbr>Components</a></li> <li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static"><a href="searchinterface.html#id" class="tsd-kind-icon">ID</a></li> </ul> </section> <section class="tsd-index-section "> <h3>Component Options</h3> <ul class="tsd-index-list"> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.allowquerieswithoutkeywords" class="tsd-kind-icon">allow<wbr>Queries<wbr>Without<wbr>Keywords</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.autotriggerquery" class="tsd-kind-icon">auto<wbr>Trigger<wbr>Query</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enableautomaticresponsivemode" class="tsd-kind-icon">enable<wbr>Automatic<wbr>Responsive<wbr>Mode</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enablecollaborativerating" class="tsd-kind-icon">enable<wbr>Collaborative<wbr>Rating</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enabledebuginfo" class="tsd-kind-icon">enable<wbr>Debug<wbr>Info</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enableduplicatefiltering" class="tsd-kind-icon">enable<wbr>Duplicate<wbr>Filtering</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enablehistory" class="tsd-kind-icon">enable<wbr>History</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.enablescrollrestoration" class="tsd-kind-icon">enable<wbr>Scroll<wbr>Restoration</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.excerptlength" class="tsd-kind-icon">excerpt<wbr>Length</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.expression" class="tsd-kind-icon">expression</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.filterfield" class="tsd-kind-icon">filter<wbr>Field</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.firstloadinganimation" class="tsd-kind-icon">first<wbr>Loading<wbr>Animation</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.hideuntilfirstquery" class="tsd-kind-icon">hide<wbr>Until<wbr>First<wbr>Query</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.maximumage" class="tsd-kind-icon">maximum<wbr>Age</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.modalcontainer" class="tsd-kind-icon">modal<wbr>Container</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.pipeline" class="tsd-kind-icon">pipeline</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.responsivemediumbreakpoint" class="tsd-kind-icon">responsive<wbr>Medium<wbr>Breakpoint</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.responsivemode" class="tsd-kind-icon">responsive<wbr>Mode</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.responsivesmallbreakpoint" class="tsd-kind-icon">responsive<wbr>Small<wbr>Breakpoint</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.resultsperpage" class="tsd-kind-icon">results<wbr>Per<wbr>Page</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.searchpageuri" class="tsd-kind-icon">search<wbr>Page<wbr>Uri</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.timezone" class="tsd-kind-icon">timezone</a></li> <li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="searchinterface.html#options.uselocalstorageforhistory" class="tsd-kind-icon">use<wbr>Local<wbr>Storage<wbr>For<wbr>History</a></li> </ul> </section> <section class="tsd-index-section "> <h3>Constructors</h3> <ul class="tsd-index-list"> <li class="tsd-kind-constructor tsd-parent-kind-coveo-component"><a href="searchinterface.html#constructor" class="tsd-kind-icon">constructor</a></li> </ul> </section> </div> </section> </section> <section class="tsd-panel-group tsd-member-group "> <h2>Methods</h2> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component"> <a name="attachcomponent" class="tsd-anchor"></a> <h3>attach<wbr>Component</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component"> <li class="tsd-signature tsd-kind-icon">attach<wbr>Component<span class="tsd-signature-symbol">(</span>type<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, component<span class="tsd-signature-symbol">: </span><a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L616">ui/SearchInterface/SearchInterface.ts :616</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Attaches a component to the search interface. This allows the search interface to easily list and iterate over its components.</p> </div> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>type: <span class="tsd-signature-type">string</span></h5> <div class="tsd-comment tsd-typography"> <p>Normally, the component type is a unique identifier without the <code>Coveo</code> prefix (e.g., <code>CoveoFacet</code> -> <code>Facet</code>, <code>CoveoPager</code> -> <code>Pager</code>, <code>CoveoQuerybox</code> -> <code>Querybox</code>, etc.).</p> </div> </li> <li> <h5>component: <a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a></h5> <div class="tsd-comment tsd-typography"> <p>The component instance to attach.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a name="debuginfo" class="tsd-anchor"></a> <h3>debug<wbr>Info</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <li class="tsd-signature tsd-kind-icon">debug<wbr>Info<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">any</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#debuginfo">debugInfo</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L41">ui/Base/BaseComponent.ts :41</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Return the debug info about this component.</p> </div> </div> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">any</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component"> <a name="detachcomponent" class="tsd-anchor"></a> <h3>detach<wbr>Component</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component"> <li class="tsd-signature tsd-kind-icon">detach<wbr>Component<span class="tsd-signature-symbol">(</span>type<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span>, component<span class="tsd-signature-symbol">: </span><a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L626">ui/SearchInterface/SearchInterface.ts :626</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Detaches a component from the search interface.</p> </div> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>type: <span class="tsd-signature-type">string</span></h5> <div class="tsd-comment tsd-typography"> <p>Normally, the component type is a unique identifier without the <code>Coveo</code> prefix (e.g., <code>CoveoFacet</code> -> <code>Facet</code>, <code>CoveoPager</code> -> <code>Pager</code>, <code>CoveoQuerybox</code> -> <code>Querybox</code>, etc.).</p> </div> </li> <li> <h5>component: <a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a></h5> <div class="tsd-comment tsd-typography"> <p>The component instance to detach.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component"> <a name="detachcomponentsinside" class="tsd-anchor"></a> <h3>detach<wbr>Components<wbr>Inside</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component"> <li class="tsd-signature tsd-kind-icon">detach<wbr>Components<wbr>Inside<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L713">ui/SearchInterface/SearchInterface.ts :713</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Detaches from the SearchInterface every component that is inside the given element.</p> </div> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>element: <span class="tsd-signature-type">HTMLElement</span></h5> <div class="tsd-comment tsd-typography"> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a name="disable" class="tsd-anchor"></a> <h3>disable</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <li class="tsd-signature tsd-kind-icon">disable<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#disable">disable</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L52">ui/Base/BaseComponent.ts :52</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Disable the component. Normally this means that the component will not execute handlers for the framework events (query events, for example). Components are enabled by default on creation.</p> </div> </div> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <a name="enable" class="tsd-anchor"></a> <h3>enable</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"> <li class="tsd-signature tsd-kind-icon">enable<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">void</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#enable">enable</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L61">ui/Base/BaseComponent.ts :61</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Enable the component. Normally this means that the component will execute handlers for the framework events (query events, for example). Components are enabled by default on creation.</p> </div> </div> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">void</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component"> <a name="getbindings" class="tsd-anchor"></a> <h3>get<wbr>Bindings</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component"> <li class="tsd-signature tsd-kind-icon">get<wbr>Bindings<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">object</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L638">ui/SearchInterface/SearchInterface.ts :638</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Returns the bindings, or environment, for the current component.</p> </div> </div> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">object</span></h4> <ul class="tsd-parameters"> </ul> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component tsd-has-type-parameter"> <a name="getcomponents" class="tsd-anchor"></a> <h3>get<wbr>Components</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-has-type-parameter"> <li class="tsd-signature tsd-kind-icon">get<wbr>Components<T><span class="tsd-signature-symbol">(</span>type<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">T[]</span></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L692">ui/SearchInterface/SearchInterface.ts :692</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Gets all the components of a given type.</p> </div> </div> <h4 class="tsd-type-parameters-title">Type parameters</h4> <ul class="tsd-type-parameters"> <li> <h4>T</h4> </li> </ul> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5>type: <span class="tsd-signature-type">string</span></h5> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Normally, the component type is a unique identifier without the <code>Coveo</code> prefix (e.g., <code>CoveoFacet</code> -> <code>Facet</code>, <code>CoveoPager</code> -> <code>Pager</code>, <code>CoveoQuerybox</code> -> <code>Querybox</code>, etc.).</p> </div> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T[]</span></h4> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component"> <a name="getquerycontext" class="tsd-anchor"></a> <h3>get<wbr>Query<wbr>Context</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component"> <li class="tsd-signature tsd-kind-icon">get<wbr>Query<wbr>Context<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../globals.html#context" class="tsd-signature-type">Context</a></li> </ul> <ul class="tsd-descriptions"> <li class="tsd-description"> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L664">ui/SearchInterface/SearchInterface.ts :664</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Gets the query context for the current search interface.</p> </div> <p>If the search interface has performed at least one query, it will try to resolve the context from the last query sent to the Coveo Search API.</p> <p>If the search interface has not performed a query yet, it will try to resolve the context from any avaiable <a href="pipelinecontext.html">PipelineContext</a> component.</p> <p>If multiple <a href="pipelinecontext.html">PipelineContext</a> components are available, it will merge all context values together.</p> <p><strong>Note:</strong> Having multiple PipelineContext components in the same search interface is not recommended, especially if some context keys are repeated across those components.</p> <p>If no context is found, returns <code>undefined</code></p> </div> <h4 class="tsd-returns-title">Returns <a href="../globals.html#context" class="tsd-signature-type">Context</a></h4> </li> </ul> </section> </section> <section class="tsd-panel-group tsd-member-group "> <h2>Properties</h2> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"> <a name="disabled" class="tsd-anchor"></a> <h3>disabled</h3> <div class="tsd-signature tsd-kind-icon">disabled<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#disabled">disabled</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L23">ui/Base/BaseComponent.ts :23</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <div class="lead"> <p>A disabled component will not participate in the query, or listen to <a href="../classes/componentevents.html">ComponentEvents</a>.</p> </div> <dl class="tsd-comment-tags"> <dt>type</dt> <dd><p>{boolean}</p> </dd> </dl> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"> <a name="logger" class="tsd-anchor"></a> <h3>logger</h3> <div class="tsd-signature tsd-kind-icon">logger<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">Logger</span></div> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#logger">logger</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L18">ui/Base/BaseComponent.ts :18</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Allows component to log in the dev console.</p> </div> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component"> <a name="responsivecomponents" class="tsd-anchor"></a> <h3>responsive<wbr>Components</h3> <div class="tsd-signature tsd-kind-icon">responsive<wbr>Components<span class="tsd-signature-symbol">:</span> <a href="../classes/responsivecomponents.html" class="tsd-signature-type">ResponsiveComponents</a></div> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L528">ui/SearchInterface/SearchInterface.ts :528</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Allows to get and set the different breakpoints for mobile and tablet devices.</p> </div> <p>This is useful, amongst other, for <a href="facet.html">Facet</a>, <a href="tab.html">Tab</a> and <a href="resultlist.html">ResultList</a></p> </div> </section> <section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static"> <a name="id" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> ID</h3> <div class="tsd-signature tsd-kind-icon">ID<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div> <aside class="tsd-sources"> <p>Inherited from <a href="../classes/basecomponent.html">BaseComponent</a>.<a href="../classes/basecomponent.html#id">ID</a></p> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/BaseComponent.ts#L28">ui/Base/BaseComponent.ts :28</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>The static ID that each component needs in order to be identified.<br/> For example, SearchButton -> static ID: SearchButton -> className: CoveoSearchButton</p> </div> </div> </section> </section> <section class="tsd-panel-group tsd-member-group "> <h2>Component Options</h2> <section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal"> <a name="options.allowquerieswithoutkeywords" class="tsd-anchor"></a> <h3>allow<wbr>Queries<wbr>Without<wbr>Keywords</h3> <div class="tsd-signature tsd-kind-icon">allow<wbr>Queries<wbr>Without<wbr>Keywords<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L337">ui/SearchInterface/SearchInterface.ts :337</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <div class="lead"> <p>Specifies if the search interface should perform queries when no keywords are entered by the end user.</p> </div> <p>When this option is set to true, the interface will initially only load with the search box, as long as you have a search box component in your interface.</p> <p>Once the user submits a query, the full search interface loads to display the results.</p> <p>When using the Coveo for Salesforce Free edition, this option is automatically set to false, and should not be changed.</p> <p>This option interacts closely with the <a href="searchinterface.html#options.autotriggerquery">SearchInterface.options.autoTriggerQuery</a> option, as the automatic query is not triggered when there are no keywords.</p> <p>It also modifies the <a href="../interfaces/iquery.html#allowquerieswithoutkeywords">IQuery.allowQueriesWithoutKeywords</a> query parameter.</p> <p>Default value is <code>true</code>, except in Coveo for Salesforce Free edition in which it is <code>false</code>.</p> <dl class="tsd-comment-tags"> <dt>Default</dt> <dd><p><code>true</code></p> </dd> </dl> </div> <div class="tsd-panel"> <div class="tsd-signature-type">Markup configuration example(s) :</div> <pre>data-allow-queries-without-keywords='true' data-allow-queries-without-keywords='false'</pre> </div> </section> <section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal"> <a name="options.autotriggerquery" class="tsd-anchor"></a> <h3>auto<wbr>Trigger<wbr>Query</h3> <div class="tsd-signature tsd-kind-icon">auto<wbr>Trigger<wbr>Query<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L321">ui/SearchInterface/SearchInterface.ts :321</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <div class="lead"> <p>Specifies whether to trigger the first query automatically when the page finishes loading.</p> </div> <p>Default value is <code>true</code>.</p> <dl class="tsd-comment-tags"> <dt>Default</dt> <dd><p><code>true</code></p> </dd> </dl> </div> <div class="tsd-panel"> <div class="tsd-signature-type">Markup configuration example(s) :</div> <pre>data-auto-trigger-query='true' data-auto-trigger-query='false'</pre> </div> </section> <section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal"> <a name="options.enableautomaticresponsivemode" class="tsd-anchor"></a> <h3>enable<wbr>Automatic<wbr>Responsive<wbr>Mode</h3> <div class="tsd-signature tsd-kind-icon">enable<wbr>Automatic<wbr>Responsive<wbr>Mode<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L179">ui/SearchInterface/SearchInterface.ts :179</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <div class="lead"> <p>Specifies whether to enable automatic responsive mode (i.e., automatically placing <a href="facet.html">Facet</a> and <a href="tab.html">Tab</a> components in dropdown menus under the search box when the width of the SearchInterface HTML element reaches or falls behind a certain pixel threshold).</p> </div> <p>You might want to set this option to <code>false</code> if automatic responsive mode does not suit the specific design needs of your implementation.</p> <p><strong>Note:</strong></p> <blockquote> <p>If this option is <code>true</code>, you can also specify whether to enable responsive mode for Facet components (see {@link Facet.options.enableResponsiveMode}) and for Tab components (see <a href="tab.html#options.enableresponsivemode">Tab.options.enableResponsiveMode</a>).</p> <p>In addition, you can specify the label you wish to display on the dropdown buttons (see {@link Facet.options.dropdownHeaderLabel} and <a href="tab.html#options.dropdownheaderlabel">Tab.options.dropdownHeaderLabel</a>).</p> </blockquote> <p>Default value is <code>true</code>.</p> <dl class="tsd-comment-tags"> <dt>Default</dt> <dd><p><code>true</code></p> </dd> </dl> </div> <div class="tsd-panel"> <div class="tsd-signature-type">Markup configuration example(s) :</div> <pre>data-enable-automatic-responsive-mode='true' data-enable-automatic-responsive-mode='false'</pre> </div> </section> <section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal"> <a name="options.enablecollaborativerating" class="tsd-anchor"></a> <h3>enable<wbr>Collaborative<wbr>Rating</h3> <div class="tsd-signature tsd-kind-icon">enable<wbr>Collaborative<wbr>Rating<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">boolean</span></div> <aside class="tsd-sources"> <ul> <li>Defined in <a href="https://github.com/coveo/search-ui/tree/master/src/ui/SearchInterface/SearchInterface.ts#L377">ui/SearchInterface/SearchInterface.ts :377</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <div class="lead"> <p><strong>Note:</strong></p> </div> <blockquote> <p>The Coveo Cloud V2 platform does not suppor