SearchEmbedOptions

The SearchEmbedOptions object contains details on the embedding of search , including instance properties and custom style settings.

Constructor

searchEmbedOptions{ theme:string, contentTheme?:string, contentThemeOverrides?:customTheme , appStyles?: appstyles, locale?:string, hideChat?:boolean, dataModelId?: string, onSearch?: function (), onCloseChat?: function (), onPreviewChange?: function () }: searchEmbedOptions

Use this to set the details for embedding search.

  • Theme is a string to drive the main UI color scheme - which can be fully customized with styles (below). Required. Colors are:
    • "dark"
    • "light" (default)
  • ContentTheme is a string of the ID for a design theme that should be used to stylize the content itself. It's optional, and the original content theme will be used if it is not supplied. The content theme specified is a theme designed inside the application. You can adjust the theme settings using the contentThemeOverrides property (see below).
  • ContentThemeOverrides is an optional customTheme object of settings to customize the content theme (added in its own above property). The custom theme can cover an entire set of theme settings, or override a selection of settings.
  • AppStyles is the optional search AppStyle object of settings to highly customize the embedded client application's appearance. It does NOT change the look a feel of analytic content.
  • The locale string can be used to change the localization of the embed client's UI to one of the supported application languages. Note this is only relevant with anonymous embedding.
  • The hideChat boolean can be used to hide the Chatbot UI that will be invoked when producing the preview results. This is useful when you want users to only ask questions from the search bar, and not use the iterative chatting experience.
  • The dataModelId string can be used to set the default data model to be used for the queries programmatically. If not set, the end user will be prompted to select a model that they wish to query. Using REST APIs, developers can build their own mechanisms to retrieve the model ID or take it fro the main client application.
  • The optional onSearch callback function is triggered once the initial search operation has started. Use this mechanism can be used for any external operation, including the option to change the UI based on the launch of the search function.
  • The optional onCloseChat callback function is triggered once the Chatbot UI is closed.
  • The optional onPreviewChange callback function is triggered once the preview result is changed by new instructions submitted via the Chatbot.

Example

The following instantiates a new search with the following embed options: light theme, US English locale, adjustment to the app styling, the 't1' content theme, with some customization, a hook-up to a given data model, and the chatbot enabled. All the events have not been set.

const embedSearchOptions = {
	theme: 'light',
	locale: 'en-US',
	appStyles: { global: { font: '...' } },
	contentTheme: 't1',
	contentThemeOverrides: { General: { generalColor1: '...' } },
	dataModelId: 'c20d42b4-be24-47cf-b711-d5782f048987',

	hideChat: false,
	onSearch: () => {
		// search started
	},
				
	onCloseChat: () => {
		// chatbot closed
	},
				
	onPreviewChange: (hasPreview) => {
		// chatbot preview changed
	}
};

const searchApi = await embedClient.search(searchContainer, previewContainer, embedSearchOptions);