SearchPanel Plugin Reference

A plugin that renders the Search Panel.

Import

Use the following statement to import a plugin with embedded theme components:

import { SearchPanel } from '@devexpress/dx-react-grid-material-ui';
// import { SearchPanel } from '@devexpress/dx-react-grid-bootstrap4';
// import { SearchPanel } from '@devexpress/dx-react-grid-bootstrap3';

If you want to use custom components, you can import the themeless plugin:

import { SearchPanel } from '@devexpress/dx-react-grid';

User Reference

Dependencies

Properties

Name Type Default Description
inputComponent ComponentType<SearchPanel.InputProps>   A component that renders the Search Panel input element.
messages? SearchPanel.LocalizationMessages   An object that specifies localization messages.

Interfaces

SearchPanel.InputProps

Describes properties passed to a component that renders the Search Panel root element.

Field Type Description
value string Specifies the search value.
onValueChange (value: string) => void Handles the search value changes.
getMessage (messageKey: string) => string Returns a specified localization message.

Localization Messages

Field Type Default Description
searchPlaceholder? string ‘Search…’ The search editor placeholder text.

Plugin Components

Name Properties Description
SearchPanel.Input SearchPanel.InputProps A component that renders the Search Panel input element.

Additional properties are added to the component’s root element.

Plugin Developer Reference

Imports

Name Plugin Type Description
searchValue Getter string The applied search value.
changeSearchValue Action (value:string) => void Fires the onValueChange event with the corresponding value and changes the search value state.

Exports

none