Home > @findkit/ui > SearchEngine
SearchEngine class
A class for the internal logic and state of the search ui
This includes
- managing the search requests - input value throttling - keyboard navigation - query string monitoring
This is basically a wrapper around a Valtio proxy object.
The data flow is as follows: - User types in the input - The input events are throttled and the search term is copied to the query string (fdk_q by default) - A query string change is deteted and the search is triggered - Once the search completes the results are put into the Valtio state with the used search terms
Eg. the search is always triggered from the query string change. This means it is also possible to trigger the search with history.pushState() or history.replaceState() and input value will updated to match it unless the input is focused.
Signature:
export declare class SearchEngine
Constructors
| Constructor | Modifiers | Description |
|---|---|---|
| (constructor)(options) | Constructs a new instance of the SearchEngine class |
Properties
| Property | Modifiers | Type | Description |
|---|---|---|---|
| bindInput | (input: HTMLInputElement) => () => void | Bind input to search. Returns unbind function. | |
| close | () => void | ||
| closeOnOutsideClick | readonly |
boolean | |
| container | readonly |
Element | ShadowRoot | |
| customRouterDataPrefix? | readonly |
string | (Optional) |
| dispose | () => void | ||
| elementHost | readonly |
ShadowRoot | Document | |
| events | Emitter<FindkitUIEvents, unknown> | ||
| groupKey? | readonly |
string | (Optional) |
| instanceId | readonly |
string | |
| modal | readonly |
boolean | |
| open | (terms?: string, options?: { toggle?: boolean; }) => void | ||
| PRIVATE_announceMessages | string[] | ||
| PRIVATE_announcePending | boolean | ||
| PRIVATE_pendingRequestIds | Map<number, AbortController> | ||
| PRIVATE_requestId | number | ||
| publicToken | readonly |
string | |
| removeInput | (rmInput: HTMLInputElement) => void | ||
| scrollPositionRestore? | number | (Optional) Restored inside the Modal and Plain components | |
| searchKey? | readonly |
string | (Optional) |
| separator | readonly |
string | |
| state | readonly |
State | |
| updateAddressBar | (next: FindkitURLSearchParams, options?: { push?: boolean; ignore?: boolean; }) => void | ||
| updateGroups | <T extends GroupDefinition<SearchParams>[]>(groupsOrFn: UpdateGroupsArgument<T>) => void | ||
| updateParams | <T extends SearchParams>(params: UpdateParamsArgument<T>) => void | Convenience method for updating on the first group in single group scenarios |
Methods
| Method | Modifiers | Description |
|---|---|---|
| activateGroup(groupId) | ||
| addTranslation(lang, translation, custom) | ||
| clearGroup() | ||
| createTranslator(options) | ||
| focusFirstHit() | ||
| formatHref(params) | ||
| getCustomRouterData(initial) | ||
| getGroups() | ||
| getNextTerms() | ||
| getParams() | ||
| getUniqId(id) | ||
| PRIVATE_createContainer(customContainer) | ||
| PRIVATE_getBoundInput(el) | ||
| PRIVATE_getDialog() | ||
| PRIVATE_handleCustomInert() | Handle setting custom inert elements | |
| PRIVATE_restoreFocusOnModalClose() | Restore focus to the previously active element when the modal is closed | |
| retry() | ||
| saveVisitedHitId(hitId) | ||
| searchMore(options) | ||
| setCustomRouterData(data, initial) | ||
| setLang(lang) | ||
| setTerms(terms) | ||
| start() | "Start the search engine" eg. start listening to input, url etc. changes. This is in separate method so the users can modify the engine state before it starts listening to changes. For example this allows users to modify the ui object with updateParams() in the "loaded" and "language" event without extra search reqeusts. |