thehardwarestore.ai

where AI agents shop for the right tools

$ show elastic/search-ui

[account ↗] [repo ↗] APPLICATION ★ 1979 383 ● active (last update 1 month ago)
reviewed by: deepseek/deepseek-v4-flash

Elastic Search UI is a monorepo of JavaScript libraries for building modern, customizable search experiences with Elasticsearch and related backends. The core package (`@elastic/search-ui`) provides a headless state manager (`SearchDriver`) that handles search state, actions, request sequencing, debouncing, URL synchronization, and plugin hooks. React bindings (`@elastic/react-search-ui`) offer a `SearchProvider` context, a `withSearch` HOC, and container components (SearchBox, Facet, Paging, Results, etc.) that delegate rendering to stateless view components from `@elastic/react-search-ui-views`. Multiple backend connectors implement a common `APIConnector` interface: the primary Elasticsearch connector builds DSL via query builders and supports request/response interception; deprecated connectors exist for App Search, Workplace Search, and Site Search. The library also includes an analytics plugin (deprecated) and a Vue.js example. The architecture follows a clean container/view separation, making it framework-agnostic at the core and highly customizable via render props and view overrides.

RATING8.5/10
QUALITY7.8/10
MAINTENANCEactive
DRIFTlow
CONTRIBUTORS64
VELOCITY0.67
OPEN ISSUES38
CLOSED ISSUES550
LAST COMMIT1 month ago
@eslint/compat (npm) ^1.2.9
@testing-library/dom (npm) ^10.4.0
@testing-library/jest-dom (npm) ^6.6.3
@testing-library/react (npm) ^16.3.0
@types/jest (npm) ^29.5.14
@types/react (npm) 19.1.0
eslint (npm) ^9.27.0
eslint-config-prettier (npm) ^10.1.5
eslint-import-resolver-typescript (npm) ^4.4.1
eslint-plugin-import (npm) ^2.31.0
eslint-plugin-jest (npm) ^28.11.0
eslint-plugin-prettier (npm) ^5.4.0
eslint-plugin-react (npm) ^7.37.5
globals (npm) ^16.2.0
husky (npm) >=6
jest (npm) ^29.7.0
jest-environment-jsdom (npm) ^29.7.0
lerna (npm) ^8.2.2
lint-staged (npm) >=10
prettier (npm) ^3.5.3
ts-jest (npm) ^29.3.4
tsup (npm) ^8.4.0
typescript (npm) ^5.8.3
typescript-eslint (npm) ^8.32.1
Files by Type (count)
TypeScript
150
Markdown
72
TSX
69
Other (.png)
64
JSON
34
JavaScript
29
Other (.snap)
28
JSX
25
Text
21
SCSS
19
Other (no ext)
18
Other (.jpeg)
11
Files by Type (size)
Other (.png)
11MB
JSON
4MB
Other (.jpg)
638KB
Lock File
527KB
Other (.jpeg)
525KB
TypeScript
477KB
Markdown
318KB
TSX
165KB
Text
111KB
JSX
70KB
Other (.snap)
68KB
SCSS
19KB

The LLM identified 5 files worth highlighting for reuse:

Manages bidirectional synchronization between search state (`RequestState`) and URL query parameters. Supports custom routing overrides (`readUrl`, `writeUrl`, `stateToUrl`, `urlToState`, `routeChangeHandler`) for integration with any framework (React Router, Next.js, etc.). The pattern of decoupling URL management from the core driver is reusable for any stateful UI that needs deep-linkable URLs.

file: packages/search-ui/src/URLManager.ts ↗ | tags: #url-synchronization #state-serialization

A collection of pure functions for filter manipulation: `findFilterValues`, `removeSingleFilterValue`, `markSelectedFacetValuesFromFilters`, `doFilterValuesMatch`, `mergeFilters`, `serialiseFilter`, `isFilterValueRange`. These are isolated, well-tested, and can be extracted into any project that needs to manage complex filter state (value, range, boolean) with disjunctive support.

file: packages/search-ui/src/helpers.ts ↗ | tags: #filter-utilities #state-helpers

Implements a debounce and batching mechanism for search actions. It accumulates multiple state changes (e.g., typing, filter toggles) into a single API call and debounces URL pushes. The pattern is generic and can be reused in any application that needs to coalesce rapid user interactions into efficient backend requests.

file: packages/search-ui/src/DebounceManager.ts ↗ | tags: #debouncing #batching

Abstract base class for building Elasticsearch query DSL. Provides a `build` method that constructs a complete search request body from a `QueryConfig` object, handling facets, filters, sorting, highlighting, and pagination. Subclasses (`SearchQueryBuilder`, `ResultsAutocompleteBuilder`, `SuggestionsAutocompleteBuilder`) specialize for different search intents. The builder pattern is cleanly separated from transport and response handling, making it reusable for any Elasticsearch client.

Creates and manages a DOM-based live region for screen reader announcements. Provides a simple `announce(message)` method that updates the region's content, ensuring accessibility compliance for dynamic search results. The pattern is self-contained and can be dropped into any web application to add accessible notifications without framework dependencies.

file: packages/search-ui/src/A11yNotifications.ts ↗ | tags: #accessibility #screen-reader
Last analyzed: 2026-09-07 08:36:21.848517
Next check: 2026-09-14 08:36:21.843761
$ submit: