### Install and Run Sample Project Source: https://github.com/coveo/ui-kit/blob/main/samples/README.md Instructions for navigating to a sample directory, installing dependencies, and starting the development server. No platform credentials are required as samples use a demo organization. ```bash cd samples// pnpm install pnpm dev # or check the sample's README for the correct start command ``` -------------------------------- ### Install and Run Development Server Source: https://github.com/coveo/ui-kit/blob/main/samples/headless-ssr/commerce-nextjs-v4/README.md Installs project dependencies and starts the development server. Access the application at http://localhost:3000. ```bash npm install npm run dev ``` -------------------------------- ### React Quickstart for RGA Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/relevance-generative-answering.md This is a React quickstart example for integrating RGA. It demonstrates the basic setup and usage within a React component. ```tsx import "./App.css"; import { HeadlessLoaders, useHeadlessGenerativeAnswer, UseHeadlessGenerativeAnswerOptions, } from "@coveo/headless-react"; import { useEffect, useState } from "react"; function App() { const [searchEngine, setSearchEngine] = useState(null); const [answer, setAnswer] = useState(null); const headlessOptions: UseHeadlessGenerativeAnswerOptions = { // Add any specific options here if needed }; useEffect(() => { // Initialize the search engine (replace with your actual configuration) const initializeEngine = async () => { const engine = await getSearchEngine(); // Assuming getSearchEngine is defined elsewhere setSearchEngine(engine); }; initializeEngine(); }, []); useEffect(() => { if (!searchEngine) return; const answerGenerator = buildGeneratedAnswer(searchEngine, headlessOptions); setAnswer(answerGenerator); }, [searchEngine]); const { state } = useHeadlessGenerativeAnswer({ engine: searchEngine, options: headlessOptions, }); const { isLoading, error, data } = state; return (

Coveo RGA Quickstart

{isLoading &&

Loading answer...

} {error &&

Error: {error.message}

} {data && (

Generated Answer:

{data.answer}

{data.citations.length > 0 && (

Citations:

)}
)}
); } export default App; ``` -------------------------------- ### Setup Example Communities Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/README.md Sets up two scratch orgs with Quantic components and example communities: one with LWS enabled and one with LWS disabled. This command also configures and deploys everything needed for fully working examples. ```bash pnpm run setup:examples ``` -------------------------------- ### Verify Installation with Recommendation Engine (CDN) Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-recommendation.md Verify installation by building a recommendation engine, fetching recommendations, and rendering them to an HTML list. This example is for use in an HTML page loaded via CDN. ```html Headless Recommendation Getting Started

