A Headless Search UI library

Downloads in past


1,712571.18.03 days ago4 years agoMinified + gzip package size for @elastic/search-ui in KB


Part of the Search UI project.
The "Headless Search UI" that serves as a foundation for the react-search-ui library.
If you are not using React, this library can be used in conjunction with any other framework. Instead of working with components as you do in React, you simply work directly with state and actions. These are documented in the State and Actions sections of the documentation.
You'll get all of the benefit of Search UI, just with no view. The view is up to you.


npm install --save @elastic/search-ui

import { SearchDriver } from "@elastic/search-ui";
import AppSearchAPIConnector from "@elastic/search-ui-app-search-connector";

const connector = new AppSearchAPIConnector({
  searchKey: "search-371auk61r2bwqtdzocdgutmg",
  engineName: "search-ui-examples",
  hostIdentifier: "host-2376rb"

const config = {
  apiConnector: connector

const driver = new SearchDriver(config);

driver.subscribeToStateChanges((state) =>
  console.log(`Received ${state.totalResults} results for your search!`)


// Received 8 results for your search!


All configuration is documented in the Configuration section of the Advanced README.

SearchDriver Usage


| method | params | return | description | | ------------------------- | -------- | ------------------------------------------------------------- | -------------------------------------------------------------------- | | subscribeToStateChanges | function | | Function to execute when state changes. ex.

(state) => {} | | getActions | | Actions | All available actions. | | getState | | State | Current state. |