coveo-search-ui
Version:
Coveo JavaScript Search Framework
1,723 lines • 93.8 kB
HTML
<!doctype html>
<html class="default no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Folding | 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="#">Atomic</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="folding.html" class="tsd-kind-icon">Folding</a>
<ul>
<li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#debuginfo" class="tsd-kind-icon">debug<wbr>Info</a>
</li>
<li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#disable" class="tsd-kind-icon">disable</a>
</li>
<li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#enable" class="tsd-kind-icon">enable</a>
</li>
<li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#getbindings" class="tsd-kind-icon">get<wbr>Bindings</a>
</li>
<li class=" tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static">
<a href="folding.html#get" class="tsd-kind-icon">get</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#bind" class="tsd-kind-icon">bind</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#componentoptionsmodel" class="tsd-kind-icon">component<wbr>Options<wbr>Model</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#componentstatemodel" class="tsd-kind-icon">component<wbr>State<wbr>Model</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#disabled" class="tsd-kind-icon">disabled</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#logger" class="tsd-kind-icon">logger</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#querycontroller" class="tsd-kind-icon">query<wbr>Controller</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#querystatemodel" class="tsd-kind-icon">query<wbr>State<wbr>Model</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#root" class="tsd-kind-icon">root</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#searchinterface" class="tsd-kind-icon">search<wbr>Interface</a>
</li>
<li class=" tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static">
<a href="folding.html#id" class="tsd-kind-icon">ID</a>
</li>
<li class=" tsd-kind-get-signature tsd-parent-kind-coveo-component tsd-is-inherited">
<a href="folding.html#usageanalytics" class="tsd-kind-icon">usage<wbr>Analytics</a>
</li>
<li class=" tsd-kind-object-literal tsd-parent-kind-coveo-component tsd-is-static">
<a href="folding.html#options" class="tsd-kind-icon">options</a>
</li>
<li class=" tsd-kind-constructor tsd-parent-kind-coveo-component tsd-is-overwrite">
<a href="folding.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="folding.html">Folding</a>
</li>
</ul>
<h1>Coveo Folding Component (CoveoFolding)</h1>
</div>
</div>
<section class="tsd-panel tsd-comment">
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>The <code>Folding</code> component makes it possible to render hierarchic representations of search results sharing a common
<a href="folding.html#options.field"><code>field</code></a>.</p>
</div>
<p>This component has no visual impact on its own. It simply folds certain search results so that the
<a href="resultfolding.html"><code>ResultFolding</code></a> and <a href="resultattachments.html"><code>ResultAttachments</code></a> components can then nicely
render them within result templates (see <a href="https://docs.coveo.com/en/413/">Result Templates</a>).</p>
<p>A typical use case of the <code>Folding</code> component is to fold email conversations and message board threads results in a
result set in order to display them in a convenient format. Messages belonging to a single conversation typically
have a unique conversation ID. By indexing this ID on a field, you can use it to fold search results (see
<a href="https://docs.coveo.com/en/428/">Folding Results</a>).</p>
<p><strong>Note:</strong></p>
<blockquote>
<p>There can only be one <code>Folding</code> component per <a href="tab.html"><code>Tab</code></a> component.</p>
</blockquote>
</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 tsd-is-inherited">
<h3>Methods</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#debuginfo" class="tsd-kind-icon">debug<wbr>Info</a></li>
<li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#disable" class="tsd-kind-icon">disable</a></li>
<li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#enable" class="tsd-kind-icon">enable</a></li>
<li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#getbindings" class="tsd-kind-icon">get<wbr>Bindings</a></li>
<li class="tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static"><a href="folding.html#get" class="tsd-kind-icon">get</a></li>
</ul>
</section>
<section class="tsd-index-section tsd-is-inherited">
<h3>Properties</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#bind" class="tsd-kind-icon">bind</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#componentoptionsmodel" class="tsd-kind-icon">component<wbr>Options<wbr>Model</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#componentstatemodel" class="tsd-kind-icon">component<wbr>State<wbr>Model</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#disabled" class="tsd-kind-icon">disabled</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#logger" class="tsd-kind-icon">logger</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#querycontroller" class="tsd-kind-icon">query<wbr>Controller</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#querystatemodel" class="tsd-kind-icon">query<wbr>State<wbr>Model</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#root" class="tsd-kind-icon">root</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#searchinterface" class="tsd-kind-icon">search<wbr>Interface</a></li>
<li class="tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static"><a href="folding.html#id" class="tsd-kind-icon">ID</a></li>
</ul>
</section>
<section class="tsd-index-section tsd-is-inherited">
<h3>Accessors</h3>
<ul class="tsd-index-list">
<li class="tsd-kind-get-signature tsd-parent-kind-coveo-component tsd-is-inherited"><a href="folding.html#usageanalytics" class="tsd-kind-icon">usage<wbr>Analytics</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="folding.html#options.child" class="tsd-kind-icon">child</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.childfield" class="tsd-kind-icon">child<wbr>Field</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.enableexpand" class="tsd-kind-icon">enable<wbr>Expand</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.expandexpression" class="tsd-kind-icon">expand<wbr>Expression</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.field" class="tsd-kind-icon">field</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.getmoreresults" class="tsd-kind-icon">get<wbr>More<wbr>Results</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.getresult" class="tsd-kind-icon">get<wbr>Result</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.maximumexpandedresults" class="tsd-kind-icon">maximum<wbr>Expanded<wbr>Results</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.parent" class="tsd-kind-icon">parent</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.parentfield" class="tsd-kind-icon">parent<wbr>Field</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.range" class="tsd-kind-icon">range</a></li>
<li class="tsd-kind-variable tsd-parent-kind-object-literal"><a href="folding.html#options.rearrange" class="tsd-kind-icon">rearrange</a></li>
<li class="tsd-kind-object-literal tsd-parent-kind-class tsd-is-inherited tsd-is-static"><a href="../classes/foldingforthread.html#options" class="tsd-kind-icon">options</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 tsd-is-overwrite"><a href="folding.html#constructor" class="tsd-kind-icon">constructor</a></li>
</ul>
</section>
</div>
</section>
</section>
<section class="tsd-panel-group tsd-member-group tsd-is-inherited">
<h2>Methods</h2>
<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 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 tsd-is-inherited">
<a name="getbindings" class="tsd-anchor"></a>
<h3>get<wbr>Bindings</h3>
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited">
<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><a href="../interfaces/icomponentbindings.html" class="tsd-signature-type">IComponentBindings</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#getbindings">getBindings</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L328">ui/Base/Component.ts
:328</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Return the bindings, or environment, for the current component.</p>
</div>
</div>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/icomponentbindings.html" class="tsd-signature-type">IComponentBindings</a></h4>
</li>
</ul>
</section>
<section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static">
<a name="get" class="tsd-anchor"></a>
<h3><span class="tsd-flag ts-flagStatic">Static</span> get</h3>
<ul class="tsd-signatures tsd-kind-method tsd-parent-kind-coveo-component tsd-is-inherited tsd-is-static">
<li class="tsd-signature tsd-kind-icon">get<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span>, componentClass<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">any</span>, noThrow<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#get">get</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L410">ui/Base/Component.ts
:410</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Get the bound component to the given HTMLElement. Throws an assert if the HTMLElement has no component bound, unless using the noThrow argument.<br/>
If there is multiple component bound to the current HTMLElement, you must specify the component class.</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">
<p>HTMLElement for which to get the bound component.</p>
</div>
</li>
<li>
<h5><span class="tsd-flag ts-flagOptional">Optional</span> componentClass: <span class="tsd-signature-type">any</span></h5>
<div class="tsd-comment tsd-typography">
<p>Optional component class. If the HTMLElement has multiple components bound, you must specify which one you are targeting.</p>
</div>
</li>
<li>
<h5><span class="tsd-flag ts-flagOptional">Optional</span> noThrow: <span class="tsd-signature-type">boolean</span></h5>
<div class="tsd-comment tsd-typography">
<p>Boolean option to tell the method to not throw on error.</p>
</div>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../classes/basecomponent.html" class="tsd-signature-type">BaseComponent</a></h4>
</li>
</ul>
</section>
</section>
<section class="tsd-panel-group tsd-member-group tsd-is-inherited">
<h2>Properties</h2>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="bind" class="tsd-anchor"></a>
<h3>bind</h3>
<div class="tsd-signature tsd-kind-icon">bind<span class="tsd-signature-symbol">:</span> <a href="../classes/componentevents.html" class="tsd-signature-type">ComponentEvents</a></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#bind">bind</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L270">ui/Base/Component.ts
:270</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Allows the component to bind events and execute them only when it is enabled.</p>
</div>
<dl class="tsd-comment-tags">
<dt>type</dt>
<dd><p>{Coveo.ComponentEvents}</p>
</dd>
</dl>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="componentoptionsmodel" class="tsd-anchor"></a>
<h3>component<wbr>Options<wbr>Model</h3>
<div class="tsd-signature tsd-kind-icon">component<wbr>Options<wbr>Model<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">ComponentOptionsModel</span></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#componentoptionsmodel">componentOptionsModel</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L294">ui/Base/Component.ts
:294</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Contains the state of options for different components. Mainly used by <a href="resultlink.html">ResultLink</a>.</p>
</div>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="componentstatemodel" class="tsd-anchor"></a>
<h3>component<wbr>State<wbr>Model</h3>
<div class="tsd-signature tsd-kind-icon">component<wbr>State<wbr>Model<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">ComponentStateModel</span></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#componentstatemodel">componentStateModel</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L282">ui/Base/Component.ts
:282</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Contains the state of different components (enabled vs disabled). Allows to get/set values. Triggers component state event when modified. Each component can listen to those events.</p>
</div>
</div>
</section>
<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 tsd-is-inherited">
<a name="querycontroller" class="tsd-anchor"></a>
<h3>query<wbr>Controller</h3>
<div class="tsd-signature tsd-kind-icon">query<wbr>Controller<span class="tsd-signature-symbol">:</span> <a href="../classes/querycontroller.html" class="tsd-signature-type">QueryController</a></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#querycontroller">queryController</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L286">ui/Base/Component.ts
:286</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Contains the singleton that allows to trigger queries.</p>
</div>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="querystatemodel" class="tsd-anchor"></a>
<h3>query<wbr>State<wbr>Model</h3>
<div class="tsd-signature tsd-kind-icon">query<wbr>State<wbr>Model<span class="tsd-signature-symbol">:</span> <a href="../classes/querystatemodel.html" class="tsd-signature-type">QueryStateModel</a></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#querystatemodel">queryStateModel</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L278">ui/Base/Component.ts
:278</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Contains the state of the query. Allows to get/set values. Trigger query state event when modified. Each component can listen to those events.</p>
</div>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="root" class="tsd-anchor"></a>
<h3>root</h3>
<div class="tsd-signature tsd-kind-icon">root<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">HTMLElement</span></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#root">root</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L274">ui/Base/Component.ts
:274</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>A reference to the root HTMLElement (the <a href="searchinterface.html">SearchInterface</a>).</p>
</div>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-property tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="searchinterface" class="tsd-anchor"></a>
<h3>search<wbr>Interface</h3>
<div class="tsd-signature tsd-kind-icon">search<wbr>Interface<span class="tsd-signature-symbol">:</span> <a href="searchinterface.html" class="tsd-signature-type">SearchInterface</a></div>
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#searchinterface">searchInterface</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L290">ui/Base/Component.ts
:290</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>A reference to the root of every component, the <a href="searchinterface.html">SearchInterface</a>.</p>
</div>
</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 tsd-is-inherited">
<h2>Accessors</h2>
<section class="tsd-panel tsd-member tsd-kind-get-signature tsd-parent-kind-coveo-component tsd-is-inherited">
<a name="usageanalytics" class="tsd-anchor"></a>
<h3>usage<wbr>Analytics</h3>
<ul class="tsd-signatures tsd-kind-get-signature tsd-parent-kind-coveo-component tsd-is-inherited">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">get</span> <span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/ianalyticsclient.html" class="tsd-signature-type">IAnalyticsClient</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<aside class="tsd-sources">
<p>Inherited from <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#usageanalytics">usageAnalytics</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Base/Component.ts#L343">ui/Base/Component.ts
:343</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>A reference to the <a href="analytics.html#client">Analytics.client</a>.</p>
</div>
</div>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/ianalyticsclient.html" class="tsd-signature-type">IAnalyticsClient</a></h4>
</li>
</ul>
</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.child" class="tsd-anchor"></a>
<h3>child</h3>
<div class="tsd-signature tsd-kind-icon">child<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L104">ui/Folding/Folding.ts
:104</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the field that determines whether a certain result is a child of another top result.</p>
</div>
<p><strong>Note:</strong></p>
<blockquote>
<p>In the index, the values of the corresponding field must:</p>
<ul>
<li>Contain alphanumerical characters only.</li>
<li>Contain no more than 60 characters.</li>
</ul>
</blockquote>
<p>Default value is <code>@foldingchild</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingchild</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-child='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.childfield" class="tsd-anchor"></a>
<h3>child<wbr>Field</h3>
<div class="tsd-signature tsd-kind-icon">child<wbr>Field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L121">ui/Folding/Folding.ts
:121</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>This option is deprecated. Instead, use the <a href="folding.html#options.parent">Folding.options.parent</a> option.</p>
</div>
<dl class="tsd-comment-tags">
<dt>deprecated</dt>
<dd></dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-child-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.enableexpand" class="tsd-anchor"></a>
<h3>enable<wbr>Expand</h3>
<div class="tsd-signature tsd-kind-icon">enable<wbr>Expand<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/Folding/Folding.ts#L176">ui/Folding/Folding.ts
:176</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies whether to add a callback function on the top result, allowing to make an additional query to load all
of its child results (e.g., to load all conversations of a given thread).</p>
</div>
<p>Concretely, the <a href="resultfolding.html"><code>ResultFolding</code></a> component uses this for its <strong>Show More</strong> link.</p>
<p>See also the <a href="folding.html#options.expandexpression"><code>expandExpression</code></a> and
<a href="folding.html#options.maximumexpandedresults"><code>maximumExpandedResults</code></a> options.</p>
<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-expand='true'
data-enable-expand='false'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.expandexpression" class="tsd-anchor"></a>
<h3>expand<wbr>Expression</h3>
<div class="tsd-signature tsd-kind-icon">expand<wbr>Expression<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L183">ui/Folding/Folding.ts
:183</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>If the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a> option is <code>true</code>, specifies a custom constant
expression to send when querying the expanded results.</p>
</div>
<p>Default value is <code>undefined</code>.</p>
<dl class="tsd-comment-tags">
<dt>Only effective when</dt>
<dd><p><a href="folding.html#options.enableexpand"><code>enableExpand</code></a> is <a href="https://developer.mozilla.org/en-US/docs/Glossary/Truthy">truthy</a></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-expand-expression='foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.field" class="tsd-anchor"></a>
<h3>field</h3>
<div class="tsd-signature tsd-kind-icon">field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L93">ui/Folding/Folding.ts
:93</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the name of the field on which to do the folding.</p>
</div>
<p>Specifying a value for this option is required for this component to work.</p>
<p><strong>Note:</strong></p>
<blockquote>
<p>In an Elasticsearch index, the corresponding field must be configured as a <em>Facet</em> field
(see <a href="https://docs.coveo.com/en/1982/">Add or Edit Fields</a>).
This limitation does not apply to Coveo indexes.</p>
</blockquote>
<p>Default value is <code>@foldingcollection</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingcollection</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.getmoreresults" class="tsd-anchor"></a>
<h3>get<wbr>More<wbr>Results</h3>
<div class="tsd-signature tsd-kind-icon">get<wbr>More<wbr>Results<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L242">ui/Folding/Folding.ts
:242</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the function that manages the folding of all results.</p>
</div>
<p>Default value is:</p>
<pre><code class="lang-javascript">Coveo.Folding.defaultGetMoreResults = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">results</span>) </span>{
<span class="hljs-comment">// The results are flat, just do the folding.</span>
<span class="hljs-keyword">return</span> Coveo.Folding.foldWithParent(results);
}
</code></pre>
</div>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter-siganture">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable tsd-is-not-exported">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>results<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IQueryResult[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IQueryResult[]</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>results: <span class="tsd-signature-type">IQueryResult[]</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">IQueryResult[]</span></h4>
</li>
</ul>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.getresult" class="tsd-anchor"></a>
<h3>get<wbr>Result</h3>
<div class="tsd-signature tsd-kind-icon">get<wbr>Result<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L226">ui/Folding/Folding.ts
:226</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the function that manages the individual folding of each result.</p>
</div>
<p>Default value is:</p>
<pre><code class="lang-javascript"><span class="hljs-keyword">var</span> results = result.childResults || [];
<span class="hljs-comment">// Add the top result at the top of the list.</span>
results.unshift(result);
<span class="hljs-comment">// Empty childResults just to clean it.</span>
result.childResults = [];
<span class="hljs-comment">// Fold those results.</span>
results = Coveo.Folding.foldWithParent(results);
<span class="hljs-comment">// The first result is the top one.</span>
<span class="hljs-keyword">var</span> topResult = results.shift();
<span class="hljs-comment">// All other results are childResults.</span>
topResult.childResults = results;
<span class="hljs-keyword">return</span> topResult;
</code></pre>
<p>You can pre-process all the result with this option in the <a href="../globals.html#init"><code>init</code></a> call of your search interface:</p>
<pre><code class="lang-javascript">Coveo.init(<span class="hljs-built_in">document</span>.querySelector(<span class="hljs-string">'#search'</span>), {
<span class="hljs-attr">Folding</span>: {
<span class="hljs-attr">getResult</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">result</span>) </span>{
result = Coveo.Folding.defaultGetResult(result);
<span class="hljs-comment">// Your code here</span>
}
}
})
</code></pre>
</div>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter-siganture">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable tsd-is-not-exported">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>result<span class="tsd-signature-symbol">: </span><a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>result: <a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></h4>
</li>
</ul>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.maximumexpandedresults" class="tsd-anchor"></a>
<h3>maximum<wbr>Expanded<wbr>Results</h3>
<div class="tsd-signature tsd-kind-icon">maximum<wbr>Expanded<wbr>Results<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L191">ui/Folding/Folding.ts
:191</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>If the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a> option is <code>true</code>, specifies the maximum number of
results to load when expanding.</p>
</div>
<p>Default value is <code>100</code>. Minimum value is <code>1</code>.</p>
<dl class="tsd-comment-tags">
<dt>Only effective when</dt>
<dd><p><a href="folding.html#options.enableexpand"><code>enableExpand</code></a> is <a href="https://developer.mozilla.org/en-US/docs/Glossary/Truthy">truthy</a></p>
</dd>
<dt>Minimum</dt>
<dd><p><code>1</code></p>
</dd>
<dt>Default</dt>
<dd><p><code>100</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-maximum-expanded-results='10'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.parent" class="tsd-anchor"></a>
<h3>parent</h3>
<div class="tsd-signature tsd-kind-icon">parent<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L115">ui/Folding/Folding.ts
:115</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the field that determines whether a certain result is a top result containing other child results.</p>
</div>
<p><strong>Note:</strong></p>
<blockquote>
<p>In the index, the values of the corresponding field must:</p>
<ul>
<li>Contain alphanumerical characters only.</li>
<li>Contain no more than 60 characters.</li>
</ul>
</blockquote>
<p>Default value is <code>@foldingparent</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingparent</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-parent='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.parentfield" class="tsd-anchor"></a>
<h3>parent<wbr>Field</h3>
<div class="tsd-signature tsd-kind-icon">parent<wbr>Field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L128">ui/Folding/Folding.ts
:128</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>This option is deprecated. Instead, use the <a href="folding.html#options.child">Folding.options.child</a> option.</p>
</div>
<dl class="tsd-comment-tags">
<dt>deprecated</dt>
<dd></dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-parent-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.range" class="tsd-anchor"></a>
<h3>range</h3>
<div class="tsd-signature tsd-kind-icon">range<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L143">ui/Folding/Folding.ts
:143</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the maximum number of child results to fold.</p>
</div>
<p><strong>Example:</strong></p>
<blockquote>
<p>For an email thread with a total of 20 messages, using the default value of <code>2</code> means that the component loads
up to a maximum of 2 child messages under the original message, unless the end user expands the entire
conversation using the <strong>Show More</strong> link (see the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a>
option).</p>
</blockquote>
<p>Default value is <code>2</code>. Minimum value is <code>0</code>.</p>
<dl class="tsd-comment-tags">
<dt>Minimum</dt>
<dd><p><code>0</code></p>
</dd>
<dt>Default</dt>
<dd><p><code>2</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-range='10'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.rearrange" class="tsd-anchor"></a>
<h3>rearrange</h3>
<div class="tsd-signature tsd-kind-icon">rearrange<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">SortCriteria</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L163">ui/Folding/Folding.ts
:163</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the sort criteria to apply to the top result and its child results (e.g., <code>date ascending</code>,
<code>@myfield descending</code>, etc.). See <a href="https://docs.coveo.com/en/13#operation/searchUsingPost-sortCriteria">sortCriteria</a>.</p>
</div>
<p>This option works from the results returned by the index. This means that if only the three most relevant folded results are returned by the index
and you choose to rearrange the folded results by date, then the three most relevant results will be rearranged by date,
meaning that the first folded result is not necessarily the oldest or newest item.</p>
<p>However, since clicking on the <code>Show More</code> button triggers a new query, you would receive new results based on the sort criteria of this option.</p>
<p><strong>Example</strong></p>
<blockquote>
<p>If you are folding email results by conversation and you specify <code>date descending</code> as the <code>rearrange</code> value of
the <code>Folding</code> component, the component re-arranges email conversations so that the newest email is always the
top result. Specifying <code>date ascending</code> instead always makes the original email the top result, as it is also
necessarily the oldest.</p>
</blockquote>
<p>By default, the component displays the results in the order that the index returns them.</p>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-object-literal tsd-parent-kind-class tsd-is-inherited tsd-is-static">
<a name="options" class="tsd-anchor"></a>
<h3><span class="tsd-flag ts-flagStatic">Static</span> options</h3>
<div class="tsd-signature tsd-kind-icon">options<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">object</span></div>
<aside class="tsd-sources">
<p>Inherited from <a href="folding.html">Folding</a>.<a href="folding.html#options">options</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L80">ui/Folding/Folding.ts
:80</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>The options for the component</p>
</div>
<dl class="tsd-comment-tags">
<dt>componentoptions</dt>
<dd></dd>
</dl>
</div>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.child" class="tsd-anchor"></a>
<h3>child</h3>
<div class="tsd-signature tsd-kind-icon">child<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L104">ui/Folding/Folding.ts
:104</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the field that determines whether a certain result is a child of another top result.</p>
</div>
<p><strong>Note:</strong></p>
<blockquote>
<p>In the index, the values of the corresponding field must:</p>
<ul>
<li>Contain alphanumerical characters only.</li>
<li>Contain no more than 60 characters.</li>
</ul>
</blockquote>
<p>Default value is <code>@foldingchild</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingchild</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-child='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.childfield" class="tsd-anchor"></a>
<h3>child<wbr>Field</h3>
<div class="tsd-signature tsd-kind-icon">child<wbr>Field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L121">ui/Folding/Folding.ts
:121</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>This option is deprecated. Instead, use the <a href="folding.html#options.parent">Folding.options.parent</a> option.</p>
</div>
<dl class="tsd-comment-tags">
<dt>deprecated</dt>
<dd></dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-child-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.enableexpand" class="tsd-anchor"></a>
<h3>enable<wbr>Expand</h3>
<div class="tsd-signature tsd-kind-icon">enable<wbr>Expand<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/Folding/Folding.ts#L176">ui/Folding/Folding.ts
:176</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies whether to add a callback function on the top result, allowing to make an additional query to load all
of its child results (e.g., to load all conversations of a given thread).</p>
</div>
<p>Concretely, the <a href="resultfolding.html"><code>ResultFolding</code></a> component uses this for its <strong>Show More</strong> link.</p>
<p>See also the <a href="folding.html#options.expandexpression"><code>expandExpression</code></a> and
<a href="folding.html#options.maximumexpandedresults"><code>maximumExpandedResults</code></a> options.</p>
<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-expand='true'
data-enable-expand='false'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.expandexpression" class="tsd-anchor"></a>
<h3>expand<wbr>Expression</h3>
<div class="tsd-signature tsd-kind-icon">expand<wbr>Expression<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">string</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L183">ui/Folding/Folding.ts
:183</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>If the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a> option is <code>true</code>, specifies a custom constant
expression to send when querying the expanded results.</p>
</div>
<p>Default value is <code>undefined</code>.</p>
<dl class="tsd-comment-tags">
<dt>Only effective when</dt>
<dd><p><a href="../classes/foldingforthread.html#options.enableexpand"><code>enableExpand</code></a> is <a href="https://developer.mozilla.org/en-US/docs/Glossary/Truthy">truthy</a></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-expand-expression='foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.field" class="tsd-anchor"></a>
<h3>field</h3>
<div class="tsd-signature tsd-kind-icon">field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L93">ui/Folding/Folding.ts
:93</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the name of the field on which to do the folding.</p>
</div>
<p>Specifying a value for this option is required for this component to work.</p>
<p><strong>Note:</strong></p>
<blockquote>
<p>In an Elasticsearch index, the corresponding field must be configured as a <em>Facet</em> field
(see <a href="https://docs.coveo.com/en/1982/">Add or Edit Fields</a>).
This limitation does not apply to Coveo indexes.</p>
</blockquote>
<p>Default value is <code>@foldingcollection</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingcollection</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.getmoreresults" class="tsd-anchor"></a>
<h3>get<wbr>More<wbr>Results</h3>
<div class="tsd-signature tsd-kind-icon">get<wbr>More<wbr>Results<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L242">ui/Folding/Folding.ts
:242</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the function that manages the folding of all results.</p>
</div>
<p>Default value is:</p>
<pre><code class="lang-javascript">Coveo.Folding.defaultGetMoreResults = <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">results</span>) </span>{
<span class="hljs-comment">// The results are flat, just do the folding.</span>
<span class="hljs-keyword">return</span> Coveo.Folding.foldWithParent(results);
}
</code></pre>
</div>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter-siganture">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable tsd-is-not-exported">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>results<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IQueryResult[]</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IQueryResult[]</span></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>results: <span class="tsd-signature-type">IQueryResult[]</span></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">IQueryResult[]</span></h4>
</li>
</ul>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.getresult" class="tsd-anchor"></a>
<h3>get<wbr>Result</h3>
<div class="tsd-signature tsd-kind-icon">get<wbr>Result<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">function</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L226">ui/Folding/Folding.ts
:226</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the function that manages the individual folding of each result.</p>
</div>
<p>Default value is:</p>
<pre><code class="lang-javascript"><span class="hljs-keyword">var</span> results = result.childResults || [];
<span class="hljs-comment">// Add the top result at the top of the list.</span>
results.unshift(result);
<span class="hljs-comment">// Empty childResults just to clean it.</span>
result.childResults = [];
<span class="hljs-comment">// Fold those results.</span>
results = Coveo.Folding.foldWithParent(results);
<span class="hljs-comment">// The first result is the top one.</span>
<span class="hljs-keyword">var</span> topResult = results.shift();
<span class="hljs-comment">// All other results are childResults.</span>
topResult.childResults = results;
<span class="hljs-keyword">return</span> topResult;
</code></pre>
<p>You can pre-process all the result with this option in the <a href="../globals.html#init"><code>init</code></a> call of your search interface:</p>
<pre><code class="lang-javascript">Coveo.init(<span class="hljs-built_in">document</span>.querySelector(<span class="hljs-string">'#search'</span>), {
<span class="hljs-attr">Folding</span>: {
<span class="hljs-attr">getResult</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">result</span>) </span>{
result = Coveo.Folding.defaultGetResult(result);
<span class="hljs-comment">// Your code here</span>
}
}
})
</code></pre>
</div>
<div class="tsd-type-declaration">
<h4>Type declaration</h4>
<ul class="tsd-parameters">
<li class="tsd-parameter-siganture">
<ul class="tsd-signatures tsd-kind-type-literal tsd-parent-kind-variable tsd-is-not-exported">
<li class="tsd-signature tsd-kind-icon"><span class="tsd-signature-symbol">(</span>result<span class="tsd-signature-symbol">: </span><a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<h4 class="tsd-parameters-title">Parameters</h4>
<ul class="tsd-parameters">
<li>
<h5>result: <a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></h5>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="../interfaces/iqueryresult.html" class="tsd-signature-type">IQueryResult</a></h4>
</li>
</ul>
</li>
</ul>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.maximumexpandedresults" class="tsd-anchor"></a>
<h3>maximum<wbr>Expanded<wbr>Results</h3>
<div class="tsd-signature tsd-kind-icon">maximum<wbr>Expanded<wbr>Results<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L191">ui/Folding/Folding.ts
:191</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>If the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a> option is <code>true</code>, specifies the maximum number of
results to load when expanding.</p>
</div>
<p>Default value is <code>100</code>. Minimum value is <code>1</code>.</p>
<dl class="tsd-comment-tags">
<dt>Only effective when</dt>
<dd><p><a href="../classes/foldingforthread.html#options.enableexpand"><code>enableExpand</code></a> is <a href="https://developer.mozilla.org/en-US/docs/Glossary/Truthy">truthy</a></p>
</dd>
<dt>Minimum</dt>
<dd><p><code>1</code></p>
</dd>
<dt>Default</dt>
<dd><p><code>100</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-maximum-expanded-results='10'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.parent" class="tsd-anchor"></a>
<h3>parent</h3>
<div class="tsd-signature tsd-kind-icon">parent<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L115">ui/Folding/Folding.ts
:115</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the field that determines whether a certain result is a top result containing other child results.</p>
</div>
<p><strong>Note:</strong></p>
<blockquote>
<p>In the index, the values of the corresponding field must:</p>
<ul>
<li>Contain alphanumerical characters only.</li>
<li>Contain no more than 60 characters.</li>
</ul>
</blockquote>
<p>Default value is <code>@foldingparent</code>.</p>
<dl class="tsd-comment-tags">
<dt>Default</dt>
<dd><p><code>@foldingparent</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-parent='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.parentfield" class="tsd-anchor"></a>
<h3>parent<wbr>Field</h3>
<div class="tsd-signature tsd-kind-icon">parent<wbr>Field<span class="tsd-signature-symbol">:</span> <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L128">ui/Folding/Folding.ts
:128</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>This option is deprecated. Instead, use the <a href="folding.html#options.child">Folding.options.child</a> option.</p>
</div>
<dl class="tsd-comment-tags">
<dt>deprecated</dt>
<dd></dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-parent-field='@foo'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.range" class="tsd-anchor"></a>
<h3>range</h3>
<div class="tsd-signature tsd-kind-icon">range<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">number</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L143">ui/Folding/Folding.ts
:143</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<dl class="tsd-deprecated">
</dl>
<div class="lead">
<p>Specifies the maximum number of child results to fold.</p>
</div>
<p><strong>Example:</strong></p>
<blockquote>
<p>For an email thread with a total of 20 messages, using the default value of <code>2</code> means that the component loads
up to a maximum of 2 child messages under the original message, unless the end user expands the entire
conversation using the <strong>Show More</strong> link (see the <a href="folding.html#options.enableexpand"><code>enableExpand</code></a>
option).</p>
</blockquote>
<p>Default value is <code>2</code>. Minimum value is <code>0</code>.</p>
<dl class="tsd-comment-tags">
<dt>Minimum</dt>
<dd><p><code>0</code></p>
</dd>
<dt>Default</dt>
<dd><p><code>2</code></p>
</dd>
</dl>
</div>
<div class="tsd-panel">
<div class="tsd-signature-type">Markup configuration example(s) :</div>
<pre>data-range='10'</pre>
</div>
</section>
<section class="tsd-panel tsd-member tsd-kind-variable tsd-parent-kind-object-literal">
<a name="options.rearrange" class="tsd-anchor"></a>
<h3>rearrange</h3>
<div class="tsd-signature tsd-kind-icon">rearrange<span class="tsd-signature-symbol">:</span> <span class="tsd-signature-type">SortCriteria</span></div>
<aside class="tsd-sources">
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L163">ui/Folding/Folding.ts
:163</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Specifies the sort criteria to apply to the top result and its child results (e.g., <code>date ascending</code>,
<code>@myfield descending</code>, etc.). See <a href="https://docs.coveo.com/en/13#operation/searchUsingPost-sortCriteria">sortCriteria</a>.</p>
</div>
<p>This option works from the results returned by the index. This means that if only the three most relevant folded results are returned by the index
and you choose to rearrange the folded results by date, then the three most relevant results will be rearranged by date,
meaning that the first folded result is not necessarily the oldest or newest item.</p>
<p>However, since clicking on the <code>Show More</code> button triggers a new query, you would receive new results based on the sort criteria of this option.</p>
<p><strong>Example</strong></p>
<blockquote>
<p>If you are folding email results by conversation and you specify <code>date descending</code> as the <code>rearrange</code> value of
the <code>Folding</code> component, the component re-arranges email conversations so that the newest email is always the
top result. Specifying <code>date ascending</code> instead always makes the original email the top result, as it is also
necessarily the oldest.</p>
</blockquote>
<p>By default, the component displays the results in the order that the index returns them.</p>
</div>
</section>
</section>
</section>
<section class="tsd-panel-group tsd-member-group ">
<h2>Constructors</h2>
<section class="tsd-panel tsd-member tsd-kind-constructor tsd-parent-kind-coveo-component tsd-is-overwrite">
<a name="constructor" class="tsd-anchor"></a>
<h3>constructor</h3>
<ul class="tsd-signatures tsd-kind-constructor tsd-parent-kind-coveo-component tsd-is-overwrite">
<li class="tsd-signature tsd-kind-icon">new <wbr>Folding<span class="tsd-signature-symbol">(</span>element<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">HTMLElement</span>, options<span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IFoldingOptions</span>, bindings<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentbindings.html" class="tsd-signature-type">IComponentBindings</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="folding.html" class="tsd-signature-type">Folding</a></li>
</ul>
<ul class="tsd-descriptions">
<li class="tsd-description">
<aside class="tsd-sources">
<p>Overwrites <a href="../classes/component.html">Component</a>.<a href="../classes/component.html#constructor">constructor</a></p>
<ul>
<li>Defined in
<a href="https://github.com/coveo/search-ui/tree/master/src/ui/Folding/Folding.ts#L245">ui/Folding/Folding.ts
:245</a></li>
</ul>
</aside>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>Creates a new <code>Folding</code> component.</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 class="lead">
<p>The HTMLElement on which to instantiate the component.</p>
</div>
</div>
</li>
<li>
<h5>options: <span class="tsd-signature-type">IFoldingOptions</span></h5>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>The options for the <code>Folding</code> component.</p>
</div>
</div>
</li>
<li>
<h5><span class="tsd-flag ts-flagOptional">Optional</span> bindings: <a href="../interfaces/icomponentbindings.html" class="tsd-signature-type">IComponentBindings</a></h5>
<div class="tsd-comment tsd-typography">
<div class="lead">
<p>The bindings that the component requires to function normally. If not set, these will be
automatically resolved (with a slower execution time).</p>
</div>
</div>
</li>
</ul>
<h4 class="tsd-returns-title">Returns <a href="folding.html" class="tsd-signature-type">Folding</a></h4>
</li>
</ul>
</section>
</section>
<section class="tsd-panel tsd-hierarchy">
<h3>Hierarchy</h3>
<ul class="tsd-hierarchy">
<li>
<a href="../classes/component.html" class="tsd-signature-type">Component</a>
</li>
</ul>
</section>
<footer class="with-border-bottom">
<div class="container">
<h2>Legend</h2>
<div class="tsd-legend-group">
<ul class="tsd-legend">
<li class="tsd-kind-module"><span class="tsd-kind-icon">Module</span></li>
<li class="tsd-kind-object-literal"><span class="tsd-kind-icon">Object literal</span></li>
<li class="tsd-kind-variable"><span class="tsd-kind-icon">Variable</span></li>
<li class="tsd-kind-function"><span class="tsd-kind-icon">Function</span></li>
<li class="tsd-kind-function tsd-has-type-parameter"><span class="tsd-kind-icon">Function with type parameter</span></li>
<li class="tsd-kind-index-signature"><span class="tsd-kind-icon">Index signature</span></li>
<li class="tsd-kind-type-alias"><span class="tsd-kind-icon">Type alias</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-enum"><span class="tsd-kind-icon">Enumeration</span></li>
<li class="tsd-kind-enum-member"><span class="tsd-kind-icon">Enumeration member</span></li>
<li class="tsd-kind-property tsd-parent-kind-enum"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-enum"><span class="tsd-kind-icon">Method</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-interface"><span class="tsd-kind-icon">Interface</span></li>
<li class="tsd-kind-interface tsd-has-type-parameter"><span class="tsd-kind-icon">Interface with type parameter</span></li>
<li class="tsd-kind-constructor tsd-parent-kind-interface"><span class="tsd-kind-icon">Constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-interface"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-interface"><span class="tsd-kind-icon">Method</span></li>
<li class="tsd-kind-index-signature tsd-parent-kind-interface"><span class="tsd-kind-icon">Index signature</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-class"><span class="tsd-kind-icon">Class</span></li>
<li class="tsd-kind-class tsd-has-type-parameter"><span class="tsd-kind-icon">Class with type parameter</span></li>
<li class="tsd-kind-constructor tsd-parent-kind-class"><span class="tsd-kind-icon">Constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-class"><span class="tsd-kind-icon">Property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class"><span class="tsd-kind-icon">Method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class"><span class="tsd-kind-icon">Accessor</span></li>
<li class="tsd-kind-index-signature tsd-parent-kind-class"><span class="tsd-kind-icon">Index signature</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-constructor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited constructor</span></li>
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-inherited"><span class="tsd-kind-icon">Inherited accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-protected"><span class="tsd-kind-icon">Protected accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private property</span></li>
<li class="tsd-kind-method tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private method</span></li>
<li class="tsd-kind-accessor tsd-parent-kind-class tsd-is-private"><span class="tsd-kind-icon">Private accessor</span></li>
</ul>
<ul class="tsd-legend">
<li class="tsd-kind-property tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static property</span></li>
<li class="tsd-kind-call-signature tsd-parent-kind-class tsd-is-static"><span class="tsd-kind-icon">Static method</span></li>
</ul>
</div>
</div>
</footer> </div>
</div>
</div>
<script src="../assets/js/main.js"></script>
<script src="../assets/js/generateMetaData.js"></script>
</body>
</html>