Recommendation Quick Start

    ``` -------------------------------- ### Start Bueno in Development Mode Source: https://github.com/coveo/ui-kit/blob/main/packages/bueno/README.md Run this command to start the project in development mode. Ensure dependencies are installed and packages are linked. ```bash pnpm run dev ``` -------------------------------- ### Deploy Example Components Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/docs/adding-tests.md Use this command to deploy the example components to your scratch org. ```bash pnpm run deploy:examples --target-org Quantic__LWS_enabled ``` -------------------------------- ### Verify Installation with a Search Example (CDN/HTML) Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started.md Demonstrates how to verify Headless installation in an HTML page by building a search engine, executing a search, and rendering result titles to the DOM. This uses the ES Module CDN import. ```html Headless Getting Started

    Headless Quick Start

      ``` -------------------------------- ### Verify Installation with a Search Example (Node.js/Bundler) Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started.md Build a search engine, execute an initial search, and log the number of results received. This confirms Headless is installed and functional in a Node.js or module bundler environment. ```typescript import { buildSearchEngine, buildResultList, getSampleSearchEngineConfiguration, } from '@coveo/headless'; const engine = buildSearchEngine({ configuration: getSampleSearchEngineConfiguration(), }); const resultList = buildResultList(engine); resultList.subscribe(() => { const {results} = resultList.state; if (results.length) { console.log(`Received ${results.length} results.`); console.log('First result:', results[0].title); } }); engine.executeFirstSearch(); ``` -------------------------------- ### Setup Engine - Thermidor Source: https://github.com/coveo/ui-kit/blob/main/packages/thermidor/docs/examples.md Demonstrates the initial setup of the Engine, which is a prerequisite for all other examples. The engine starts empty and requires configuration before API calls can be made. ```typescript import { Engine } from '@coveo/thermidor'; // Create an engine (store starts empty) const engine = new Engine(); ``` -------------------------------- ### Install and Run Sample Locally Source: https://github.com/coveo/ui-kit/blob/main/samples/CONTRIBUTING.md Install dependencies and run the sample development server locally. Verify it runs correctly. ```bash pnpm install pnpm dev # Verify it runs ``` -------------------------------- ### Basic Example with CDN and Initialization Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-hosted-page/README.md A complete HTML example demonstrating how to include and initialize the component using a CDN. ```html Atomic Hosted Page Example ``` -------------------------------- ### Install @coveo/create-atomic globally and use Source: https://github.com/coveo/ui-kit/blob/main/packages/create-atomic/README.md Install the package globally and then use the create-atomic command to initialize a new project. ```bash npm install -g @coveo/create-atomic create-atomic myapp ``` -------------------------------- ### Deploy Example Quantic Components Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/README.md Deploys the example Quantic components to a specified target org alias. ```bash pnpm run deploy:examples Quantic__LWS_enabled ``` -------------------------------- ### Install All Dependencies Source: https://github.com/coveo/ui-kit/blob/main/README.md Run this command to install all project dependencies and link local packages. ```sh pnpm install ``` -------------------------------- ### Commerce API Example Setup Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/storybook-utils/api/USAGE.md Set up mock handlers for the Commerce API, including modifying base responses and integrating with a commerce interface decorator. This example demonstrates configuring a component's meta object for commerce-related stories. ```typescript import {MockCommerceApi} from '@/storybook-utils/api/commerce/mock'; import {wrapInCommerceInterface} from '@/storybook-utils/commerce/commerce-interface-wrapper'; const commerceApiHarness = new MockCommerceApi(); // Modify base to show fewer products commerceApiHarness.searchEndpoint.mock((response) => ({ ...response, products: response.products.slice(0, 12), })); const {decorator, play} = wrapInCommerceInterface(); const meta: Meta = { component: 'atomic-commerce-product-list', decorators: [decorator], parameters: { msw: { handlers: [...commerceApiHarness.handlers], }, }, play, }; export default meta; export const Default: Story = {}; export const NoProducts: Story = { beforeEach: () => { commerceApiHarness.searchEndpoint.mockOnce((response) => ({ ...response, products: [], totalCount: 0, })); }, play, }; ``` -------------------------------- ### Start the Server with npm Source: https://github.com/coveo/ui-kit/blob/main/samples/headless-ssr/commerce-express/README.md Run this command to start the Express server. Access the application at http://localhost:3000. ```bash npm start ``` -------------------------------- ### Verify Installation with Recommendation Engine (Node.js/Bundler) Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-recommendation.md Build a recommendation engine, fetch recommendations, and log the results to verify installation in a Node.js or module bundler environment. ```typescript import { buildRecommendationEngine, buildRecommendationList, getSampleRecommendationEngineConfiguration, } from '@coveo/headless/recommendation'; const engine = buildRecommendationEngine({ configuration: getSampleRecommendationEngineConfiguration(), }); const recommendationList = buildRecommendationList(engine); recommendationList.subscribe(() => { const {recommendations} = recommendationList.state; if (recommendations.length) { console.log(`Received ${recommendations.length} recommendations.`); console.log('First recommendation:', recommendations[0].title); } }); recommendationList.refresh(); ``` -------------------------------- ### Start Development Server Source: https://github.com/coveo/ui-kit/blob/main/samples/headless/rga-angular/README.md Use this command to start the local development server for the Angular application. ```bash pnpm run start ``` -------------------------------- ### Start Development Server with npm Source: https://github.com/coveo/ui-kit/blob/main/samples/atomic/search-commerce-angular/README.md Use this command to start the development server. The application will automatically reload on source file changes. ```bash npm run dev ``` -------------------------------- ### Install Atomic React Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-react/README.md Install the Atomic React library using npm. ```bash npm i @coveo/atomic-react ``` -------------------------------- ### Initialize atomic-search-interface with Headless Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/search/Introduction.mdx Example of initializing an `atomic-search-interface` using `getSampleSearchEngineConfiguration` from `@coveo/headless`. This is for demonstration and not production-ready. ```html Example Search Page ``` -------------------------------- ### Install @coveo/auth Source: https://github.com/coveo/ui-kit/blob/main/packages/auth/README.md Install the @coveo/auth package using npm. ```bash npm i @coveo/auth ``` -------------------------------- ### Build for Production and Start SSR Server Source: https://github.com/coveo/ui-kit/blob/main/samples/headless/search-react/README.md Commands to build the application for production and then start the server-side rendering (SSR) production server. ```bash npm run build npm run prod:ssr ``` -------------------------------- ### Setup Generative Interface and Converse Controller Source: https://github.com/coveo/ui-kit/blob/main/packages/thermidor/docs/generative-interface.md Initialize the Engine and build the Generative Interface and Converse Controller. This setup should be done once per application. ```typescript // generative-setup.ts import { Engine, buildGenerativeInterface, buildConverseController, } from '@coveo/thermidor'; const engine = new Engine({ configuration: {organizationId: '...', accessToken: '...'}, navigatorContextProvider: () => ({ clientId: sessionStorage.getItem('clientId') ?? crypto.randomUUID(), location: window.location.href, referrer: document.referrer, userAgent: navigator.userAgent, }), }); const generativeInterface = buildGenerativeInterface({engine}); export const converseController = buildConverseController({ interface: generativeInterface, }); ``` -------------------------------- ### Install @coveo/shopify Package Source: https://github.com/coveo/ui-kit/blob/main/packages/shopify/README.md Install the package using npm or yarn. ```bash npm install @coveo/shopify # or yarn add @coveo/shopify ``` -------------------------------- ### Start Production App Source: https://github.com/coveo/ui-kit/blob/main/samples/headless-ssr/commerce-react-router/README.md Execute this command to run your application in production mode after building. ```shell npm start ``` -------------------------------- ### Install via npm Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-hosted-page/README.md Install the atomic-hosted-page package using npm for use in your project. ```bash npm install @coveo/atomic-hosted-page ``` -------------------------------- ### Start the Mock Converse API Server Source: https://github.com/coveo/ui-kit/blob/main/packages/mock-converse-api/README.md Run this command to start the server. You can specify a custom port using the PORT environment variable. ```bash pnpm start ``` ```bash # Or with a custom port PORT=4000 pnpm start ``` -------------------------------- ### Initialize atomic-search-interface with a Shared Engine Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/search/Introduction.mdx Example of initializing an `atomic-search-interface` with a pre-built search engine instance from `@coveo/headless`. ```html Example Search Page ``` -------------------------------- ### Example Quantic Greeting Component JavaScript Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/docs/adding-tests.md This JavaScript file manages the state and behavior of the example greeting component, handling user input from the configurator. ```javascript import {LightningElement, track} from 'lwc'; export default class ExampleQuanticGreeting extends LightningElement { // `config` stores the options retrieved from the configurator. @track config = {}; isConfigured = false; pageTitle = 'Quantic Greeting'; pageDescription = 'The Quantic Greeting renders a greeting message given a name.'; // `options` is used by `configurator` to render the configuration form. options = [ { attribute: 'name', label: 'Name', description: 'The name to display in the greeting message.', defaultValue: 'World', }, ]; handleTryItNow(evt) { this.config = evt.detail; // Setting this to `true` makes the `preview` slot visible, // which also loads the Quantic component with the configured options. this.isConfigured = true; } } ``` -------------------------------- ### Install @coveo/create-atomic with npx Source: https://github.com/coveo/ui-kit/blob/main/packages/create-atomic/README.md Use this command to initialize a new Coveo Atomic project using npx. ```bash npx @coveo/create-atomic myapp ``` -------------------------------- ### Install @coveo/create-atomic with npm Source: https://github.com/coveo/ui-kit/blob/main/packages/create-atomic/README.md Use this command to initialize a new Coveo Atomic project using npm. ```bash npm init @coveo/atomic myapp ``` -------------------------------- ### Verify Commerce Installation in Node.js Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-commerce.md Build a commerce engine with sample configuration, execute a search, and log results to verify installation in a module bundler or Node.js project. ```typescript import { buildCommerceEngine, buildSearch, getSampleCommerceEngineConfiguration, } from '@coveo/headless/commerce'; const engine = buildCommerceEngine({ configuration: getSampleCommerceEngineConfiguration(), }); const search = buildSearch(engine); search.subscribe(() => { const {products} = search.state; if (products.length) { console.log(`Received ${products.length} products.`); console.log('First product:', products[0].ec_name); } }); search.executeFirstSearch(); ``` -------------------------------- ### Install via CDN Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-hosted-page/README.md Include the component directly from the CDN in your HTML. ```html ``` -------------------------------- ### Verify Commerce Installation in HTML Page (CDN) Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-commerce.md Verify installation by building a commerce engine, executing a search, and rendering product names in an HTML page loaded via CDN. ```html Headless Commerce Getting Started

      Commerce Quick Start

        ``` -------------------------------- ### Run Development Server Source: https://github.com/coveo/ui-kit/blob/main/samples/headless-ssr/commerce-react-router/README.md Execute this command to start the development server with hot module replacement enabled. ```shellscript npm run dev ``` -------------------------------- ### Build Date Range with Relative Dates Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/src/controllers/core/facets/range-facet/date-facet/relative-date-format.md Use the `buildDateRange` utility to construct date ranges with relative date formats. This example shows how to specify a start date in the past week and an end date as 'now'. ```javascript buildDateRange({ start: {period: 'past', unit: 'week', amount: 2}, end: {period: 'now'}, }); // returns {start: 'past-2-week', end: 'now', endInclusive: false, state: 'idle'} ``` -------------------------------- ### Initialize Recommendation Engine with Sample Configuration Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/concepts.md This snippet demonstrates how to initialize a recommendation engine using sample configuration. It's useful for testing and requires importing specific functions from '@coveo/headless/recommendation'. ```typescript import { buildRecommendationEngine, getSampleRecommendationEngineConfiguration, } from '@coveo/headless/recommendation'; export const recommendationEngine = buildRecommendationEngine({ configuration: getSampleRecommendationEngineConfiguration(), }); ``` -------------------------------- ### Install Dependencies Source: https://github.com/coveo/ui-kit/blob/main/samples/atomic/search-vuejs/README.md Install the necessary packages for the Vue.js search application. ```sh npm install npm run dev ``` ```sh npm install --save @coveo/atomic ``` ```sh npm install --save-dev ncp ``` -------------------------------- ### Install Dependencies with npm Source: https://github.com/coveo/ui-kit/blob/main/samples/atomic/search-commerce-angular/README.md Run this command in your terminal to install the necessary project dependencies. ```bash npm install ``` -------------------------------- ### Initialize Search Engine with Sample Configuration Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/concepts.md Use this snippet to initialize a search engine with sample configuration for testing purposes. It imports the necessary builder and configuration functions from '@coveo/headless'. ```typescript import { buildSearchEngine, getSampleSearchEngineConfiguration, } from '@coveo/headless'; export const headlessEngine = buildSearchEngine({ configuration: getSampleSearchEngineConfiguration(), }); ``` -------------------------------- ### Generate Documentation - All Stages Source: https://github.com/coveo/ui-kit/blob/main/packages/headless-react/CONTRIBUTING.md Run this command to execute both stages of documentation generation sequentially. ```bash pnpm run build:typedoc ``` -------------------------------- ### Initialize atomic-commerce-interface Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/commerce/Introduction.mdx Example of initializing an `atomic-commerce-interface` using sample configuration from `@coveo/headless/commerce`. Ensure correct component hierarchy and engine configuration for functionality. ```html Example Commerce Interface ``` -------------------------------- ### StateSelector Type and Example Source: https://github.com/coveo/ui-kit/blob/main/packages/thermidor/docs/glossary.md Defines a type for pure functions that extract data from state and provides an example. ```typescript type StateSelector = (state: State) => T; // Example const query: StateSelector = (state) => state.searchBox?.query ?? ''; ``` -------------------------------- ### Install SFDX CLI Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/README.md Installs the Salesforce CLI globally using pnpm. Ensure you are using version 2.x. ```bash pnpm add --global @salesforce/cli@2.x ``` -------------------------------- ### Remark Examples for Criteria Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-a11y/docs/manual-audit-guide.md Provides examples of well-written remarks for different conformance levels, focusing on clarity for non-technical readers. ```text Supports — `Headings follow a logical hierarchy, and facet, sort, and pager controls have descriptive labels across the search interface.` ``` ```text Partially Supports — `Most interactive controls show a visible focus indicator; facet checkboxes in the refine modal do not, so keyboard users can lose track of focus there.` ``` ```text Does Not Support — `When the refine modal is open, keyboard focus can move to a control hidden behind the modal, so a keyboard user cannot see what is focused.` ``` ```text Not Applicable — `The search interface contains no prerecorded audio or video content.` ``` -------------------------------- ### Preview Generated Documentation Locally Source: https://github.com/coveo/ui-kit/blob/main/packages/headless-react/CONTRIBUTING.md Use this command to serve and preview the generated documentation locally before deployment. ```bash pnpm run serve:typedoc ``` -------------------------------- ### Query Suggestion API Response Example Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/highlighting.md Example JSON response from the querySuggest API, illustrating the 'highlighted' field for query suggestions. ```json { "completions": [ { "expression": "pdf", "score": 1019.0259590148926, "highlighted": "{pdf}", "executableConfidence": 1.0, "objectId": "20c05008-3afc-5f4e-9695-3ec326a5f745" }, { "expression": "filetype pdf", "score": 19.025959014892578, "highlighted": "[filetype] {pdf}", "executableConfidence": 1.0, "objectId": "39089349-6e45-5c18-991c-7158143ec468" } ], "responseId": "9373a3c0-2c5c-4c9d-8adf-8bffd253ae3d" } ``` -------------------------------- ### Initialize atomic-recs-interface with Sample Configuration Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/recommendations/Introduction.mdx Use this snippet to initialize an `atomic-recs-interface` with a sample configuration from `@coveo/headless`. This is suitable for development and testing purposes. ```html Example Recommendations ``` -------------------------------- ### Nested E2E Scripts Example Source: https://github.com/coveo/ui-kit/blob/main/internal-docs/scripts-and-tasks.md Shows an example of nested scripts where the nested script provides an alternative configuration for the parent script. ```json { "e2e": "playwright test", "e2e:watch": "playwright test --ui" } ``` -------------------------------- ### Start Development Server with pnpm Source: https://github.com/coveo/ui-kit/blob/main/samples/atomic/search-commerce-react/README.md Starts the Vite development server with hot reload enabled. Access the application at http://localhost:5173. ```bash pnpm dev ``` -------------------------------- ### Install Coveo UA Library Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/headless-view-events.md Install the Coveo UA library using npm. Ensure a module bundler like webpack is configured. ```bash npm i coveo.analytics ``` -------------------------------- ### Install Headless SSR via npm Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-ssr-search.md Install the `@coveo/headless` package using npm. It's recommended to pin the dependency to a specific version. ```bash npm install @coveo/headless@{{packageVersion}} ``` -------------------------------- ### Using the CDN with Initialization Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic-hosted-page/README.md Include the component script from the CDN and initialize it in your HTML. ```html ``` -------------------------------- ### Example Quantic Greeting Component HTML Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/docs/adding-tests.md This HTML template defines the structure for the example greeting component, including the layout and configuration slots. ```html ``` -------------------------------- ### Headless Search Engine Configuration with Sample Token Source: https://github.com/coveo/ui-kit/blob/main/samples/CONTRIBUTING.md Illustrates how to configure the Headless Search engine using embedded sample credentials. ```typescript // Headless Search — uses embedded sample token import {getSampleSearchEngineConfiguration} from '@coveo/headless'; ``` -------------------------------- ### Initialize Commerce Engine with Headless Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/commerce/Introduction.mdx Configure and build a headless commerce engine. This script sets up the engine with a site configuration, including a fallback URL and dynamic view URL based on the page title. It exports the configured engine for use in other modules. ```javascript // engine.mjs const { buildCommerceEngine, getSampleCommerceEngineConfiguration } = await import('https://static.cloud.coveo.com/headless/v3/commerce/headless.esm.js'); const siteRoot = 'https://www.example.com/'; const fallbackResourceUrl = `${siteRoot}/search`; const siteConfig = { 'Example': {href: 'index.html', label: 'Home', resourceUrl: `${siteRoot}/search`}, }; const {context, ...restOfConfiguration} = getSampleCommerceEngineConfiguration(); let viewUrl = siteConfig[document.title]?.resourceUrl; if (!viewUrl) { console.warn(`No resource URL found for page title "${document.title}". Using fallbackResourceUrl.`); viewUrl = fallbackResourceUrl; } export const commerceEngine = buildCommerceEngine({ configuration: { context: { ...context, view: { url: viewUrl }, }, ...restOfConfiguration, }, }); ``` -------------------------------- ### Nested Build Scripts Example Source: https://github.com/coveo/ui-kit/blob/main/internal-docs/scripts-and-tasks.md Demonstrates how build scripts can be nested using the colon symbol, either as fragments or alternative configurations. ```json { "build": "npm run build:bundles && npm run build:definitions", "build:bundles": "...", "build:definitions": "..." } ``` -------------------------------- ### Initialize with App Proxy Configuration Source: https://github.com/coveo/ui-kit/blob/main/packages/shopify/README.md Combine the init function with fetchAppProxyConfig to initialize the integration using fetched configuration. ```typescript import {init, fetchAppProxyConfig} from '@coveo/shopify/utilities'; const config = await fetchAppProxyConfig({ marketId: 'market_123432', }); init(config); ``` -------------------------------- ### Install Headless React for Commerce SSR Source: https://github.com/coveo/ui-kit/blob/main/packages/headless-react/source_docs/getting-started-with-commerce-ssr.md Install the necessary packages for server-side rendering with Commerce SSR utilities. It's recommended to pin the version for stability. ```bash npm install @coveo/headless-react@{{packageVersion}} react react-dom ``` -------------------------------- ### Build for Production Source: https://github.com/coveo/ui-kit/blob/main/samples/headless-ssr/commerce-react-router/README.md Run this command to build your application for production deployment. ```shell npm run build ``` -------------------------------- ### Verify Case Assist Installation Source: https://github.com/coveo/ui-kit/blob/main/packages/headless/source_docs/getting-started-case-assist.md Build a Case Assist engine, create a case input controller, and subscribe to its state. Requires valid Coveo organization credentials and a case assist configuration ID. ```typescript import { buildCaseAssistEngine, buildCaseInput, } from '@coveo/headless/case-assist'; const engine = buildCaseAssistEngine({ configuration: { organizationId: '', accessToken: '', caseAssistId: '', }, }); const caseInput = buildCaseInput(engine, {options: {field: 'subject'}}); caseInput.subscribe(() => { console.log('Case input state:', caseInput.state); }); ``` -------------------------------- ### Example Quantic Greeting Component Meta XML Source: https://github.com/coveo/ui-kit/blob/main/packages/quantic/docs/adding-tests.md This XML file exposes the example greeting component to various Salesforce targets, including community pages. ```xml 50.0 true lightning__RecordPage lightning__AppPage lightning__HomePage lightningCommunity__Page lightningCommunity__Default ``` -------------------------------- ### Build Search Engine with Headless Source: https://github.com/coveo/ui-kit/blob/main/packages/atomic/src/components/search/Introduction.mdx Example of building a search engine instance using `@coveo/headless`. This engine can be shared across multiple interfaces. ```javascript // engine.mjs const { buildSearchEngine, getSampleSearchEngineConfiguration } = await import('http://static.cloud.coveo.com/headless/v3/headless.esm.js'); export const searchEngine = buildSearchEngine({ configuration: getSampleSearchEngineConfiguration(), }); ```