advancedSearchDelimiter | string | | Delimiter in the query string for pairing attributes with search values.
Required whenever attributes are passed as props. |
appendTo | HTMLElement | (() => HTMLElement) | 'inline' | | The container to append the menu to.
If your menu is being cut off you can append it to an element higher up the DOM tree.
Some examples:
appendTo={() => document.body}
appendTo={document.getElementById('target')} |
aria-label | string | | An accessible label for the search input. |
attributes | string[] | SearchInputSearchAttribute[] | | Array of attribute values used for dynamically generated advanced search. |
className | string | | Additional classes added to the search input. |
expandableInput | SearchInputExpandable | | Object that makes the search input expandable/collapsible. |
formAdditionalItems | React.ReactNode | | |
hasWordsAttrLabel | React.ReactNode | | Attribute label for strings unassociated with one of the provided listed attributes. |
hint | string | | A suggestion for autocompleting. |
isAdvancedSearchOpen | boolean | | A flag for controlling the open state of a custom advanced search implementation. |
isDisabled | boolean | | Flag indicating if search input is disabled. |
isNextNavigationButtonDisabled | boolean | | Flag indicating if the next navigation button is disabled. |
isPreviousNavigationButtonDisabled | boolean | | Flag indicating if the previous navigation button is disabled. |
name | string | | Name attribue for the search input |
nextNavigationButtonAriaLabel | string | | Accessible label for the button to navigate to next result. |
onChange | (event: React.FormEvent<HTMLInputElement>, value: string) => void | | A callback for when the input value changes. |
onClear | (event: React.SyntheticEvent<HTMLButtonElement>) => void | | A callback for when the user clicks the clear button. |
onNextClick | (event: React.SyntheticEvent<HTMLButtonElement>) => void | | A callback for when the user clicks to navigate to next result. |
onPreviousClick | (event: React.SyntheticEvent<HTMLButtonElement>) => void | | A callback for when the user clicks to navigate to previous result. |
onSearch | (
event: React.SyntheticEvent<HTMLButtonElement>,
value: string,
attrValueMap: { [key: string]: string }
) => void | | A callback for when the search button is clicked. |
onToggleAdvancedSearch | (event: React.SyntheticEvent<HTMLButtonElement>, isOpen?: boolean) => void | | A callback for when the open advanced search button is clicked. |
openMenuButtonAriaLabel | string | | Accessible label for the button which opens the advanced search form menu. |
placeholder | string | | Placeholder text of the search input. |
previousNavigationButtonAriaLabel | string | | Accessible label for the button to navigate to previous result. |
resetButtonLabel | string | | Label for the button which resets the advanced search form and clears the search input. |
resultsCount | number | string | | The number of search results returned. Either a total number of results,
or a string representing the current result over the total number of results. i.e. "1 / 5". |
submitSearchButtonLabel | string | | Label for the button which calls the onSearch event handler. |
value | string | | Value of the search input. |
zIndex | number | | z-index of the advanced search form when appendTo is not inline. |