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>ComponentOptions | 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-class"> <a href="componentoptions.html" class="tsd-kind-icon">Component<wbr>Options</a> <ul> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildbooleanoption" class="tsd-kind-icon">build<wbr>Boolean<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildcoloroption" class="tsd-kind-icon">build<wbr>Color<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildfieldconditionoption" class="tsd-kind-icon">build<wbr>Field<wbr>Condition<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildfieldoption" class="tsd-kind-icon">build<wbr>Field<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildfieldsoption" class="tsd-kind-icon">build<wbr>Fields<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildhelperoption" class="tsd-kind-icon">build<wbr>Helper<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildiconoption" class="tsd-kind-icon">build<wbr>Icon<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a href="componentoptions.html#buildjsonobjectoption" class="tsd-kind-icon">build<wbr>Json<wbr>Object<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a href="componentoptions.html#buildjsonoption" class="tsd-kind-icon">build<wbr>Json<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a href="componentoptions.html#buildlistoption" class="tsd-kind-icon">build<wbr>List<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildlocalizedstringoption" class="tsd-kind-icon">build<wbr>Localized<wbr>String<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildnumberoption" class="tsd-kind-icon">build<wbr>Number<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildqueryexpressionoption" class="tsd-kind-icon">build<wbr>Query<wbr>Expression<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#buildselectoroption" class="tsd-kind-icon">build<wbr>Selector<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a href="componentoptions.html#buildstringoption" class="tsd-kind-icon">build<wbr>String<wbr>Option</a> </li> <li class=" tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a href="componentoptions.html#initcomponentoptions" class="tsd-kind-icon">init<wbr>Component<wbr>Options</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="componentoptions.html">ComponentOptions</a> </li> </ul> <h1>Class ComponentOptions</h1> </div> </div> <section class="tsd-panel tsd-comment"> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>The <code>ComponentOptions</code> static class contains methods allowing the Coveo JavaScript Search Framework to initialize component options.</p> </div> <p>Typically, each <a href="component.html"><code>Component</code></a> that exposes a set of options contains a static <code>options</code> property.</p> <p>This property "builds" each option using the <code>ComponentOptions</code> method corresponding to its type (e.g., <a href="componentoptions.html#buildbooleanoption"><code>buildBooleanOption</code></a>, <a href="componentoptions.html#buildfieldoption"><code>buildFieldOption</code></a>, <a href="componentoptions.html#buildstringoption"><code>buildStringOption</code></a>, etc.)</p> </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-class tsd-is-static"><a href="componentoptions.html#buildbooleanoption" class="tsd-kind-icon">build<wbr>Boolean<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildcoloroption" class="tsd-kind-icon">build<wbr>Color<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildfieldconditionoption" class="tsd-kind-icon">build<wbr>Field<wbr>Condition<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildfieldoption" class="tsd-kind-icon">build<wbr>Field<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildfieldsoption" class="tsd-kind-icon">build<wbr>Fields<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildhelperoption" class="tsd-kind-icon">build<wbr>Helper<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildiconoption" class="tsd-kind-icon">build<wbr>Icon<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"><a href="componentoptions.html#buildjsonobjectoption" class="tsd-kind-icon">build<wbr>Json<wbr>Object<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"><a href="componentoptions.html#buildjsonoption" class="tsd-kind-icon">build<wbr>Json<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"><a href="componentoptions.html#buildlistoption" class="tsd-kind-icon">build<wbr>List<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildlocalizedstringoption" class="tsd-kind-icon">build<wbr>Localized<wbr>String<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildnumberoption" class="tsd-kind-icon">build<wbr>Number<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildqueryexpressionoption" class="tsd-kind-icon">build<wbr>Query<wbr>Expression<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#buildselectoroption" class="tsd-kind-icon">build<wbr>Selector<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"><a href="componentoptions.html#buildstringoption" class="tsd-kind-icon">build<wbr>String<wbr>Option</a></li> <li class="tsd-kind-method tsd-parent-kind-class tsd-is-static"><a href="componentoptions.html#initcomponentoptions" class="tsd-kind-icon">init<wbr>Component<wbr>Options</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-class tsd-is-static"> <a name="buildbooleanoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Boolean<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Boolean<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><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><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">boolean</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/Base/ComponentOptions.ts#L68">ui/Base/ComponentOptions.ts :68</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a boolean option.</p> </div> <p><strong>Markup Examples:</strong></p> <blockquote> <p><code>data-foo="true"</code></p> </blockquote> <blockquote> <p><code>data-foo="false"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">boolean</span><span class="tsd-signature-symbol">></span></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">boolean</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildcoloroption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Color<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Color<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><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-symbol">: </span><span class="tsd-signature-type">string</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/Base/ComponentOptions.ts#L146">ui/Base/ComponentOptions.ts :146</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a color option.</p> </div> <p>Normally, this simply builds a string that matches a CSS color.</p> <p><strong>Note:</strong></p> <blockquote> <p>In the markup, this offers no advantage over using a plain string. This is mostly useful for the Coveo JavaScript Interface Editor.</p> </blockquote> <p><strong>Markup Examples:</strong></p> <blockquote> <p><code>data-foo="coveo-sprites-user"</code></p> </blockquote> <blockquote> <p><code>data-foo="coveo-sprites-database"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">></span></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildfieldconditionoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Field<wbr>Condition<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Field<wbr>Condition<wbr>Option<span class="tsd-signature-symbol">(</span><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IFieldConditionOption[]</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/Base/ComponentOptions.ts#L401">ui/Base/ComponentOptions.ts :401</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a field condition option.</p> </div> <p>A field condition option defines a field-based condition that must be dynamically evaluated against, and satisfied by a query result item in order to initialize a result template component.</p> <p><strong>Markup Example:</strong></p> <pre><code class="lang-html">data-condition-field-author="Alice Smith, Bob Jones" data-condition-field-not-filetype="pdf"` </code></pre> </div> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">IFieldConditionOption[]</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildfieldoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Field<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Field<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptionsfieldoptionargs.html" class="tsd-signature-type">IComponentOptionsFieldOptionArgs</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</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/Base/ComponentOptions.ts#L253">ui/Base/ComponentOptions.ts :253</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a field option.</p> </div> <p>A field option validates whether the field has a valid name. This means that the string must start with the <code>@</code> character.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo="@bar"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptionsfieldoptionargs.html" class="tsd-signature-type">IComponentOptionsFieldOptionArgs</a></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <a href="../interfaces/ifieldoption.html" class="tsd-signature-type">IFieldOption</a></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildfieldsoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Fields<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Fields<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptionsfieldsoptionargs.html" class="tsd-signature-type">IComponentOptionsFieldsOptionArgs</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">IFieldOption[]</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/Base/ComponentOptions.ts#L269">ui/Base/ComponentOptions.ts :269</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds an array of fields option.</p> </div> <p>As with all options that expect an array, you should use commas to delimit the different values.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo="@bar,@baz"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptionsfieldsoptionargs.html" class="tsd-signature-type">IComponentOptionsFieldsOptionArgs</a></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">IFieldOption[]</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildhelperoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Helper<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Helper<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><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-symbol">: </span><span class="tsd-signature-type">string</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/Base/ComponentOptions.ts#L169">ui/Base/ComponentOptions.ts :169</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a helper option.</p> </div> <p>Normally, this simply builds a string that matches the name of a template helper.</p> <p><strong>Note:</strong></p> <blockquote> <p>In the markup, this offers no advantage over using a plain string. This is mostly useful for the Coveo JavaScript Interface Editor.</p> </blockquote> <p><strong>Markup Examples:</strong></p> <blockquote> <p><code>data-foo="date"</code></p> </blockquote> <blockquote> <p><code>data-foo="dateTime"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">></span></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildiconoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Icon<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Icon<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><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-symbol">: </span><span class="tsd-signature-type">string</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/Base/ComponentOptions.ts#L123">ui/Base/ComponentOptions.ts :123</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds an icon option.</p> </div> <p>This takes an SVG icon name, validates it and returns the name of the icon. <strong>Markup Examples:</strong></p> <blockquote> <p><code>data-foo="search"</code></p> </blockquote> <blockquote> <p><code>data-foo="facet-expand"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">string</span><span class="tsd-signature-symbol">></span></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a name="buildjsonobjectoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Json<wbr>Object<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Json<wbr>Object<wbr>Option<T><span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">IComponentJsonObjectOption</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">></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/Base/ComponentOptions.ts#L209">ui/Base/ComponentOptions.ts :209</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <dl class="tsd-deprecated"> </dl> <dl class="tsd-comment-tags"> <dt>deprecated</dt> <dd><p>Use buildJsonOption instead</p> </dd> <dt>deprecatedsince</dt> <dd><p><a href="https://docs.coveo.com/en/373/#december-2017-release-v236794">2017 Javascript Search Framework Releases</a></p> </dd> </dl> </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><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <span class="tsd-signature-type">IComponentJsonObjectOption</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">></span></h5> </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-class tsd-has-type-parameter tsd-is-static"> <a name="buildjsonoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Json<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Json<wbr>Option<T><span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><span class="tsd-signature-type">IComponentJsonObjectOption</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">></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/Base/ComponentOptions.ts#L200">ui/Base/ComponentOptions.ts :200</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Tries to parse a stringified JSON option.</p> </div> <p>If unsuccessful (because of invalid syntax), the JSON option is ignored altogether, and the console displays a warning message.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo='{"bar" : "baz"}'</code></p> </blockquote> <p><strong>Note:</strong></p> <p>A JSON option can always be set as a property in the <code>init</code> call of the framework rather than as a <code>data-</code> property in the corresponding HTMLElement markup.</p> <p><strong>Initialization Example:</strong></p> <pre><code><span class="hljs-selector-tag">Coveo</span><span class="hljs-selector-class">.init</span>(<span class="hljs-selector-tag">root</span>, { <span class="hljs-attribute">Facet </span>: { foo : { <span class="hljs-string">"bar"</span> : <span class="hljs-string">"baz"</span> } } }) </code></pre> </div> <h4 class="tsd-type-parameters-title">Type parameters</h4> <ul class="tsd-type-parameters"> <li> <h4>T<span class="tsd-signature-symbol">: </span><a href="../interfaces/istringmap.html" class="tsd-signature-type">IStringMap</a><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">any</span><span class="tsd-signature-symbol">></span></h4> </li> </ul> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <span class="tsd-signature-type">IComponentJsonObjectOption</span><span class="tsd-signature-symbol"><</span><span class="tsd-signature-type">T</span><span class="tsd-signature-symbol">></span></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <a name="buildlistoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>List<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-has-type-parameter tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>List<wbr>Option<T><span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptionslistoptionargs.html" class="tsd-signature-type">IComponentOptionsListOptionArgs</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">T[]</span><span class="tsd-signature-symbol"> | </span><span class="tsd-signature-type">string[]</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/Base/ComponentOptions.ts#L301">ui/Base/ComponentOptions.ts :301</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds an array of strings option.</p> </div> <p>As with all options that expect an array, you should use commas to delimit the different values.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo="bar,baz"</code></p> </blockquote> </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><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptionslistoptionargs.html" class="tsd-signature-type">IComponentOptionsListOptionArgs</a></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">T[]</span> <span class="tsd-signature-symbol"> | </span> <span class="tsd-signature-type">string[]</span> </h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildlocalizedstringoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Localized<wbr>String<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Localized<wbr>String<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentlocalizedstringoptionargs.html" class="tsd-signature-type">IComponentLocalizedStringOptionArgs</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">string</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/Base/ComponentOptions.ts#L232">ui/Base/ComponentOptions.ts :232</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a localized string option.</p> </div> <p>A localized string option can be any arbitrary string.</p> <p>When parsing the value, the Coveo JavaScript Search Framework tries to load the localization for that string, if it is available.</p> <p>If it is not available, it returns the non-localized value.</p> <p>This should be used for options that will be rendered directly to the end users.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo="bar"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentlocalizedstringoptionargs.html" class="tsd-signature-type">IComponentLocalizedStringOptionArgs</a></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">string</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildnumberoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Number<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Number<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptionsnumberoptionargs.html" class="tsd-signature-type">IComponentOptionsNumberOptionArgs</a><span class="tsd-signature-symbol">)</span><span class="tsd-signature-symbol">: </span><span class="tsd-signature-type">number</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/Base/ComponentOptions.ts#L90">ui/Base/ComponentOptions.ts :90</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a number option.</p> </div> <p>A number option can be an integer or a float in the markup.</p> <p><strong>Note:</strong></p> <blockquote> <p>To build a float option, you need to set the <code>float</code> property in the <a href="../interfaces/icomponentoptionsnumberoptionargs.html"><code>IComponentOptionsNumberOptionArgs</code></a> to <code>true</code>.</p> </blockquote> <p><strong>Markup Examples:</strong></p> <blockquote> <p><code>data-foo="3"</code></p> </blockquote> <blockquote> <p><code>data-foo="1.5"</code></p> </blockquote> </div> <h4 class="tsd-parameters-title">Parameters</h4> <ul class="tsd-parameters"> <li> <h5><span class="tsd-flag ts-flagOptional">Optional</span> optionArgs: <a href="../interfaces/icomponentoptionsnumberoptionargs.html" class="tsd-signature-type">IComponentOptionsNumberOptionArgs</a></h5> <div class="tsd-comment tsd-typography"> <p>The arguments to apply when building the option.</p> </div> </li> </ul> <h4 class="tsd-returns-title">Returns <span class="tsd-signature-type">number</span></h4> <p>The resulting option value.</p> </li> </ul> </section> <section class="tsd-panel tsd-member tsd-kind-method tsd-parent-kind-class tsd-is-static"> <a name="buildqueryexpressionoption" class="tsd-anchor"></a> <h3><span class="tsd-flag ts-flagStatic">Static</span> build<wbr>Query<wbr>Expression<wbr>Option</h3> <ul class="tsd-signatures tsd-kind-method tsd-parent-kind-class tsd-is-static"> <li class="tsd-signature tsd-kind-icon">build<wbr>Query<wbr>Expression<wbr>Option<span class="tsd-signature-symbol">(</span>optionArgs<span class="tsd-signature-symbol">?: </span><a href="../interfaces/icomponentoptions.html" class="tsd-signature-type">IComponentOptions</a><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-symbol">: </span><a href="../globals.html#iqueryexpression" class="tsd-signature-type">IQueryExpression</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/Base/ComponentOptions.ts#L285">ui/Base/ComponentOptions.ts :285</a></li> </ul> </aside> <div class="tsd-comment tsd-typography"> <div class="lead"> <p>Builds a query expression option.</p> </div> <p>The query expression option should follow the <a href="https://docs.coveo.com/en/1552/">Coveo Cloud Query Syntax Reference</a>.</p> <p><strong>Markup Example:</strong></p> <blockquote> <p><code>data-foo=&quot